Add unique features

This commit is contained in:
Jeremy Thomas 2017-07-31 17:42:53 +01:00
parent 236837f36c
commit dcfe0a68af
4 changed files with 143 additions and 39 deletions

View File

@ -29,7 +29,7 @@
</td>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/grid/tiles/">
tile
</a>
@ -44,7 +44,7 @@
</th>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/form/general/">
field
</a>
@ -126,7 +126,7 @@
</td>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/form/select/">
select
</a>
@ -160,7 +160,7 @@
</td>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/form/file/">
file
</a>
@ -187,7 +187,7 @@
</th>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/elements/box/">
box
</a>
@ -209,7 +209,7 @@
</td>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/elements/content/">
content
</a>
@ -354,7 +354,7 @@
<td class="is-empty">
</td>
<td>
<td class="is-unique">
<a href="http://getbootstrap.com/css/#type-lists" target="_blank">
lists
</a>
@ -364,7 +364,7 @@
<td class="is-empty">
</td>
<td>
<td class="is-unique">
<a href="http://getbootstrap.com/css/#caret" target="_blank">
caret
</a>
@ -388,7 +388,7 @@
</td>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/components/card/">
card
</a>
@ -410,7 +410,7 @@
</td>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/components/level/">
level
</a>
@ -423,7 +423,7 @@
<td class="is-empty">
</td>
<td>
<td class="is-unique">
<a href="http://getbootstrap.com/components/#list-group" target="_blank">
list group
</a>
@ -442,7 +442,7 @@
</td>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/components/menu/">
menu
</a>
@ -491,7 +491,7 @@
<td class="is-empty">
</td>
<td>
<td class="is-unique">
<a href="http://getbootstrap.com/components/#page-header" target="_blank">
page header
</a>
@ -510,7 +510,7 @@
</td>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/components/panel/">
panel
</a>
@ -535,7 +535,7 @@
<td class="is-empty">
</td>
<td>
<td class="is-unique">
<a href="http://getbootstrap.com/components/#wells" target="_blank">
wells
</a>
@ -571,7 +571,7 @@
</td>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/layout/section/">
section
</a>
@ -581,7 +581,7 @@
</td>
</tr>
<tr>
<td>
<td class="is-unique">
<a href="{{ site.url }}/documentation/layout/footer/">
footer
</a>

View File

@ -62,24 +62,36 @@ $bootstrap-invert: #fff
margin: 0 auto
max-width: 42rem
.table
svg
float: left
height: 1rem
margin-right: 0.5rem
margin-top: 0.25rem
width: auto
color: $red
thead,
tfoot
th
font-size: 1.5rem
text-align: center
svg
height: 1.5rem
margin-right: 1rem
position: relative
top: 0.25rem
width: auto
tbody
th[colspan]
font-size: 1.25em
a
color: $red
th
font-size: 1.25rem
text-align: center
td
font-family: $family-monospace
width: 50%
a
color: currentColor
&:hover
color: $text-strong
text-decoration: underline
.is-empty
background-color: $background
color: $text-light
.is-unique
background-color: rgba($green, 0.25)
color: $text-strong
font-weight: $weight-bold
.comparison-header
margin-bottom: 3rem

File diff suppressed because one or more lines are too long

View File

@ -30,6 +30,14 @@ $table-striped-row-even-hover-background-color: $white-ter !default
border-width: $table-cell-border-width
padding: $table-cell-padding
vertical-align: top
// Colors
@each $name, $pair in $colors
$color: nth($pair, 1)
$color-invert: nth($pair, 2)
&.is-#{$name}
background-color: $color
border-color: $color
color: $color-invert
// Modifiers
&.is-narrow
white-space: nowrap