Skip to content

Commit

Permalink
Update the Docs
Browse files Browse the repository at this point in the history
  • Loading branch information
picturepan2 committed Mar 11, 2017
1 parent 3a8a40a commit 589c7d8
Show file tree
Hide file tree
Showing 11 changed files with 49 additions and 51 deletions.
6 changes: 3 additions & 3 deletions dist/spectre.css
Original file line number Diff line number Diff line change
Expand Up @@ -741,15 +741,15 @@ abbr[title] {
-ms-flex: 1 0 auto;
flex: 1 0 auto;
}
.btn-group .btn:first-of-type:not(:last-of-type) {
.btn-group .btn:first-child:not(:last-child) {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
}
.btn-group .btn:not(:first-of-type):not(:last-of-type) {
.btn-group .btn:not(:first-child):not(:last-child) {
border-radius: 0;
margin-left: -.1rem;
}
.btn-group .btn:last-of-type:not(:first-of-type) {
.btn-group .btn:last-child:not(:first-child) {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
margin-left: -.1rem;
Expand Down
2 changes: 1 addition & 1 deletion dist/spectre.min.css

Large diffs are not rendered by default.

37 changes: 5 additions & 32 deletions docs/components.html
Original file line number Diff line number Diff line change
Expand Up @@ -208,18 +208,6 @@
&lt;<span class="tag">/div</span>&gt;
&lt;<span class="tag">/a</span>&gt;
&lt;<span class="tag">/li</span>&gt;
&lt;<span class="tag">li</span> <span class="atn">class</span>=<span class="atv">&quot;menu-item&quot;</span>&gt;
&lt;<span class="tag">a</span> <span class="atn">href</span>=<span class="atv">&quot;#&quot;</span>&gt;
&lt;<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">&quot;tile tile-centered&quot;</span>&gt;
&lt;<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">&quot;tile-icon&quot;</span>&gt;
&lt;<span class="tag">img</span> <span class="atn">src</span>=<span class="atv">&quot;img/avatar-3.png&quot;</span> <span class="atn">class</span>=<span class="atv">&quot;avatar avatar-sm&quot;</span> <span class="atn">alt</span>=<span class="atv">&quot;Yan Zhu&quot;</span> /&gt;
&lt;<span class="tag">/div</span>&gt;
&lt;<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">&quot;tile-content&quot;</span>&gt;
Yan Zhu
&lt;<span class="tag">/div</span>&gt;
&lt;<span class="tag">/div</span>&gt;
&lt;<span class="tag">/a</span>&gt;
&lt;<span class="tag">/li</span>&gt;
&lt;<span class="tag">/ul</span>&gt;
&lt;<span class="tag">/div</span>&gt;
</code></pre>
Expand Down Expand Up @@ -357,7 +345,7 @@
</section>

<!-- badges example -->
<pre class="code" data-lang="HTML"><code>&lt;<span class="tag">span</span> <span class="atn">class</span>=<span class="atv">&quot;badge&quot;</span> <span class="atn">data-badge</span>=<span class="atv">&quot;&quot;</span>&gt;
<pre class="code" data-lang="HTML"><code>&lt;<span class="tag">span</span> <span class="atn">class</span>=<span class="atv">&quot;badge&quot;</span>&gt;
Notifications
&lt;<span class="tag">/span</span>&gt;

Expand Down Expand Up @@ -689,18 +677,9 @@
&lt;<span class="tag">i</span> <span class="atn">class</span>=<span class="atv">&quot;icon icon-link&quot;</span>&gt;&lt;<span class="tag">/i</span>&gt; Slack
&lt;<span class="tag">/a</span>&gt;
&lt;<span class="tag">/li</span>&gt;
&lt;<span class="tag">li</span> <span class="atn">class</span>=<span class="atv">&quot;menu-item&quot;</span>&gt;
&lt;<span class="tag">a</span> <span class="atn">href</span>=<span class="atv">&quot;#&quot;</span>&gt;
&lt;<span class="tag">i</span> <span class="atn">class</span>=<span class="atv">&quot;icon icon-link&quot;</span>&gt;&lt;<span class="tag">/i</span>&gt; Hipchat
&lt;<span class="tag">/a</span>&gt;
&lt;<span class="tag">/li</span>&gt;
&lt;<span class="tag">li</span> <span class="atn">class</span>=<span class="atv">&quot;menu-item&quot;</span>&gt;
&lt;<span class="tag">a</span> <span class="atn">href</span>=<span class="atv">&quot;#&quot;</span>&gt;
&lt;<span class="tag">i</span> <span class="atn">class</span>=<span class="atv">&quot;icon icon-link&quot;</span>&gt;&lt;<span class="tag">/i</span>&gt; Skype
&lt;<span class="tag">/a</span>&gt;
&lt;<span class="tag">/li</span>&gt;
<span class="com">&lt;!-- menu divider --&gt;</span>
&lt;<span class="tag">li</span> <span class="atn">class</span>=<span class="atv">&quot;divider&quot;</span>&gt;&lt;<span class="tag">/li</span>&gt;
<span class="com">&lt;!-- menu item with badge --&gt;</span>
&lt;<span class="tag">li</span> <span class="atn">class</span>=<span class="atv">&quot;menu-item&quot;</span>&gt;
&lt;<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">&quot;menu-badge&quot;</span>&gt;
&lt;<span class="tag">label</span> <span class="atn">class</span>=<span class="atv">&quot;label label-primary&quot;</span>&gt;2&lt;<span class="tag">/label</span>&gt;
Expand Down Expand Up @@ -803,12 +782,7 @@
&lt;<span class="tag">/a</span>&gt;
<span class="com">&lt;!-- menu component --&gt;</span>
&lt;<span class="tag">ul</span> <span class="atn">class</span>=<span class="atv">&quot;menu&quot;</span>&gt;
&lt;<span class="tag">li</span> <span class="atn">class</span>=<span class="atv">&quot;menu-item&quot;</span>&gt;
&lt;<span class="tag">a</span> <span class="atn">href</span>=<span class="atv">&quot;#&quot;</span>&gt;Slack&lt;<span class="tag">/a</span>&gt;
&lt;<span class="tag">/li</span>&gt;
&lt;<span class="tag">li</span> <span class="atn">class</span>=<span class="atv">&quot;menu-item&quot;</span>&gt;
&lt;<span class="tag">a</span> <span class="atn">href</span>=<span class="atv">&quot;#&quot;</span>&gt;Hipchat&lt;<span class="tag">/a</span>&gt;
&lt;<span class="tag">/li</span>&gt;
...
&lt;<span class="tag">/ul</span>&gt;
&lt;<span class="tag">/div</span>&gt;

Expand Down Expand Up @@ -888,8 +862,7 @@ <h4>Candy ipsum</h4>
&lt;<span class="tag">/div</span>&gt;
&lt;<span class="tag">/div</span>&gt;
&lt;<span class="tag">div</span> <span class="atn">class</span>=<span class="atv">&quot;modal-footer&quot;</span>&gt;
&lt;<span class="tag">button</span> <span class="atn">class</span>=<span class="atv">&quot;btn btn-link&quot;</span>&gt;Close&lt;<span class="tag">/button</span>&gt;
&lt;<span class="tag">button</span> <span class="atn">class</span>=<span class="atv">&quot;btn btn-primary&quot;</span>&gt;Share&lt;<span class="tag">/button</span>&gt;
...
&lt;<span class="tag">/div</span>&gt;
&lt;<span class="tag">/div</span>&gt;
&lt;<span class="tag">/div</span>&gt;
Expand Down Expand Up @@ -1078,7 +1051,7 @@ <h4>Candy ipsum</h4>
</div>
</div>
<section class="notes">
<p>Add a container element with the <code>tab</code> class. And add child elements with the <code>tab-item</code> class. You can add the <code>tab-block</code> class for a full-width tab. The <code>tab-item</code> or its child <code>&lt;a&gt;</code> with the <code>active</code> class will be highlighted.</p>
<p>Add a container element with the <code>tab</code> class. And add child elements with the <code>tab-item</code> class. You can add the <code>tab-block</code> class for a full-width tab. The <code>tab-item</code> or its child &lt;a&gt; with the <code>active</code> class will be highlighted.</p>
</section>

<!-- tabs example -->
Expand Down
3 changes: 3 additions & 0 deletions docs/css/docs.css
Original file line number Diff line number Diff line change
Expand Up @@ -155,6 +155,9 @@
.docs-content .empty .icon {
font-size: 4rem;
}
.docs-content .navbar-brand .icon {
font-size: 3rem;
}
.docs-content .form-autocomplete .menu {
position: static;
}
Expand Down
4 changes: 4 additions & 0 deletions docs/css/docs.less
Original file line number Diff line number Diff line change
Expand Up @@ -190,6 +190,10 @@
font-size: 4rem;
}

.navbar-brand .icon {
font-size: 3rem;
}

.form-autocomplete .menu {
position: static;
}
Expand Down
2 changes: 1 addition & 1 deletion docs/css/docs.min.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 3 additions & 3 deletions docs/css/spectre.css
Original file line number Diff line number Diff line change
Expand Up @@ -741,15 +741,15 @@ abbr[title] {
-ms-flex: 1 0 auto;
flex: 1 0 auto;
}
.btn-group .btn:first-of-type:not(:last-of-type) {
.btn-group .btn:first-child:not(:last-child) {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
}
.btn-group .btn:not(:first-of-type):not(:last-of-type) {
.btn-group .btn:not(:first-child):not(:last-child) {
border-radius: 0;
margin-left: -.1rem;
}
.btn-group .btn:last-of-type:not(:first-of-type) {
.btn-group .btn:last-child:not(:first-child) {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
margin-left: -.1rem;
Expand Down
2 changes: 1 addition & 1 deletion docs/css/spectre.min.css

Large diffs are not rendered by default.

6 changes: 3 additions & 3 deletions docs/elements.html
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@
<section id="typography" class="container">
<header class="text-center"><h3>Typography</h3></header>
<section class="notes">
<p><strong>Typography</strong> sets default styles for headings, paragraphs, semantic text, blockquote, lists and code elements. </p>
<p><strong>Typography</strong> sets default styles for headings, paragraphs, semantic text, blockquote and lists elements.</p>
</section>
<header class="text-center"><h4>Headings</h4></header>
<section class="notes">
Expand Down Expand Up @@ -608,7 +608,7 @@ <h5>Korean</h5>

<section class="notes">
<p>You can use <code>:indeterminate</code> pseudo class for indeterminate state of checkboxes.</p>
<p>If you want to have a horizontal form, add the <code>form-horizontal</code> class to the <code>&lt;form&gt;</code> container. And add the <code>col-[1-12]</code> class to the child elements for form row layout. </p>
<p>If you want to have a horizontal form, add the <code>form-horizontal</code> class to the &lt;form&gt; container. And add the <code>col-[1-12]</code> class to the child elements for form row layout. </p>
</section>
<div class="columns">
<div class="column col-9 col-sm-12">
Expand Down Expand Up @@ -948,7 +948,7 @@ <h5>Korean</h5>

<header class="text-center"><h4>Form disabled styles</h4></header>
<section class="notes">
<p>Add the <code>disabled</code> attribute to the element or <code>&lt;fieldset&gt;</code> for a disabled form components style.</p>
<p>Add the <code>disabled</code> attribute to the element or &lt;fieldset&gt; for a disabled form components style.</p>
</section>
<div class="columns">
<div class="column col-9 col-xs-12">
Expand Down
Loading

0 comments on commit 589c7d8

Please sign in to comment.