mirror of
https://github.com/danog/sass-site.git
synced 2024-12-16 19:37:21 +01:00
104 lines
1.6 KiB
Plaintext
104 lines
1.6 KiB
Plaintext
---
|
|
dh.title: Components
|
|
---
|
|
|
|
%h2 Closed
|
|
%dl.sl-c-description-list.sl-c-description-list--horizontal
|
|
%div
|
|
%dt Dart Sass
|
|
%dd ✓
|
|
|
|
%div
|
|
%dt Ruby Sass
|
|
|
|
%dd since 3.5.0
|
|
|
|
%div= link_to '▶︎', '#'
|
|
|
|
%h2 Open
|
|
%dl.sl-c-description-list.sl-c-description-list--horizontal
|
|
%div
|
|
%dt Dart Sass
|
|
%dd ✓
|
|
|
|
%div
|
|
%dt Ruby Sass
|
|
|
|
%dd since 3.5.0
|
|
|
|
%div= link_to '▼', '#'
|
|
|
|
.sl-c-callout
|
|
%p= lorem.paragraph
|
|
|
|
%h2 Alerts
|
|
.sl-c-alert
|
|
.sl-l-container
|
|
%p
|
|
%strong Alert
|
|
= lorem.sentence
|
|
|
|
.sl-c-alert.sl-c-alert--info
|
|
.sl-l-container
|
|
%p
|
|
%strong Info Alert
|
|
= lorem.sentence
|
|
|
|
%h2 Buttons
|
|
= link_to 'Link', '#', class: 'sl-c-button'
|
|
%button.sl-c-button(type='button') Button
|
|
|
|
= link_to 'Link', '#', class: 'sl-c-button sl-c-button--primary'
|
|
%button.sl-c-button.sl-c-button--primary(type='button') Button
|
|
|
|
%h2 Callouts
|
|
.sl-c-callout
|
|
%h3 Callout
|
|
%p= lorem.paragraph
|
|
|
|
.sl-c-callout.sl-c-callout--warning
|
|
%h3 Warning
|
|
%p= lorem.paragraph
|
|
|
|
.sl-c-callout.sl-c-callout--fun-fact
|
|
%h3 Fun Fact
|
|
%p= lorem.paragraph
|
|
|
|
%h2 Introduction
|
|
%p.sl-c-introduction= lorem.paragraph
|
|
|
|
.sl-c-introduction
|
|
%p= lorem.paragraph
|
|
|
|
%h2 Link Headers
|
|
%h2#link-header-2
|
|
Link Header 2
|
|
|
|
%h3#link-header-3
|
|
Link Header 3
|
|
|
|
%h4#link-header-4
|
|
Link Header 4
|
|
|
|
%h2 Lists
|
|
.sl-c-list-navigation-wrapper
|
|
:markdown
|
|
- [Vertical](#)
|
|
- [Navigation](#)
|
|
- [List](#)
|
|
|
|
.sl-c-list-horizontal-wrapper
|
|
:markdown
|
|
- [Horizontal](#)
|
|
- [Navigation](#)
|
|
- [List](#)
|
|
|
|
%h2 Pop Stripe
|
|
.sl-c-pop-stripe
|
|
|
|
%h2 Tables
|
|
%table.sl-c-table
|
|
%tr
|
|
%td Table
|
|
%td Table
|