From 41ec3e49d63ea45d8aee4f26eeccfedaa20a7f7d Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Thu, 17 Aug 2017 18:54:07 +0800 Subject: Add Grid offset, more margin and padding utilities --- docs/components.html | 115 +++++++++++++++++++++++++-------------------------- 1 file changed, 56 insertions(+), 59 deletions(-) (limited to 'docs/components.html') diff --git a/docs/components.html b/docs/components.html index c87bd8e..0993a14 100644 --- a/docs/components.html +++ b/docs/components.html @@ -251,8 +251,8 @@
-
-

Accordions

+
+

Accordions

Accordions are used to toggle sections of content.

@@ -402,8 +402,8 @@
-
-

Autocomplete

+
+

Autocomplete

Autocomplete form component provides suggestions while you type. It is often used for tags and contacts input.

@@ -529,8 +529,8 @@
-
-

Avatars

+
+

Avatars

Avatars are user profile pictures.

@@ -610,8 +610,8 @@
-
-

Badges

+
+

Badges

Badges are often used as unread number indicators.

@@ -686,8 +686,8 @@
-
-

Bars

+
+

Bars

Bars represent the progress of a task or the value within the known range. Bars are custom components for displaying HTML5 progress, meter and input range elements.

@@ -781,8 +781,8 @@
-
- + -
-

Cards

+
+

Cards

Cards are flexible content containers.

@@ -991,8 +991,8 @@
-
-

Chips

+
+

Chips

Chips are complex entities in small blocks.

@@ -1049,8 +1049,8 @@
-
-

Empty states / blank slates

+
+

Empty states / blank slates

Empty states/blank slates are commonly used as placeholders for first time use, empty data and error screens.

@@ -1116,8 +1116,8 @@
-
- +
-
- dropdown button +
+ dropdown button
-
-
- dropdown button -
    +
+
+

Dropdown menus component is built entirely in CSS. It is triggered by :focus event.

+

Add a container element with the dropdown class. And add a focusable element with the dropdown-toggle class for the button and a menu component right next to it. You also need to add tabindex to make the buttons focusable.

+

If the dropdown is close to the right edge of the browser, you can add the dropdown-right class to the container to prevent it appearing off screen.

+
+
+
+
+ dropdown button +
-
-

Dropdown menus component is built entirely in CSS. It is triggered by :focus event.

-

Add a container element with the dropdown class. And add a focusable element with the dropdown-toggle class for the button and a menu component right next to it. You also need to add tabindex to make the buttons focusable. If the dropdown is close to the right edge of the browser, you can add the dropdown-right class to the container to prevent it appearing off screen.

-

Also, you can implement your JS to interact with the dropdown menus by adding the active class to the dropdown container.

@@ -1327,8 +1324,8 @@
-
-

Modals

+
+

Modals

Modals are flexible dialog prompts.

@@ -1463,8 +1460,8 @@
-
-

Pagination

+