cThis post checks every Gutenberg block from the AHF blog reference against the headless article styles. Body copy should be 18.5px with 1.75 line height. Citations render as superscript numbers1.
01 Headings
Heading 3 — subsection
Heading 4 — minor heading
Heading 5 — small heading
Heading 6 — uppercase label
02 Paragraph and inline formats
Bold text, italic text, strikethrough, highlighted text, H2O, E=mc2, inline code, and an inline link.
03 Lists
- Unordered item with an orange marker
- Second item
- Nested unordered item
- Another nested item
- Third item
- Fourth item
- Fifth item
- Sixth item (mobile Show more should hide from here)
- Seventh item
- Ordered item with a quiet numeric marker
- Second step
- Nested ordered item
- Third step
04 Quote and pullquote
O you who have believed, decreed upon you is fasting as it was decreed upon those before you that you may become righteous.
Qur’an 2:183
Pullquotes break long reads with a bold, centered statement.
Pullquote variant
05 Table
| Category | Status | Notes |
|---|---|---|
| Row header | Yes | Zebra striping on even rows |
| Second row | No | Horizontal scroll on overflow |
| Third row | Depends | Compact teal header band |
06 Image and alignments


Floated images sit beside the text. Align left floats left with a right margin. Wide and full alignments should extend past the article measure. Text continues to wrap until a clearing element ends the float.
07 Gallery



08 Columns, Media and Text, Cover
Column one
Two equal columns with a gap. Should stack on narrow screens.
Column two
Each column keeps normal body typography; headings keep their scale.

Media and Text
Image on one side, content on the other, vertically centered.
Cover block
Teal panel for standalone statements or section intros inside a post.
09 Embeds
10 Code and Preformatted
<div data-tf-live="FORM_ID"></div>
<script src="//embed.typeform.com/next/embed.js"></script>
Preformatted keeps spacing
11 Separator and Spacer
Default separator:
Dotted separator:
Spacer adds empty space below this line.
Content resumes here.
12 Buttons
13 File and Details
Details block — expandable answer
Body content reveals below the summary.
Second details item — borders collapse between siblings
Adjacent details should share a single border line.
14 Footnotes
A claim that needs sourcing gets a superscript marker1 in the text.
- Footnote text — source title, publication, year.
- Second footnote with a link.
15 FAQ headings (site converts these to accordion)
Frequently Asked Questions
1. What foods are haram?
Islamic dietary law prohibits pork, blood, carrion, and intoxicants, along with meat that is not slaughtered according to halal requirements.
2. Is fasting required during Ramadan?
Yes. Fasting in Ramadan is one of the Five Pillars of Islam, with established exemptions for illness, travel, and other conditions.
