Component: Content - Introduction 1.1-beta

This builder will allow you to generate a custom version of the Content - Introduction component.

The component will show up in between the pink lines below. The pink lines will not show up in production -- they are only used to allow you to view margins and paddings. In the case of specialized components (things that are meant to be invisible or have a fixed location), the component may not display in this area.

Template -- enter raw HTML here

Samples:

Enter raw HTML here

Attributes, Classes, and CSS Variables

mode (fixed attribute)

Mode of the component

introduction

theme (attribute)

Color theme used

width (attribute)

Width of component

align (attribute)

Alignment of the text inside the component, defaults to left

padding (text attribute)

Padding of the text inside the component

Custom CSS Variables and Styles (advanced use only)

Parent style:

--ilw-content--narrow-max-width

Size of the max width of the element in CSS length

--ilw-content--narrow-padding

Size of the padding of the element in CSS length

HTML listed here

This parent has a style of that is not figured into the source HTML. You can change this by opening the Custom CSS Variables and Styles and editing the parent style.

Details

The Content component with the introduction mode enabled. Note that the emphasized piece needs to be in an emphasized tag

Full Version: 1.1.0-beta

Type: web component

Date Created: 2/11/2025

Version notes:

Github repository: https://github.com/web-illinois/ilw-content/

Javascript file: https://dev.toolkit.illinois.edu/ilw-content/1.1.0-beta/ilw-content.js

CSS file: https://dev.toolkit.illinois.edu/ilw-content/1.1.0-beta/ilw-content.css

JSON information: ilw-content-introduction.1.1-beta.json