Summary Files Commits Branches @commit @diff @stats
path: root / docs / layout / responsive.html
diff options
context:
space:
mode:
Commit4e3564bd6f8ae18fe3f2ec224171655f892e7ec1 (patch)
Author
 Yan Zhu <picturepan2@hotmail.com>
2018-11-17 13:15:28 +0800
Committer
 Yan Zhu <picturepan2@hotmail.com>
2018-11-17 13:15:28 +0800
Files982f386ae2a602ba1852e20e40e97c577519722c /docs/layout/responsive.html
Spectre-Dark-Gruvbox-4e3564bd6f8ae18fe3f2ec224171655f892e7ec1.tar
Spectre-Dark-Gruvbox-4e3564bd6f8ae18fe3f2ec224171655f892e7ec1.tar.gz
Spectre-Dark-Gruvbox-4e3564bd6f8ae18fe3f2ec224171655f892e7ec1.zip
Parent371ba0e24350b60d768f21a3299d1b99608aac26 (diff)
Update Icons
1 files changed, 18 insertions, 2 deletions
-rw-r--r--docs/layout/responsive.html20
diff --git a/docs/layout/responsive.html b/docs/layout/responsive.html
index e0612ee..d063927 100644
--- a/docs/layout/responsive.html
+++ b/docs/layout/responsive.html
@@ -204,10 +204,26 @@
<p>Spectre provides a neat responsive layout grid system and responsive visibility utilities.</p>
<div class="docs-demo columns">
<div class="column col-10 col-lg-8 col-md-6 col-sm-4">
- <div class="bg-gray docs-block">col-10 <br> col-lg-8 <br> col-md-6 <br> col-sm-4</div>
+ <div class="bg-gray docs-block">
+ <div class="text-primary">col-10</div>
+ <div class="text-dark hide-lg">col-lg-8</div>
+ <div class="text-primary show-lg">col-lg-8</div>
+ <div class="text-dark hide-md">col-md-6</div>
+ <div class="text-primary show-md">col-md-6</div>
+ <div class="text-dark hide-sm">col-sm-4</div>
+ <div class="text-primary show-sm">col-sm-4</div>
+ </div>
</div>
<div class="column col-2 col-lg-4 col-md-6 col-sm-8">
- <div class="bg-gray docs-block">col-2 <br> col-lg-4 <br> col-md-6 <br> col-sm-8</div>
+ <div class="bg-gray docs-block">
+ <div class="text-primary">col-2</div>
+ <div class="text-dark hide-lg">col-lg-4</div>
+ <div class="text-primary show-lg">col-lg-4</div>
+ <div class="text-dark hide-md">col-md-6</div>
+ <div class="text-primary show-md">col-md-6</div>
+ <div class="text-dark hide-sm">col-sm-8</div>
+ <div class="text-primary show-sm">col-sm-8</div>
+ </div>
</div>
</div>
<p>There are <code>col-xs-<1-12></code>, <code>col-sm-<1-12></code>, <code>col-md-<1-12></code>, <code>col-lg-<1-12></code> and <code>col-xl-<1-12></code> available for flexible grid across mobile, tablet and desktop viewport usage.</p>