Ck Editable Lists
Basic List
This isn’t actually a block itself. It’s a pattern of implementing the grid that makes it easier to edit in the WYSIWYG editor. Sometimes, there’s listed content that needs to be updated more often (e.g. a list of adjunct instructors), and this structure really eases the burden on site editors.
<ul class="grid --sm-1 --med-2 --lrg-4">
<li>
<h3><!-- title --></h3>
<p><!-- content goes here --></p>
</li>
<!-- ... -->
<li>
<h3><!-- title --></h3>
<p><!-- content goes here --></p>
</li>
</ul>
-
Title
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae cumque molestias, sint assumenda possimus perferendis inventore quae corrupti ipsam illum iusto, saepe ipsum beatae at expedita sed nostrum atque voluptatibus.
-
Title
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae cumque molestias, sint assumenda possimus perferendis inventore quae corrupti ipsam illum iusto, saepe ipsum beatae at expedita sed nostrum atque voluptatibus.
-
Title
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae cumque molestias, sint assumenda possimus perferendis inventore quae corrupti ipsam illum iusto, saepe ipsum beatae at expedita sed nostrum atque voluptatibus.
-
Title
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae cumque molestias, sint assumenda possimus perferendis inventore quae corrupti ipsam illum iusto, saepe ipsum beatae at expedita sed nostrum atque voluptatibus.
Card List
All that's different in the implementation of the Card List is the addition of the --card-listmodifier to the grid. It's stylized to render each list item as a card. Any header present will be stylized as a card title.
-
Title
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae cumque molestias, sint assumenda possimus perferendis inventore quae corrupti ipsam illum iusto, saepe ipsum beatae at expedita sed nostrum atque voluptatibus.
-
Title
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae cumque molestias, sint assumenda possimus perferendis inventore quae corrupti ipsam illum iusto, saepe ipsum beatae at expedita sed nostrum atque voluptatibus.
-
Title
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae cumque molestias, sint assumenda possimus perferendis inventore quae corrupti ipsam illum iusto, saepe ipsum beatae at expedita sed nostrum atque voluptatibus.
-
Title
Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestiae cumque molestias, sint assumenda possimus perferendis inventore quae corrupti ipsam illum iusto, saepe ipsum beatae at expedita sed nostrum atque voluptatibus.
Real-Life Example
-
Lunch and Learn!
Where: Student Union Buliding
When: Thursday, March 5
Come learn more about Lorem ipsum dolor sit, amet consectetur adipisicing elit. Repellat quas quaerat quae dolorum. Necessitatibus. -
Lunch and Learn!
Where: Student Union Buliding
When: Thursday, March 5
Come learn more about Lorem ipsum dolor sit, amet consectetur adipisicing elit. Repellat quas quaerat quae dolorum. Necessitatibus. -
Lunch and Learn!
Where: Student Union Buliding
When: Thursday, March 5
Come learn more about Lorem ipsum dolor sit, amet consectetur adipisicing elit. Repellat quas quaerat quae dolorum. Necessitatibus.