Back to Shark UI

Prose

docs/components/prose

latest10.3 KB
Original Source

Sections

Components

Utilities

Forms

Hooks

Prose

Copy Markdown

Typography styles for HTML content.

PreviewCode

Taxing Laughter: The Joke Tax Chronicles

Once upon a time, in a far-off land, there was a very lazy king who spent all day lounging on his throne. One day, his advisors came to him with a problem: the kingdom was running out of money.

The King's Plan

The king thought long and hard, and finally came up with a brilliant plan: he would tax the jokes in the kingdom.

"After all," he said, "everyone enjoys a good joke, so it's only fair that they should pay for the privilege."

The Joke Tax

The king's subjects were not amused. They grumbled and complained, but the king was firm:

  • 1st level of puns: 5 gold coins
  • 2nd level of jokes: 10 gold coins
  • 3rd level of one-liners : 20 gold coins

As a result, people stopped telling jokes, and the kingdom fell into a gloom. But there was one person who refused to let the king's foolishness get him down: a court jester named Jokester.

Jokester's Revolt

Jokester began sneaking into the castle in the middle of the night and leaving jokes all over the place: under the king's pillow, in his soup, even in the royal toilet. The king was furious, but he couldn't seem to stop Jokester.

And then, one day, the people of the kingdom discovered that the jokes left by Jokester were so funny that they couldn't help but laugh. And once they started laughing, they couldn't stop.

The People's Rebellion

The people of the kingdom, feeling uplifted by the laughter, started to tell jokes and puns again, and soon the entire kingdom was in on the joke.

King's TreasuryPeople's happiness
EmptyOverflowing
ModestSatisfied
FullEcstatic

The king, seeing how much happier his subjects were, realized the error of his ways and repealed the joke tax. Jokester was declared a hero, and the kingdom lived happily ever after.

The moral of the story is: never underestimate the power of a good laugh and always be careful of bad ideas.

Installation#

CLIManual

pnpmbunnpmyarn

pnpm dlx shadcn@latest add @shark/prose

Usage#

import { Prose } from "@/components/ui/prose";
<Prose>
  <h1>Garlic bread with cheese: What the science tells us</h1>
  <p>
    For years parents have espoused the health benefits of eating garlic bread with cheese to their children, with the
    food earning such an iconic status in our culture that kids will often dress up as warm, cheesy loaf for Halloween.
  </p>
  <p>
    But a recent study shows that the celebrated appetizer may be linked to a series of rabies cases springing up around
    the country.
  </p>
</Prose>

Undo prose styles#

Use the not-prose class in a child to exclude it from prose styles. Useful when using components to avoid unwanted styles.

PreviewCode

Davy Jones' locker

Davy Jones' locker is a metaphor for the oceanic abyss, the final resting place of drowned sailors and travellers


Davy Jones' locker

Davy Jones' locker is a metaphor for the oceanic abyss, the final resting place of drowned sailors and travellers

Examples#

H1#

PreviewCode

Taxing Laughter: The Joke Tax Chronicles

H2#

PreviewCode

The People of the Kingdom

H3#

PreviewCode

The Joke Tax

H4#

PreviewCode

People stopped telling jokes

H5#

PreviewCode

People stopped telling jokes

H6#

PreviewCode

People stopped telling jokes

Paragraph#

PreviewCode

The king, seeing how much happier his subjects were, realized the error of his ways and repealed the joke tax.

Blockquote#

PreviewCode

"After all," he said, "everyone enjoys a good joke, so it's only fair that they should pay for the privilege."

Table#

PreviewCode

King's TreasuryPeople's happiness
EmptyOverflowing
ModestSatisfied
FullEcstatic

List#

PreviewCode

  • 1st level of puns: 5 gold coins
  • 2nd level of jokes: 10 gold coins
  • 3rd level of one-liners : 20 gold coins

Ordered list#

PreviewCode

  1. First, gather the ingredients.
  2. Then, mix them together.
  3. Finally, bake for 30 minutes.

PreviewCode

Read more about the joke tax in the kingdom archives.

Media#

PreviewCode

A description of the image.

Kbd#

PreviewCode

Press Ctrl + S to save your work.

Inline code#

PreviewCode

@ark-ui/react

Separator#

PreviewCode

First section of content.


Second section after the divider.

Definition list#

PreviewCode

Joke TaxA levy on humor imposed by the king.JokesterThe court jester who led the revolt.

Details#

PreviewCode

#How did the joke tax end?

The king repealed the tax after seeing how much happier his subjects were. Jokester was declared a hero.

Mark#

PreviewCode

The king's brilliant plan was to tax jokes in the kingdom.

Small#

PreviewCode

Never underestimate the power of a good laugh and always be careful of bad ideas.

API Reference#

Prose#

Root wrapper for typography-styled content.

PropTypeDefault
classNamestring-
asChildbooleanfalse

[

Previous page

Progress ](/docs/components/progress)[

Next page

QR Code ](/docs/components/qr-code)

On This Page

InstallationUsageUndo prose stylesExamplesH1H2H3H4H5H6ParagraphBlockquoteTableListOrdered listLinkMediaKbdInline codeSeparatorDefinition listDetailsMarkSmallAPI ReferenceProse