Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found
Select Git revision
  • clickable-select-chevron
  • feat/new-image-formats
  • master
  • 1.2.0
  • 1.4.0
  • 1.4.1
  • 1.4.2
  • 1.5.0
  • 1.5.1
  • 1.5.2
  • 1.5.3
  • 1.5.4
  • 1.5.5
  • 1.6.0
  • 1.6.1
  • 1.6.2
  • 1.6.3
  • 1.6.4
  • 1.7.0
  • 1.8.0
  • 2.0.0
  • 2.0.0-alpha-1
  • 2.0.0-alpha-10
  • 2.0.0-alpha-11
  • 2.0.0-alpha-12
  • 2.0.0-alpha-13
  • 2.0.0-alpha-14
  • 2.0.0-alpha-15
  • 2.0.0-alpha-16
  • 2.0.0-alpha-17
  • 2.0.0-alpha-2
  • 2.0.0-alpha-3
  • 2.0.0-alpha-4
  • 2.0.0-alpha-5
  • 2.0.0-alpha-6
  • 2.0.0-alpha-7
  • 2.0.0-alpha-8
  • 2.0.0-alpha-9
  • 2.0.1
  • 2.0.2
  • 2.0.3
  • 2.0.4
  • 2.1.0
  • 2.1.1
  • 2.1.2
  • 2.10.0
  • 2.11.0
  • 2.12.1
  • 2.13.0
  • 2.14.0
  • 2.15.0
  • 2.16.0
  • 2.16.1
  • 2.17.0
  • 2.18.0
  • 2.19.0
  • 2.2.0
  • 2.2.1
  • 2.20.0
  • 2.3.0
  • 2.3.1
  • 2.3.2
  • 2.3.3
  • 2.3.4
  • 2.4.0
  • 2.5.0
  • 2.5.1
  • 2.5.2
  • 2.6.0
  • 2.7.0
  • 2.7.1
  • 2.8.0
  • 2.9.0
  • 2.9.1
74 results

Target

Select target project
  • to/weby/ui-styleguide
  • va-fighters/ui-styleguide
2 results
Select Git revision
  • master
  • 1.2.0
  • 1.4.0
  • 1.4.1
  • 1.4.2
  • 1.5.0
  • 1.5.1
  • 1.5.2
  • 1.5.3
  • 1.5.4
  • 1.5.5
  • 1.6.0
  • 1.6.1
  • 1.6.2
  • 1.6.3
  • 1.6.4
  • 1.7.0
  • 1.8.0
  • 2.0.0-alpha-1
  • 2.0.0-alpha-10
  • 2.0.0-alpha-11
  • 2.0.0-alpha-2
  • 2.0.0-alpha-3
  • 2.0.0-alpha-4
  • 2.0.0-alpha-5
  • 2.0.0-alpha-6
  • 2.0.0-alpha-7
  • 2.0.0-alpha-8
  • 2.0.0-alpha-9
29 results
Show changes
Expand all Show whitespace changes
Inline Side-by-side
Showing
with 1285 additions and 154 deletions
source/_patterns/00-atoms/00-global/00-brand-colors.mustache
View file @ aac6d1d3
{{# brandColors }}
<h2 class="head-alt-sm mb-4 mt-8">{{ name }}</h2>
<div class="grid gap-4 grid-cols-2 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8">
<div class="card flex flex-col">
<div class="h-32 bg-black"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Black</p>
<p>#000000</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-white"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">White</p>
<p>#ffffff</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-green-100"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Green 100</p>
<p>#29bc51</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-green-200"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Green 200</p>
<p>#26b34b</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-green-300"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Green 300</p>
<p>#22a244</p>
</div>
</div>
{{# variants }}
{{> molecules-color-swatch }}
{{/ variants }}
</div>
{{/ brandColors }}
source/_patterns/00-atoms/00-global/01-neutral-colors.mustache
View file @ aac6d1d3
<div class="grid gap-4 grid-cols-2 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8">
<div class="card flex flex-col">
<div class="h-32 bg-grey-50"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Grey 50</p>
<p>#f7f7f7</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-grey-100"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Grey 100</p>
<p>#f3f3f3</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-grey-125"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Grey 125</p>
<p>#f0f0f0</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-grey-150"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Grey 150</p>
<p>#00000012</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-grey-200"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Grey 200</p>
<p>#adadad</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-grey-300"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Grey 300</p>
<p>#4c4c4c</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-grey-400"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Grey 400</p>
<p>#343434</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-grey-500"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Grey 500</p>
<p>#303132</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-grey-600"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Grey 600</p>
<p>#262626</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-grey-700"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Grey 700</p>
<p>#202020</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-grey-800"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Grey 800</p>
<p>#1f1f1f</p>
</div>
</div>
{{# greyColors }}
{{> molecules-color-swatch }}
{{/ greyColors }}
</div>
source/_patterns/00-atoms/00-global/02-utility-colors.mustache deleted 100644 → 0
View file @ ea6f5e3f
<div class="grid gap-4 grid-cols-2 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8">
<div class="card flex flex-col">
<div class="h-32 bg-red-100"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Red 100</p>
<p>#d6151b</p>
</div>
</div>
<div class="card flex flex-col">
<div class="h-32 bg-red-200"></div>
<div class="card__body p-2 flex">
<p class="font-bold flex-grow">Red 200</p>
<p>#d6151b</p>
</div>
</div>
</div>
source/_patterns/00-atoms/01-text/font-sizes.mustache
View file @ aac6d1d3
<p class="text-9xl">9xl size</p>
<p class="text-8xl">8xl size</p>
<p class="text-7xl">7xl size</p>
<p class="text-6xl">6xl size</p>
<p class="text-5xl">5xl size</p>
......
source/_patterns/00-atoms/01-text/text-shadow.mustache 0 → 100644
View file @ aac6d1d3
<div>
<h1 class="head-alt-xl text-shadow-xs">{{ headline.short }}</h1>
<h1 class="head-alt-xl text-shadow-sm">{{ headline.short }}</h1>
<h1 class="head-alt-xl text-shadow">{{ headline.short }}</h1>
<h1 class="head-alt-xl text-shadow-md">{{ headline.short }}</h1>
<h1 class="head-alt-xl text-shadow-lg">{{ headline.short }}</h1>
</div>
source/_patterns/00-atoms/02-contact-lines/basic-contact-line.mustache deleted 100644 → 0
View file @ ea6f5e3f
<a href="mailto:example@example.com" class="contact-line {{ classes }}">
<i class="{{ icon }}"></i>{{ caption }}{{^caption}}example@example.com{{/caption}}
</a>
source/_patterns/00-atoms/02-icons/.gitkeep 0 → 100644
View file @ aac6d1d3
source/_patterns/00-atoms/02-icons/icons.mustache 0 → 100644
View file @ aac6d1d3
This diff is collapsed.
source/_patterns/00-atoms/03-buttons/00-basic-button.mustache
View file @ aac6d1d3
<button class="btn {{ classes }}">
<button class="btn {{ classes }}" {{# disabled }}disabled{{/ disabled }}>
<div class="btn__body {{ bodyClasses }}">{{ cta }}</div>
</button>
source/_patterns/00-atoms/03-buttons/01-icon-button.mustache
View file @ aac6d1d3
<button class="btn btn--icon {{ classes }}">
<button class="btn btn--icon {{ classes }}" {{# disabled }}disabled{{/ disabled }}>
<div class="btn__body-wrap">
<div class="btn__body {{ bodyClasses }}">{{ cta }}</div>
<div class="btn__icon {{ iconClasses }}">
......
source/_patterns/00-atoms/03-buttons/02-button-colors.mustache
View file @ aac6d1d3
<div class="inline-flex flex-col sm:flex-row space-y-8 sm:space-y-0 sm:space-x-8">
<div class="inline-flex flex-col space-y-2">
{{> atoms-basic-button(classes: "btn--black") }}
{{> atoms-basic-button(classes: "btn--grey-800") }}
{{> atoms-basic-button(classes: "btn--grey-700") }}
{{> atoms-basic-button(classes: "btn--grey-500") }}
{{> atoms-basic-button(classes: "btn--grey-125") }}
{{> atoms-basic-button(classes: "btn--white") }}
{{> atoms-basic-button(classes: "btn--white btn--fading") }}
{{> atoms-basic-button(classes: "btn--green-100") }}
{{> atoms-basic-button(classes: "btn--red-100") }}
{{> atoms-basic-button(classes: "btn--blue-300") }}
{{> atoms-basic-button(classes: "btn--cyan-200") }}
{{> atoms-basic-button(classes: "btn--green-400") }}
{{> atoms-basic-button(classes: "btn--green-300") }}
{{> atoms-basic-button(classes: "btn--orange-300") }}
{{> atoms-basic-button(classes: "btn--violet-400") }}
{{> atoms-basic-button(classes: "btn--violet-500") }}
{{> atoms-basic-button(classes: "btn--red-600") }}
</div>
<div class="inline-flex flex-col space-y-2">
{{> atoms-basic-button(classes: "btn--black", disabled: true) }}
{{> atoms-basic-button(classes: "btn--grey-700", disabled: true) }}
{{> atoms-basic-button(classes: "btn--grey-500", disabled: true) }}
{{> atoms-basic-button(classes: "btn--grey-125", disabled: true) }}
{{> atoms-basic-button(classes: "btn--white", disabled: true) }}
{{> atoms-basic-button(classes: "btn--blue-300", disabled: true) }}
{{> atoms-basic-button(classes: "btn--cyan-200", disabled: true) }}
{{> atoms-basic-button(classes: "btn--green-400", disabled: true) }}
{{> atoms-basic-button(classes: "btn--green-300", disabled: true) }}
{{> atoms-basic-button(classes: "btn--orange-300", disabled: true) }}
{{> atoms-basic-button(classes: "btn--violet-400", disabled: true) }}
{{> atoms-basic-button(classes: "btn--violet-500", disabled: true) }}
{{> atoms-basic-button(classes: "btn--red-600", disabled: true) }}
</div>
<div class="inline-flex flex-col space-y-2">
{{> atoms-icon-button(classes: "btn--black") }}
{{> atoms-icon-button(classes: "btn--grey-800") }}
{{> atoms-icon-button(classes: "btn--grey-700") }}
{{> atoms-icon-button(classes: "btn--grey-500") }}
{{> atoms-icon-button(classes: "btn--grey-125") }}
{{> atoms-icon-button(classes: "btn--white") }}
{{> atoms-icon-button(classes: "btn--white btn--fading") }}
{{> atoms-icon-button(classes: "btn--green-100") }}
{{> atoms-icon-button(classes: "btn--red-100") }}
{{> atoms-icon-button(classes: "btn--blue-300") }}
{{> atoms-icon-button(classes: "btn--cyan-200") }}
{{> atoms-icon-button(classes: "btn--green-400") }}
{{> atoms-icon-button(classes: "btn--green-300") }}
{{> atoms-icon-button(classes: "btn--orange-300") }}
{{> atoms-icon-button(classes: "btn--violet-400") }}
{{> atoms-icon-button(classes: "btn--violet-500") }}
{{> atoms-icon-button(classes: "btn--red-600") }}
</div>
<div class="inline-flex flex-col space-y-2">
{{> atoms-icon-button(classes: "btn--black", disabled: true) }}
{{> atoms-icon-button(classes: "btn--grey-700", disabled: true) }}
{{> atoms-icon-button(classes: "btn--grey-500", disabled: true) }}
{{> atoms-icon-button(classes: "btn--grey-125", disabled: true) }}
{{> atoms-icon-button(classes: "btn--white", disabled: true) }}
{{> atoms-icon-button(classes: "btn--blue-300", disabled: true) }}
{{> atoms-icon-button(classes: "btn--cyan-200", disabled: true) }}
{{> atoms-icon-button(classes: "btn--green-400", disabled: true) }}
{{> atoms-icon-button(classes: "btn--green-300", disabled: true) }}
{{> atoms-icon-button(classes: "btn--orange-300", disabled: true) }}
{{> atoms-icon-button(classes: "btn--violet-400", disabled: true) }}
{{> atoms-icon-button(classes: "btn--violet-500", disabled: true) }}
{{> atoms-icon-button(classes: "btn--red-600", disabled: true) }}
</div>
</div>
source/_patterns/00-atoms/03-buttons/04-button-with-hover-effect.mustache
View file @ aac6d1d3
<div class="inline-flex flex-col sm:flex-row space-y-8 sm:space-y-0 sm:space-x-8">
<div class="inline-flex flex-col space-y-2">
{{> atoms-basic-button(classes: "btn--black btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--grey-800 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--grey-700 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--grey-500 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--grey-125 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--white btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--white btn--fading btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--green-100 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--red-100 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--blue-300 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--cyan-200 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--green-400 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--green-300 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--orange-300 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--violet-400 btn--hoveractive") }}
{{> atoms-basic-button(classes: "btn--violet-500 btn--hoveractive") }}
</div>
<div class="inline-flex flex-col space-y-2">
{{> atoms-icon-button(classes: "btn--black btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--grey-800 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--grey-700 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--grey-500 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--grey-125 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--white btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--white btn--fading btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--green-100 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--red-100 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--blue-300 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--cyan-200 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--green-400 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--green-300 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--orange-300 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--violet-400 btn--hoveractive") }}
{{> atoms-icon-button(classes: "btn--violet-500 btn--hoveractive") }}
</div>
</div>
source/_patterns/00-atoms/03-buttons/12-overlay-button.mustache deleted 100644 → 0
View file @ ea6f5e3f
<button class="btn btn--inline-icon btn--overlay {{ baseColor }}{{^ baseColor }}btn--grey-800{{/ baseColor }} {{ overlayColor }}{{^ overlayColor }}btn--overlay-red-100{{/ overlayColor }} {{ classes }}">
<div class="btn__body {{ bodyClasses }}"><i class="btn__inline-icon {{ icon }}"></i> {{ cta }}</div>
</button>
source/_patterns/00-atoms/03-buttons/button-hover-targets.mustache 0 → 100644
View file @ aac6d1d3
<div class="inline-flex flex-col sm:flex-row space-y-8 sm:space-y-0 sm:space-x-8">
<div class="inline-flex flex-col space-y-2">
{{> atoms-basic-button(cta: "btn--to-black", classes: "btn--hoveractive btn--to-black") }}
{{> atoms-basic-button(cta: "btn--to-grey-700", classes: "btn--hoveractive btn--to-grey-700") }}
{{> atoms-basic-button(cta: "btn--to-grey-500", classes: "btn--hoveractive btn--to-grey-500") }}
{{> atoms-basic-button(cta: "btn--to-grey-125", classes: "btn--hoveractive btn--to-grey-125") }}
{{> atoms-basic-button(cta: "btn--to-white", classes: "btn--hoveractive btn--to-white") }}
{{> atoms-basic-button(cta: "btn--to-blue-300", classes: "btn--hoveractive btn--to-blue-300") }}
{{> atoms-basic-button(cta: "btn--to-cyan-200", classes: "btn--hoveractive btn--to-cyan-200") }}
{{> atoms-basic-button(cta: "btn--to-green-400", classes: "btn--hoveractive btn--to-green-400") }}
{{> atoms-basic-button(cta: "btn--to-green-300", classes: "btn--hoveractive btn--to-green-300") }}
{{> atoms-basic-button(cta: "btn--to-orange-300", classes: "btn--hoveractive btn--to-orange-300") }}
{{> atoms-basic-button(cta: "btn--to-violet-400", classes: "btn--hoveractive btn--to-violet-400") }}
{{> atoms-basic-button(cta: "btn--to-violet-500", classes: "btn--hoveractive btn--to-violet-500") }}
{{> atoms-basic-button(cta: "btn--to-brands-facebook", classes: "btn--hoveractive btn--to-brands-facebook") }}
</div>
<div class="inline-flex flex-col space-y-2">
{{> atoms-icon-button(cta: "btn--to-black", classes: "btn--hoveractive btn--to-black") }}
{{> atoms-icon-button(cta: "btn--to-grey-700", classes: "btn--hoveractive btn--to-grey-700") }}
{{> atoms-icon-button(cta: "btn--to-grey-500", classes: "btn--hoveractive btn--to-grey-500") }}
{{> atoms-icon-button(cta: "btn--to-grey-125", classes: "btn--hoveractive btn--to-grey-125") }}
{{> atoms-icon-button(cta: "btn--to-white", classes: "btn--hoveractive btn--to-white") }}
{{> atoms-icon-button(cta: "btn--to-blue-300", classes: "btn--hoveractive btn--to-blue-300") }}
{{> atoms-icon-button(cta: "btn--to-cyan-200", classes: "btn--hoveractive btn--to-cyan-200") }}
{{> atoms-icon-button(cta: "btn--to-green-400", classes: "btn--hoveractive btn--to-green-400") }}
{{> atoms-icon-button(cta: "btn--to-green-300", classes: "btn--hoveractive btn--to-green-300") }}
{{> atoms-icon-button(cta: "btn--to-orange-300", classes: "btn--hoveractive btn--to-orange-300") }}
{{> atoms-icon-button(cta: "btn--to-violet-400", classes: "btn--hoveractive btn--to-violet-400") }}
{{> atoms-icon-button(cta: "btn--to-violet-500", classes: "btn--hoveractive btn--to-violet-500") }}
{{> atoms-icon-button(cta: "btn--to-brands-facebook", classes: "btn--hoveractive btn--to-brands-facebook") }}
</div>
</div>
source/_patterns/00-atoms/03-buttons/13-overlay-button-colors.mustache → source/_patterns/00-atoms/03-buttons/loading-button.mustache
View file @ aac6d1d3
<div class="inline-flex flex-col sm:flex-row space-y-8 sm:space-y-0 sm:space-x-8">
<div class="inline-flex flex-col space-y-2">
{{> atoms-overlay-button(overlayColor: "btn--overlay-red-100") }}
{{> atoms-overlay-button(overlayColor: "btn--overlay-brands-facebook") }}
{{> atoms-basic-button(classes: "text-sm btn--loading" )}}
{{> atoms-basic-button(classes: "text-base btn--loading" )}}
{{> atoms-basic-button(classes: "text-lg btn--loading" )}}
</div>
</div>
source/_patterns/00-atoms/04-animations/ping.mustache 0 → 100644
View file @ aac6d1d3
<span class="inline-flex h-4 w-4 mr-4 relative">
<span class="animate-ping absolute inline-flex h-full w-full rounded-full opacity-75 bg-green-400"></span>
<span class="relative inline-flex rounded-full w-4 h-4 mr-4 bg-green-400" title="Online"></span>
</span>
source/_patterns/00-atoms/04-lists/dense-unordered-list.mustache 0 → 100644
View file @ aac6d1d3
<ul class="unordered-list unordered-list--dense">
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
</ul>
source/_patterns/00-atoms/lists/linked-unordered-list.mustache → source/_patterns/00-atoms/04-lists/linked-unordered-list.mustache
View file @ aac6d1d3
<ul class="unordered-list unordered-list--linked {{ classes }}">
<li>
<a href="#" class="font-bold">{{ cta }}</a>
<a href="#" class="font-bold content-block--nostyle">{{ cta }}</a>
</li>
<li>
<a href="#">{{ cta }}</a>
<a href="#" class="content-block--nostyle">{{ cta }}</a>
</li>
<li>
<a href="#">{{ cta }}</a>
<a href="#" class="content-block--nostyle">{{ cta }}</a>
</li>
<li>
<a href="#">{{ cta }}</a>
<a href="#" class="content-block--nostyle">{{ cta }}</a>
</li>
</ul>
source/_patterns/00-atoms/04-lists/unordered-list-leading-variants.mustache 0 → 100644
View file @ aac6d1d3
<div class="inline-flex flex-col sm:flex-row space-y-8 sm:space-y-0 sm:space-x-8">
<div class="inline-flex flex-col space-y-2">
<ul class="unordered-list leading-tight">
<li>
{{{ list.item }}}
<ul class="unordered-list">
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
</ul>
</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
</ul>
</div>
<div class="inline-flex flex-col space-y-2">
<ul class="unordered-list leading-snug">
<li>
{{{ list.item }}}
<ul class="unordered-list">
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
</ul>
</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
</ul>
</div>
<div class="inline-flex flex-col space-y-2">
<ul class="unordered-list leading-normal">
<li>
{{{ list.item }}}
<ul class="unordered-list">
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
</ul>
</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
</ul>
</div>
<div class="inline-flex flex-col space-y-2">
<ul class="unordered-list leading-relaxed">
<li>
{{{ list.item }}}
<ul class="unordered-list">
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
</ul>
</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
<li>{{{ list.item }}}</li>
</ul>
</div>
</div>

Pirátský GitLab - Home of the CopyLeft