kentucky 1.5.1 → 2.0.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/.gitignore +2 -1
- data/app/assets/stylesheets/kentucky/_kentucky.scss +35 -37
- data/app/assets/stylesheets/kentucky/{helpers → addons}/_border.scss +3 -2
- data/app/assets/stylesheets/kentucky/addons/_clearfix.scss +14 -0
- data/app/assets/stylesheets/kentucky/addons/_easings.scss +37 -0
- data/app/assets/stylesheets/kentucky/{helpers → addons}/_hide-text.scss +4 -4
- data/app/assets/stylesheets/kentucky/addons/_input-types.scss +82 -0
- data/app/assets/stylesheets/kentucky/{helpers → addons}/_position.scss +0 -0
- data/app/assets/stylesheets/kentucky/{helpers → addons}/_size.scss +0 -0
- data/app/assets/stylesheets/kentucky/addons/_truncate.scss +10 -0
- data/app/assets/stylesheets/kentucky/base/_buttons.scss +40 -0
- data/app/assets/stylesheets/kentucky/base/_forms.scss +86 -0
- data/app/assets/stylesheets/kentucky/{functions/_strip-units.scss → base/_layouts.scss} +3 -3
- data/app/assets/stylesheets/kentucky/base/_lists.scss +35 -0
- data/app/assets/stylesheets/kentucky/base/_project-settings.scss +112 -0
- data/app/assets/stylesheets/kentucky/base/_tables.scss +28 -0
- data/app/assets/stylesheets/kentucky/base/_typography.scss +91 -0
- data/app/assets/stylesheets/kentucky/functions/_assign.scss +17 -0
- data/app/assets/stylesheets/kentucky/functions/_tint-shade.scss +11 -0
- data/kentucky.gemspec +2 -2
- data/lib/kentucky/version.rb +1 -1
- data/readme.md +129 -0
- metadata +30 -38
- data/app/assets/stylesheets/kentucky/_forms.scss +0 -66
- data/app/assets/stylesheets/kentucky/_normalize.scss +0 -253
- data/app/assets/stylesheets/kentucky/_project-settings.scss +0 -108
- data/app/assets/stylesheets/kentucky/_typography.scss +0 -122
- data/app/assets/stylesheets/kentucky/functions/_gradient-functions.scss +0 -214
- data/app/assets/stylesheets/kentucky/functions/_remify.scss +0 -39
- data/app/assets/stylesheets/kentucky/grid/_grid.scss +0 -104
- data/app/assets/stylesheets/kentucky/helpers/_anti-aliased.scss +0 -8
- data/app/assets/stylesheets/kentucky/helpers/_breadcrumbs.scss +0 -24
- data/app/assets/stylesheets/kentucky/helpers/_clearfix.scss +0 -14
- data/app/assets/stylesheets/kentucky/helpers/_font-size.scss +0 -11
- data/app/assets/stylesheets/kentucky/helpers/_go.scss +0 -11
- data/app/assets/stylesheets/kentucky/helpers/_headings.scss +0 -11
- data/app/assets/stylesheets/kentucky/helpers/_html5-input-types.scss +0 -29
- data/app/assets/stylesheets/kentucky/helpers/_linear-gradient.scss +0 -42
- data/app/assets/stylesheets/kentucky/helpers/_mute.scss +0 -15
- data/app/assets/stylesheets/kentucky/helpers/_radial-gradient.scss +0 -24
- data/app/assets/stylesheets/kentucky/helpers/_strip-unit.scss +0 -7
- data/app/assets/stylesheets/kentucky/helpers/_triangle.scss +0 -49
- data/app/assets/stylesheets/kentucky/helpers/_truncate.scss +0 -19
@@ -1,214 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Bourbon Gradient Mixins Req. Functions
|
3
|
-
//
|
4
|
-
// https://github.com/thoughtbot/bourbon/tree/master/app/assets/stylesheets/helpers
|
5
|
-
// ------------------------------------------------------------------- //
|
6
|
-
|
7
|
-
// Position Parser
|
8
|
-
@function _gradient-positions-parser($gradient-type, $gradient-positions) {
|
9
|
-
@if $gradient-positions
|
10
|
-
and ($gradient-type == linear)
|
11
|
-
and (type-of($gradient-positions) != color) {
|
12
|
-
$gradient-positions: _linear-positions-parser($gradient-positions);
|
13
|
-
}
|
14
|
-
@else if $gradient-positions
|
15
|
-
and ($gradient-type == radial)
|
16
|
-
and (type-of($gradient-positions) != color) {
|
17
|
-
$gradient-positions: _radial-positions-parser($gradient-positions);
|
18
|
-
}
|
19
|
-
@return $gradient-positions;
|
20
|
-
}
|
21
|
-
|
22
|
-
// Linear Position Parser
|
23
|
-
@function _linear-positions-parser($pos) {
|
24
|
-
$type: type-of(nth($pos, 1));
|
25
|
-
$spec: null;
|
26
|
-
$degree: null;
|
27
|
-
$side: null;
|
28
|
-
$corner: null;
|
29
|
-
$length: length($pos);
|
30
|
-
// Parse Side and corner positions
|
31
|
-
@if ($length > 1) {
|
32
|
-
@if nth($pos, 1) == "to" { // Newer syntax
|
33
|
-
$side: nth($pos, 2);
|
34
|
-
|
35
|
-
@if $length == 2 { // eg. to top
|
36
|
-
// Swap for backwards compatability
|
37
|
-
$degree: _position-flipper(nth($pos, 2));
|
38
|
-
}
|
39
|
-
@else if $length == 3 { // eg. to top left
|
40
|
-
$corner: nth($pos, 3);
|
41
|
-
}
|
42
|
-
}
|
43
|
-
@else if $length == 2 { // Older syntax ("top left")
|
44
|
-
$side: _position-flipper(nth($pos, 1));
|
45
|
-
$corner: _position-flipper(nth($pos, 2));
|
46
|
-
}
|
47
|
-
|
48
|
-
@if ("#{$side} #{$corner}" == "left top") or ("#{$side} #{$corner}" == "top left") {
|
49
|
-
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
50
|
-
}
|
51
|
-
@else if ("#{$side} #{$corner}" == "right top") or ("#{$side} #{$corner}" == "top right") {
|
52
|
-
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
53
|
-
}
|
54
|
-
@else if ("#{$side} #{$corner}" == "right bottom") or ("#{$side} #{$corner}" == "bottom right") {
|
55
|
-
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
56
|
-
}
|
57
|
-
@else if ("#{$side} #{$corner}" == "left bottom") or ("#{$side} #{$corner}" == "bottom left") {
|
58
|
-
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
|
59
|
-
}
|
60
|
-
$spec: to $side $corner;
|
61
|
-
}
|
62
|
-
@else if $length == 1 {
|
63
|
-
// Swap for backwards compatability
|
64
|
-
@if $type == string {
|
65
|
-
$degree: $pos;
|
66
|
-
$spec: to _position-flipper($pos);
|
67
|
-
}
|
68
|
-
@else {
|
69
|
-
$degree: -270 - $pos; //rotate the gradient opposite from spec
|
70
|
-
$spec: $pos;
|
71
|
-
}
|
72
|
-
}
|
73
|
-
$degree: unquote($degree + ",");
|
74
|
-
$spec: unquote($spec + ",");
|
75
|
-
@return $degree $spec;
|
76
|
-
}
|
77
|
-
|
78
|
-
@function _position-flipper($pos) {
|
79
|
-
@return if($pos == left, right, null)
|
80
|
-
if($pos == right, left, null)
|
81
|
-
if($pos == top, bottom, null)
|
82
|
-
if($pos == bottom, top, null);
|
83
|
-
}
|
84
|
-
|
85
|
-
// Radial Argument Parser
|
86
|
-
@function _radial-arg-parser($G1, $G2, $pos, $shape-size) {
|
87
|
-
@each $value in $G1, $G2 {
|
88
|
-
$first-val: nth($value, 1);
|
89
|
-
$pos-type: type-of($first-val);
|
90
|
-
$spec-at-index: null;
|
91
|
-
|
92
|
-
// Determine if spec was passed to mixin
|
93
|
-
@if type-of($value) == list {
|
94
|
-
$spec-at-index: if(index($value, at), index($value, at), false);
|
95
|
-
}
|
96
|
-
@if $spec-at-index {
|
97
|
-
@if $spec-at-index > 1 {
|
98
|
-
@for $i from 1 through ($spec-at-index - 1) {
|
99
|
-
$shape-size: $shape-size nth($value, $i);
|
100
|
-
}
|
101
|
-
@for $i from ($spec-at-index + 1) through length($value) {
|
102
|
-
$pos: $pos nth($value, $i);
|
103
|
-
}
|
104
|
-
}
|
105
|
-
@else if $spec-at-index == 1 {
|
106
|
-
@for $i from ($spec-at-index + 1) through length($value) {
|
107
|
-
$pos: $pos nth($value, $i);
|
108
|
-
}
|
109
|
-
}
|
110
|
-
$G1: null;
|
111
|
-
}
|
112
|
-
|
113
|
-
// If not spec calculate correct values
|
114
|
-
@else {
|
115
|
-
@if ($pos-type != color) or ($first-val != "transparent") {
|
116
|
-
@if ($pos-type == number)
|
117
|
-
or ($first-val == "center")
|
118
|
-
or ($first-val == "top")
|
119
|
-
or ($first-val == "right")
|
120
|
-
or ($first-val == "bottom")
|
121
|
-
or ($first-val == "left") {
|
122
|
-
|
123
|
-
$pos: $value;
|
124
|
-
|
125
|
-
@if $pos == $G1 {
|
126
|
-
$G1: null;
|
127
|
-
}
|
128
|
-
}
|
129
|
-
|
130
|
-
@else if
|
131
|
-
($first-val == "ellipse")
|
132
|
-
or ($first-val == "circle")
|
133
|
-
or ($first-val == "closest-side")
|
134
|
-
or ($first-val == "closest-corner")
|
135
|
-
or ($first-val == "farthest-side")
|
136
|
-
or ($first-val == "farthest-corner")
|
137
|
-
or ($first-val == "contain")
|
138
|
-
or ($first-val == "cover") {
|
139
|
-
|
140
|
-
$shape-size: $value;
|
141
|
-
|
142
|
-
@if $value == $G1 {
|
143
|
-
$G1: null;
|
144
|
-
}
|
145
|
-
|
146
|
-
@else if $value == $G2 {
|
147
|
-
$G2: null;
|
148
|
-
}
|
149
|
-
}
|
150
|
-
}
|
151
|
-
}
|
152
|
-
}
|
153
|
-
@return $G1, $G2, $pos, $shape-size;
|
154
|
-
}
|
155
|
-
|
156
|
-
// Radial Position Parser
|
157
|
-
@function _radial-positions-parser($gradient-pos) {
|
158
|
-
$shape-size: nth($gradient-pos, 1);
|
159
|
-
$pos: nth($gradient-pos, 2);
|
160
|
-
$shape-size-spec: _shape-size-stripper($shape-size);
|
161
|
-
|
162
|
-
$pre-spec: unquote(if($pos, "#{$pos}, ", null))
|
163
|
-
unquote(if($shape-size, "#{$shape-size},", null));
|
164
|
-
$pos-spec: if($pos, "at #{$pos}", null);
|
165
|
-
|
166
|
-
$spec: "#{$shape-size-spec} #{$pos-spec}";
|
167
|
-
|
168
|
-
// Add comma
|
169
|
-
@if ($spec != ' ') {
|
170
|
-
$spec: "#{$spec},"
|
171
|
-
}
|
172
|
-
|
173
|
-
@return $pre-spec $spec;
|
174
|
-
}
|
175
|
-
|
176
|
-
// Render Gradients
|
177
|
-
// Used for linear and radial gradients within background-image or border-image properties
|
178
|
-
|
179
|
-
@function _render-gradients($gradient-positions, $gradients, $gradient-type, $vendor: false) {
|
180
|
-
$pre-spec: null;
|
181
|
-
$spec: null;
|
182
|
-
$vendor-gradients: null;
|
183
|
-
@if $gradient-type == linear {
|
184
|
-
@if $gradient-positions {
|
185
|
-
$pre-spec: nth($gradient-positions, 1);
|
186
|
-
$spec: nth($gradient-positions, 2);
|
187
|
-
}
|
188
|
-
}
|
189
|
-
@else if $gradient-type == radial {
|
190
|
-
$pre-spec: nth($gradient-positions, 1);
|
191
|
-
$spec: nth($gradient-positions, 2);
|
192
|
-
}
|
193
|
-
|
194
|
-
@if $vendor {
|
195
|
-
$vendor-gradients: -#{$vendor}-#{$gradient-type}-gradient(#{$pre-spec} $gradients);
|
196
|
-
}
|
197
|
-
@else if $vendor == false {
|
198
|
-
$vendor-gradients: "#{$gradient-type}-gradient(#{$spec} #{$gradients})";
|
199
|
-
$vendor-gradients: unquote($vendor-gradients);
|
200
|
-
}
|
201
|
-
@return $vendor-gradients;
|
202
|
-
}
|
203
|
-
|
204
|
-
// Shape Size Stripper
|
205
|
-
@function _shape-size-stripper($shape-size) {
|
206
|
-
$shape-size-spec: null;
|
207
|
-
@each $value in $shape-size {
|
208
|
-
@if ($value == "cover") or ($value == "contain") {
|
209
|
-
$value: null;
|
210
|
-
}
|
211
|
-
$shape-size-spec: "#{$shape-size-spec} #{$value}";
|
212
|
-
}
|
213
|
-
@return $shape-size-spec;
|
214
|
-
}
|
@@ -1,39 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Convert Pixel to REM
|
3
|
-
//
|
4
|
-
// Credit: https://github.com/mariusz/remify
|
5
|
-
// ------------------------------------------------------------------- //
|
6
|
-
|
7
|
-
@function remify($px){
|
8
|
-
$base-rem-size: $base-font-size / 1rem;
|
9
|
-
|
10
|
-
// If value is 0, return 0
|
11
|
-
@if $px == 0 {
|
12
|
-
@return 0;
|
13
|
-
}
|
14
|
-
|
15
|
-
@if type-of(px) == "number" {
|
16
|
-
|
17
|
-
@return $px / $base-rem-size;
|
18
|
-
|
19
|
-
} @else {
|
20
|
-
|
21
|
-
$rems: ();
|
22
|
-
|
23
|
-
@each $value in $px{
|
24
|
-
|
25
|
-
@if $value == 0{
|
26
|
-
$rems: append($rems, $value);
|
27
|
-
} @else {
|
28
|
-
$rems: append($rems, ($value / $base-rem-size));
|
29
|
-
}
|
30
|
-
}
|
31
|
-
|
32
|
-
@return $rems;
|
33
|
-
}
|
34
|
-
}
|
35
|
-
|
36
|
-
@mixin rem($property, $values){
|
37
|
-
#{$property}: $values;
|
38
|
-
#{$property}: remify($values);
|
39
|
-
}
|
@@ -1,104 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Grid Settings
|
3
|
-
// ------------------------------------------------------------------- //
|
4
|
-
|
5
|
-
$max-width: 960px !default;
|
6
|
-
$grid-columns: 12 !default;
|
7
|
-
$grid-gutter: 15px !default;
|
8
|
-
$column: $max-width / $grid-columns !default;
|
9
|
-
|
10
|
-
// ------------------------------------------------------------------- //
|
11
|
-
// Set Container
|
12
|
-
// ------------------------------------------------------------------- //
|
13
|
-
|
14
|
-
@mixin outer-container {
|
15
|
-
@include clearfix;
|
16
|
-
max-width: $max-width;
|
17
|
-
width: 100%;
|
18
|
-
margin: 0 auto;
|
19
|
-
}
|
20
|
-
|
21
|
-
// ------------------------------------------------------------------- //
|
22
|
-
// Set Full Width Row
|
23
|
-
// ------------------------------------------------------------------- //
|
24
|
-
|
25
|
-
@mixin row{
|
26
|
-
@include clearfix;
|
27
|
-
position: relative;
|
28
|
-
display: block;
|
29
|
-
margin: 0 -#{$grid-gutter};
|
30
|
-
}
|
31
|
-
|
32
|
-
// ------------------------------------------------------------------- //
|
33
|
-
// Set Widths
|
34
|
-
// ------------------------------------------------------------------- //
|
35
|
-
|
36
|
-
@mixin span-columns($col-size, $flow: left) {
|
37
|
-
|
38
|
-
$col-width: percentage($col-size / $grid-columns);
|
39
|
-
|
40
|
-
@if $col-size > $grid-columns {
|
41
|
-
@warn "Column size should not be greater than max-columns (#{$grid-columns}).";
|
42
|
-
}
|
43
|
-
|
44
|
-
@else {
|
45
|
-
|
46
|
-
@if $flow == left {
|
47
|
-
float: left;
|
48
|
-
width: $col-width;
|
49
|
-
padding: 0 $grid-gutter;
|
50
|
-
}
|
51
|
-
|
52
|
-
@if $flow == "right"{
|
53
|
-
float: right;
|
54
|
-
width: $col-width;
|
55
|
-
padding: 0 $grid-gutter;
|
56
|
-
}
|
57
|
-
|
58
|
-
@else if $flow == "center" {
|
59
|
-
float: none;
|
60
|
-
width: $col-width;
|
61
|
-
margin: 0 auto;
|
62
|
-
padding: 0 $grid-gutter;
|
63
|
-
}
|
64
|
-
}
|
65
|
-
}
|
66
|
-
|
67
|
-
// ------------------------------------------------------------------- //
|
68
|
-
// Shift
|
69
|
-
// ------------------------------------------------------------------- //
|
70
|
-
|
71
|
-
@mixin shift($col-shift) {
|
72
|
-
$shift: percentage($col-shift / 12);
|
73
|
-
|
74
|
-
@if $col-shift > 12 {
|
75
|
-
@warn "Should not shift greater than max-columns (12).";
|
76
|
-
}
|
77
|
-
|
78
|
-
@else {
|
79
|
-
margin-left: $shift;
|
80
|
-
}
|
81
|
-
}
|
82
|
-
|
83
|
-
// ------------------------------------------------------------------- //
|
84
|
-
// Hug
|
85
|
-
// ------------------------------------------------------------------- //
|
86
|
-
|
87
|
-
@mixin hug($direction){
|
88
|
-
|
89
|
-
@if $direction == "left" {
|
90
|
-
padding-left: 0;
|
91
|
-
}
|
92
|
-
|
93
|
-
@else if $direction == "right" {
|
94
|
-
padding-right: 0;
|
95
|
-
}
|
96
|
-
|
97
|
-
@else if $direction == "both" {
|
98
|
-
padding: 0;
|
99
|
-
}
|
100
|
-
|
101
|
-
@else {
|
102
|
-
@warn "Hug requires 'left', 'right', or 'both'. Please choose a valid direction.";
|
103
|
-
}
|
104
|
-
}
|
@@ -1,8 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// For chunky looking fonts (FF/Webkit)
|
3
|
-
// ------------------------------------------------------------------- //
|
4
|
-
|
5
|
-
%antialiased{
|
6
|
-
-webkit-font-smoothing: antialiased;
|
7
|
-
-moz-osx-font-smoothing: grayscale;
|
8
|
-
}
|
@@ -1,24 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Breadcrumbs
|
3
|
-
//
|
4
|
-
// Must be extended in the ul of the breadcrumbs
|
5
|
-
// Adds auto-magical separators
|
6
|
-
// ------------------------------------------------------------------- //
|
7
|
-
|
8
|
-
// Simple breadcrumb ">"
|
9
|
-
%breadcrumb{
|
10
|
-
& > li + li:before{
|
11
|
-
content:"\00BB" "\00A0";
|
12
|
-
}
|
13
|
-
}
|
14
|
-
|
15
|
-
// Path breadcrumb "/"
|
16
|
-
%breadcrumb--path{
|
17
|
-
& > li + li:before{
|
18
|
-
content:"\002F" "\00A0";
|
19
|
-
}
|
20
|
-
}
|
21
|
-
|
22
|
-
%breadcrumb__root{
|
23
|
-
font-weight:bold;
|
24
|
-
}
|
@@ -1,14 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Clearfix
|
3
|
-
//
|
4
|
-
// Source:
|
5
|
-
// css-101.org/articles/clearfix/latest-new-clearfix-so-far.php
|
6
|
-
// ------------------------------------------------------------------- //
|
7
|
-
|
8
|
-
@mixin clearfix{
|
9
|
-
&:after {
|
10
|
-
content:"";
|
11
|
-
display:table;
|
12
|
-
clear:both;
|
13
|
-
}
|
14
|
-
}
|
@@ -1,11 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Quickly generate rem font-size w/ px fallback and line-height
|
3
|
-
// ------------------------------------------------------------------- //
|
4
|
-
|
5
|
-
@mixin font-size($font-size, $line-height: true){
|
6
|
-
font-size: remify($font-size);
|
7
|
-
|
8
|
-
@if $line-height == true {
|
9
|
-
line-height: ceil($font-size / $base-line-height) * ($base-line-height / $font-size);
|
10
|
-
}
|
11
|
-
}
|
@@ -1,11 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// "Go"
|
3
|
-
//
|
4
|
-
// Add right-facing arrow, indicating movement through site
|
5
|
-
// ------------------------------------------------------------------- //
|
6
|
-
|
7
|
-
%go{
|
8
|
-
&:after{
|
9
|
-
content: "\00A0" "\OOBB";
|
10
|
-
}
|
11
|
-
}
|
@@ -1,11 +0,0 @@
|
|
1
|
-
// ------------------------------------------------------------------- //
|
2
|
-
// Quickly target H# - H#
|
3
|
-
// ------------------------------------------------------------------- //
|
4
|
-
|
5
|
-
@mixin headings($from: 1, $to: 6){
|
6
|
-
@for $i from $from through $to{
|
7
|
-
h#{$i}{
|
8
|
-
@content
|
9
|
-
}
|
10
|
-
}
|
11
|
-
}
|