# Marquee

### Section overview

The Marquee section displays content in a horizontally scrolling animation, creating an eye-catching way to highlight information, promotions, or brand messaging.

#### Common use cases

* Displaying announcements or promotional messaging
* Showcasing brand values or key product features
* Creating visual interest with alternating text and images
* Highlighting time-sensitive information like sales or events

#### Usage tips

* Keep content concise and scannable for easy reading while in motion
* Use consistent block types for a cohesive look (all headings or alternating heading/image)
* Adjust animation speed based on content length and complexity
* For mobile, consider using fewer or simpler blocks as the smaller screen may make text harder to read

### Section settings

| Setting               | Description                                                |
| --------------------- | ---------------------------------------------------------- |
| Top spacing           | Controls the space above the section (0-300px)             |
| Bottom spacing        | Controls the space below the section (0-300px)             |
| Color scheme          | Determines the background and text color combination       |
| Border color          | Sets the color of the section border                       |
| Border position       | Controls where borders appear (top, bottom, both, or none) |
| Enable margin         | Adds horizontal margin to the section                      |
| Use reverse animation | Changes the direction of the scrolling animation           |
| Animation speed       | Controls how fast the content scrolls (10-200s)            |
| Visibility            | Controls on which devices the section appears              |

### Block settings

#### Heading

The Heading block displays large, bold text in the marquee.

| Setting | Description                        |
| ------- | ---------------------------------- |
| Content | The text to display as the heading |

#### Content

The Content block displays rich text content within the marquee.

| Setting     | Description                                              |
| ----------- | -------------------------------------------------------- |
| Content     | The rich text content to display                         |
| X alignment | Controls horizontal text alignment (left, center, right) |

#### Button

The Button block adds a clickable button to the marquee.

| Setting      | Description                                     |
| ------------ | ----------------------------------------------- |
| Button label | The text to display on the button               |
| URL          | The destination page when the button is clicked |
| Button color | Controls the button style and color scheme      |

#### Image

The Image block displays an image within the marquee.

| Setting      | Description                                 |
| ------------ | ------------------------------------------- |
| Image        | The image to display                        |
| Image height | Controls the height of the image (10-100px) |
