Paragraph

Displays blocks of text for content sections with options for alignment and spacing.
---
block:
  _bookshop_name: elements/paragraph
  inline_markdown: This is a block of text with **bold** and *italic* text.
  align: null
  size: null
  decoration: null
  margin:
    top: null
    bottom: null
---
{% bookshop "{{block._bookshop_name}}" bind: block %}

Properties

sizeenum

The font size of the text.

xs
s
m
l
xl
2xl
3xl
4xl
5xl
6xl

decorationenum

Text decoration style.

none
glow

marginobject

The margin around the text.

topenum

The top margin size.

none
xs
s
m
l
xl
2xl

bottomenum

The bottom margin size.

none
xs
s
m
l
xl
2xl

alignenum

The text alignment.

start
center
end

Examples

Alignment

---
blocks:
  - _bookshop_name: elements/paragraph
    inline_markdown: Start
    align: start
    size: null
    decoration: null
    margin:
      top: null
      bottom: null
  - _bookshop_name: elements/paragraph
    inline_markdown: Center
    align: center
    size: null
    decoration: null
    margin:
      top: null
      bottom: null
  - _bookshop_name: elements/paragraph
    inline_markdown: End
    align: end
    size: null
    decoration: null
    margin:
      top: null
      bottom: null
---
{% for block in blocks %}
  {% bookshop "{{block._bookshop_name}}" bind: block %}
{% endfor %}

Sizes

---
blocks:
  - _bookshop_name: elements/paragraph
    inline_markdown: 2XL
    align: null
    size: 2xl
    decoration: null
    margin:
      top: null
      bottom: null
  - _bookshop_name: elements/paragraph
    inline_markdown: XL
    align: null
    size: xl
    decoration: null
    margin:
      top: null
      bottom: null
  - _bookshop_name: elements/paragraph
    inline_markdown: Large
    align: null
    size: l
    decoration: null
    margin:
      top: null
      bottom: null
  - _bookshop_name: elements/paragraph
    inline_markdown: Medium
    align: null
    size: m
    glow: null
    margin:
      top: null
      bottom: null
  - _bookshop_name: elements/paragraph
    inline_markdown: Small
    align: null
    size: s
    glow: null
    margin:
      top: null
      bottom: null
  - _bookshop_name: elements/paragraph
    inline_markdown: XS
    align: null
    size: xs
    glow: null
    margin:
      top: null
      bottom: null
---
{% for block in blocks %}
  {% bookshop "{{block._bookshop_name}}" bind: block %}
{% endfor %}

Glow

---
blocks:
  - _bookshop_name: layouts/section
    label: null
    shape:
      type: null
      size: null
      reverse: null
    margin:
      top: null
      bottom: null
    border:
      border_width: null
      border_type: null
      border_color: null
    padding:
      vertical: m
      horizontal: m
    background:
      scheme: null
      shadow: null
      transforms:
        scale: null
        scale_x: null
        scale_y: null
        rotate: null
        skew_x: null
        skew_y: null
        translate_x: null
        translate_y: null
        blur: null
        opacity: null
      color: highlight
      image:
        src: null
        alt: null
        style:
          opacity: 1
          rounded: null
        background:
          enabled: false
          horizontal_position: right
          vertical_position: center
          repeat: false
          fixed: null
    content_blocks:
      - _bookshop_name: elements/paragraph
        inline_markdown: Glow on paragraph.
        align: null
        size: null
        decoration: glow
        margin:
          top: null
          bottom: null
  - _bookshop_name: layouts/section
    label: null
    shape:
      type: null
      size: null
      reverse: false
    margin:
      top: null
      bottom: null
    border:
      border_width: null
      border_type: null
      border_color: null
    padding:
      vertical: m
      horizontal: m
    background:
      scheme: opposite
      shadow: null
      color: highlight
      transforms:
        scale: null
        scale_x: null
        scale_y: null
        rotate: null
        skew_x: null
        skew_y: null
        translate_x: null
        translate_y: null
        blur: null
        opacity: null
      image:
        src: null
        alt: null
        style:
          opacity: 1
          rounded: null
        background:
          enabled: false
          horizontal_position: right
          vertical_position: center
          repeat: false
          fixed: null
    content_blocks:
      - _bookshop_name: elements/paragraph
        inline_markdown: Glow on opposite.
        align: null
        size: null
        decoration: glow
        margin:
          top: null
          bottom: null
---
{% for block in blocks %}
  {% bookshop "{{block._bookshop_name}}" bind: block %}
{% endfor %}

Margin

---
blocks:
  - _bookshop_name: elements/paragraph
    inline_markdown: 2XL bottom margin
    align: null
    size: null
    decoration: null
    margin:
      top: null
      bottom: 2xl
  - _bookshop_name: elements/paragraph
    inline_markdown: No Margin
    align: null
    size: null
    decoration: null
    margin:
      top: none
      bottom: none
  - _bookshop_name: elements/paragraph
    inline_markdown: M Bottom Margin
    align: null
    size: null
    decoration: null
    margin:
      top: none
      bottom: m
  - _bookshop_name: elements/paragraph
    inline_markdown: Normal paragraph
    align: null
    size: null
    glow: null
    margin:
      top: null
      bottom: null
---
{% for block in blocks %}
  {% bookshop "{{block._bookshop_name}}" bind: block %}
{% endfor %}