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

View File

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