kentucky 1.5.1 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. checksums.yaml +4 -4
  2. data/.gitignore +2 -1
  3. data/app/assets/stylesheets/kentucky/_kentucky.scss +35 -37
  4. data/app/assets/stylesheets/kentucky/{helpers → addons}/_border.scss +3 -2
  5. data/app/assets/stylesheets/kentucky/addons/_clearfix.scss +14 -0
  6. data/app/assets/stylesheets/kentucky/addons/_easings.scss +37 -0
  7. data/app/assets/stylesheets/kentucky/{helpers → addons}/_hide-text.scss +4 -4
  8. data/app/assets/stylesheets/kentucky/addons/_input-types.scss +82 -0
  9. data/app/assets/stylesheets/kentucky/{helpers → addons}/_position.scss +0 -0
  10. data/app/assets/stylesheets/kentucky/{helpers → addons}/_size.scss +0 -0
  11. data/app/assets/stylesheets/kentucky/addons/_truncate.scss +10 -0
  12. data/app/assets/stylesheets/kentucky/base/_buttons.scss +40 -0
  13. data/app/assets/stylesheets/kentucky/base/_forms.scss +86 -0
  14. data/app/assets/stylesheets/kentucky/{functions/_strip-units.scss → base/_layouts.scss} +3 -3
  15. data/app/assets/stylesheets/kentucky/base/_lists.scss +35 -0
  16. data/app/assets/stylesheets/kentucky/base/_project-settings.scss +112 -0
  17. data/app/assets/stylesheets/kentucky/base/_tables.scss +28 -0
  18. data/app/assets/stylesheets/kentucky/base/_typography.scss +91 -0
  19. data/app/assets/stylesheets/kentucky/functions/_assign.scss +17 -0
  20. data/app/assets/stylesheets/kentucky/functions/_tint-shade.scss +11 -0
  21. data/kentucky.gemspec +2 -2
  22. data/lib/kentucky/version.rb +1 -1
  23. data/readme.md +129 -0
  24. metadata +30 -38
  25. data/app/assets/stylesheets/kentucky/_forms.scss +0 -66
  26. data/app/assets/stylesheets/kentucky/_normalize.scss +0 -253
  27. data/app/assets/stylesheets/kentucky/_project-settings.scss +0 -108
  28. data/app/assets/stylesheets/kentucky/_typography.scss +0 -122
  29. data/app/assets/stylesheets/kentucky/functions/_gradient-functions.scss +0 -214
  30. data/app/assets/stylesheets/kentucky/functions/_remify.scss +0 -39
  31. data/app/assets/stylesheets/kentucky/grid/_grid.scss +0 -104
  32. data/app/assets/stylesheets/kentucky/helpers/_anti-aliased.scss +0 -8
  33. data/app/assets/stylesheets/kentucky/helpers/_breadcrumbs.scss +0 -24
  34. data/app/assets/stylesheets/kentucky/helpers/_clearfix.scss +0 -14
  35. data/app/assets/stylesheets/kentucky/helpers/_font-size.scss +0 -11
  36. data/app/assets/stylesheets/kentucky/helpers/_go.scss +0 -11
  37. data/app/assets/stylesheets/kentucky/helpers/_headings.scss +0 -11
  38. data/app/assets/stylesheets/kentucky/helpers/_html5-input-types.scss +0 -29
  39. data/app/assets/stylesheets/kentucky/helpers/_linear-gradient.scss +0 -42
  40. data/app/assets/stylesheets/kentucky/helpers/_mute.scss +0 -15
  41. data/app/assets/stylesheets/kentucky/helpers/_radial-gradient.scss +0 -24
  42. data/app/assets/stylesheets/kentucky/helpers/_strip-unit.scss +0 -7
  43. data/app/assets/stylesheets/kentucky/helpers/_triangle.scss +0 -49
  44. data/app/assets/stylesheets/kentucky/helpers/_truncate.scss +0 -19
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: a59862466ab84dfedecc0b0386cffb8eb2edbb14
4
- data.tar.gz: b16ce2b8a155461ad4d31eb9943db2ca4cbbd008
3
+ metadata.gz: 7dec6c9ae7bf8f6203b8bfed47cd4b27b7e370ae
4
+ data.tar.gz: 507c9dd8817c7753ac4442bf0f1eea0a7239b6de
5
5
  SHA512:
6
- metadata.gz: e5dc584dc299de9dd4a6f4bb03088a247fc3823d40ccc6738fe6fb13888058e771db095b317dcc84f6e05546f164d824e16ebc12b7ed1042487c8505a2822c8d
7
- data.tar.gz: e6c98487308e57c454ec9dfe6a0cc50bf561e7bd383a92a463127abef9146323e07b3e9de00beec858728a5c34aed6f144658392262a01facae5372502b9ae65
6
+ metadata.gz: 8137848b9a8a752b664fc81e52b6cad346b0145375f59b29ab7efab26b109a23c62b6e94190629cf0ba085bd9f35ecf8e7ef3d95e73d9ba74bec76f21c8c92db
7
+ data.tar.gz: 6fc05457987cebf7f9421341c096f791b9c4d7932c05e7321015a3d69d87493da00b16c86f8d6695a87a277818156c239949ecf3dce236b23de719e2254452d5
data/.gitignore CHANGED
@@ -8,4 +8,5 @@ tags
8
8
  app/assets/stylesheets/kentucky/config.codekit
9
9
  /app/assets/config.codekit
10
10
  /app/assets/stylesheets/kentucky/.DS_Store
11
- app/assets/stylesheets/.DS_Store
11
+ app/assets/stylesheets/.DS_Store
12
+ /**/.DS_Store
@@ -1,54 +1,52 @@
1
1
  // ------------------------------------------------------------------- //
2
- // Kentucky Project Imports
2
+ // Kentucky Project Settings
3
+ //
4
+ // Global variables used throughout Kentucky / projects.
3
5
  // ------------------------------------------------------------------- //
4
- // ------------------------------------------------------------------- //
5
- // Helpers, Functions, Mixins, and Extends
6
- // ------------------------------------------------------------------- //
7
-
8
- // Called first as these are used in other helpers/files
9
- @import "helpers/html5-input-types";
10
-
11
- // Functions
12
- @import "functions/gradient-functions";
13
- @import "functions/remify";
14
- @import "functions/strip-units";
15
6
 
16
- // Mixins
17
- @import "helpers/border";
18
- @import "helpers/font-size";
19
- @import "helpers/headings";
20
- @import "helpers/linear-gradient";
21
- @import "helpers/position";
22
- @import "helpers/radial-gradient";
23
- @import "helpers/size";
24
- @import "helpers/truncate";
7
+ @import "base/project-settings";
25
8
 
26
- // Extends
27
- @import "helpers/breadcrumbs";
28
- @import "helpers/go";
29
- @import "helpers/mute";
30
9
 
31
- // Addons
32
- @import "helpers/anti-aliased";
33
- @import "helpers/clearfix";
34
- @import "helpers/hide-text";
35
10
 
36
11
  // ------------------------------------------------------------------- //
37
- // Project Settings
12
+ // Kentucky Imports - Functions
13
+ //
14
+ // SCSS functions required by other elements of Kentucky.
38
15
  // ------------------------------------------------------------------- //
39
16
 
40
- @import "project-settings";
17
+ @import "functions/assign";
18
+ @import "functions/tint-shade";
19
+
20
+
41
21
 
42
22
  // ------------------------------------------------------------------- //
43
- // Grid
23
+ // Kentucky Import - Addons
24
+ //
25
+ // Additional mixin addons to help speed up front-end development.
44
26
  // ------------------------------------------------------------------- //
45
27
 
46
- @import "grid/grid";
28
+ @import "addons/border";
29
+ @import "addons/clearfix";
30
+ @import "addons/easings";
31
+ @import "addons/hide-text";
32
+ @import "addons/input-types";
33
+ @import "addons/position";
34
+ @import "addons/size";
35
+ @import "addons/truncate";
36
+
37
+
47
38
 
48
39
  // ------------------------------------------------------------------- //
49
- // Base
40
+ // Kentucky Imports - Base
41
+ //
42
+ // These are files related to project-settings (variables) and a
43
+ // custom set of normalization styles for more consistant HTML
44
+ // element display as a starting point.
50
45
  // ------------------------------------------------------------------- //
51
46
 
52
- @import "normalize";
53
- @import "forms";
54
- @import "typography";
47
+ @import "base/layouts";
48
+ @import "base/typography";
49
+ @import "base/buttons";
50
+ @import "base/forms";
51
+ @import "base/lists";
52
+ @import "base/tables";
@@ -27,6 +27,7 @@
27
27
  }
28
28
  }
29
29
 
30
- border: $border-style $border-color;
30
+ border-style: $border-style;
31
+ border-color: $border-color;
31
32
  border-width: $new-width;
32
- }
33
+ }
@@ -0,0 +1,14 @@
1
+ // ------------------------------------------------------------------- //
2
+ // Micro Clearfix
3
+ //
4
+ // Based on Thierry Koblentz's blog post on minimizing the already
5
+ // micro clearfix by Nicolas Gallagher.
6
+ // ------------------------------------------------------------------- //
7
+
8
+ @mixin clearfix {
9
+ &:after {
10
+ content: "";
11
+ display: table;
12
+ clear: both;
13
+ }
14
+ }
@@ -0,0 +1,37 @@
1
+ // ------------------------------------------------------------------- //
2
+ // Timing Functions
3
+ //
4
+ // Used for transitions / animations.
5
+ //
6
+ // Taken from http://easings.net/
7
+ // ------------------------------------------------------------------- //
8
+
9
+ // Ease In
10
+ $ease-in-sine: cubic-bezier(0.47, 0, 0.745, 0.715);
11
+ $ease-in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53);
12
+ $ease-in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19);
13
+ $ease-in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22);
14
+ $ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
15
+ $ease-in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035);
16
+ $ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335);
17
+ $ease-in-back: cubic-bezier(0.6, -0.28, 0.735, 0.045);
18
+
19
+ // Ease Out
20
+ $ease-out-sine: cubic-bezier(0.39, 0.575, 0.565, 1);
21
+ $ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
22
+ $ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1);
23
+ $ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1);
24
+ $ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);
25
+ $ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
26
+ $ease-out-circ: cubic-bezier(0.075, 0.82, 0.165, 1);
27
+ $ease-out-back: cubic-bezier(0.175, 0.885, 0.32, 1.275);
28
+
29
+ // Ease In Out
30
+ $ease-in-out-sine: cubic-bezier(0.445, 0.05, 0.55, 0.95);
31
+ $ease-in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955);
32
+ $ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1);
33
+ $ease-in-out-quart: cubic-bezier(0.77, 0, 0.175, 1);
34
+ $ease-in-out-quint: cubic-bezier(0.86, 0, 0.07, 1);
35
+ $ease-in-out-expo: cubic-bezier(1, 0, 0, 1);
36
+ $ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.15, 0.86);
37
+ $ease-in-out-back: cubic-bezier(0.68, -0.55, 0.265, 1.55);
@@ -2,8 +2,8 @@
2
2
  // Image Replacement - Hide Text
3
3
  // ------------------------------------------------------------------- //
4
4
 
5
- @mixin hide-text{
6
- color: transparent;
7
- font: 0/0 a;
8
- text-shadow: none;
5
+ @mixin hide-text {
6
+ text-indent: 101%;
7
+ overflow: hidden;
8
+ white-space: nowrap;
9
9
  }
@@ -0,0 +1,82 @@
1
+ // ------------------------------------------------------------------- //
2
+ // HTML 5 Input Types
3
+ //
4
+ // Generate a variable ($all-text-inputs) with a list of each HTML5
5
+ // input type with text-based input, excluding textarea.
6
+ //
7
+ // To use these you must use SCSS interpolation on the variable:
8
+ // #{$all-text-inputs}
9
+ // #{$all-text-inputs-hover}
10
+ // #{$all-text-inputs-focus}
11
+ // #{$all-text-inputs-active}
12
+ //
13
+ // Example:
14
+ // #{$all-text-inputs}, textarea {
15
+ // border: 1px solid red;
16
+ // }
17
+ // ------------------------------------------------------------------- //
18
+
19
+ $inputs-list: 'input[type="email"]',
20
+ 'input[type="number"]',
21
+ 'input[type="password"]',
22
+ 'input[type="search"]',
23
+ 'input[type="tel"]',
24
+ 'input[type="text"]',
25
+ 'input[type="url"]',
26
+
27
+ // Webkit & Gecko may change the display of these in the future
28
+ 'input[type="color"]',
29
+ 'input[type="date"]',
30
+ 'input[type="datetime"]',
31
+ 'input[type="datetime-local"]',
32
+ 'input[type="month"]',
33
+ 'input[type="time"]',
34
+ 'input[type="week"]';
35
+
36
+ // Bare Inputs
37
+ $all-text-inputs: assign-inputs($inputs-list);
38
+
39
+ // Hover Pseudo-class
40
+ $all-text-inputs-hover: assign-inputs($inputs-list, hover);
41
+
42
+ // Focus Pseudo-class
43
+ $all-text-inputs-focus: assign-inputs($inputs-list, focus);
44
+
45
+ // Active Pseudo-class
46
+ $all-text-inputs-active: assign-inputs($inputs-list, active);
47
+
48
+
49
+
50
+ // ------------------------------------------------------------------- //
51
+ // HTML 5 Button Types
52
+ //
53
+ // Generate a variable ($all-button-inputs) with a list of each HTML5
54
+ // input type with button-based input, excluding button.
55
+ //
56
+ // To use these you must use SCSS interpolation on the variable:
57
+ // #{$all-button-inputs}
58
+ // #{$all-button-inputs-hover}
59
+ // #{$all-button-inputs-focus}
60
+ // #{$all-button-inputs-active}
61
+ //
62
+ // Example:
63
+ // #{$all-button-inputs}, button {
64
+ // border: 1px solid red;
65
+ // }
66
+ // ------------------------------------------------------------------- //
67
+
68
+ $inputs-button-list: 'input[type="button"]',
69
+ 'input[type="reset"]',
70
+ 'input[type="submit"]';
71
+
72
+ // Bare inputs
73
+ $all-button-inputs: assign-inputs($inputs-button-list);
74
+
75
+ // Hover Pseudo-class
76
+ $all-button-inputs-hover: assign-inputs($inputs-button-list, hover);
77
+
78
+ // Focus Pseudo-class
79
+ $all-button-inputs-focus: assign-inputs($inputs-button-list, focus);
80
+
81
+ // Active Pseudo-class
82
+ $all-button-inputs-active: assign-inputs($inputs-button-list, active);
@@ -0,0 +1,10 @@
1
+ // Truncate single-lined elements
2
+
3
+ @mixin truncate($truncate-width: 100%){
4
+ display: inline-block;
5
+ max-width: $truncate-width;
6
+ overflow: hidden;
7
+ text-overflow: ellipsis;
8
+ white-space: nowrap;
9
+ word-wrap: normal;
10
+ }
@@ -0,0 +1,40 @@
1
+ // ------------------------------------------------------------------- //
2
+ // Button Normalization
3
+ //
4
+ // General styles to better standardize / simplify default <button>
5
+ // elements.
6
+ // ------------------------------------------------------------------- //
7
+
8
+ #{$all-button-inputs} {
9
+ -webkit-font-smoothing: antialiased;
10
+ -webkit-appearance: none;
11
+ -moz-appearance: none;
12
+ -ms-appearance: none;
13
+ appearance: none;
14
+ display: inline-block;
15
+ padding: ($base-spacing / 2) $base-spacing;
16
+ background-color: $base-button-color;
17
+ border: none;
18
+ border-radius: $base-border-radius;
19
+ color: white;
20
+ font-family: $base-font-family;
21
+ font-size: $base-font-size;
22
+ font-weight: bold;
23
+ line-height: 1;
24
+ text-decoration: none;
25
+ vertical-align: middle;
26
+ white-space: nowrap;
27
+ user-select: none;
28
+ cursor: pointer;
29
+
30
+ &:hover,
31
+ &:focus {
32
+ background-color: $hover-button-color;
33
+ color: white;
34
+ }
35
+
36
+ &:disabled {
37
+ cursor: not-allowed;
38
+ opacity: 0.5;
39
+ }
40
+ }
@@ -0,0 +1,86 @@
1
+ // ------------------------------------------------------------------- //
2
+ // Form Element Normalization
3
+ //
4
+ // General styles to better standardize / simplify default form
5
+ // elements.
6
+ // ------------------------------------------------------------------- //
7
+
8
+ fieldset {
9
+ margin: 0 0 ($base-spacing / 2) 0;
10
+ padding: $base-spacing;
11
+ background: lighten($base-border-color, 10);
12
+ border: $base-border;
13
+ }
14
+
15
+ input,
16
+ label,
17
+ select {
18
+ display: block;
19
+ font-family: $form-font-family;
20
+ font-size: $form-font-size;
21
+ }
22
+
23
+ label {
24
+ margin-bottom: $base-spacing / 4;
25
+ font-weight: bold;
26
+
27
+ &.required:after {
28
+ content: "*";
29
+ }
30
+
31
+ abbr {
32
+ display: none;
33
+ }
34
+ }
35
+
36
+ textarea,
37
+ #{$all-text-inputs},
38
+ select[multiple=multiple] {
39
+ width: 100%;
40
+ margin-bottom: $base-spacing / 2;
41
+ padding: ($base-spacing / 3) ($base-spacing / 3);
42
+ background-color: white;
43
+ border: 1px solid $form-border-color;
44
+ border-radius: $form-border-radius;
45
+ font-family: $form-font-family;
46
+ font-size: $form-font-size;
47
+ box-shadow: $form-box-shadow;
48
+ transition: border-color, .3s;
49
+
50
+ &:hover {
51
+ border-color: $form-border-color-hover;
52
+ }
53
+
54
+ &:focus {
55
+ border-color: $form-border-color-focus;
56
+ box-shadow: $form-box-shadow-focus;
57
+ outline: none;
58
+ }
59
+ }
60
+
61
+ textarea {
62
+ resize: vertical;
63
+ }
64
+
65
+ input[type="search"] {
66
+ -webkit-appearance: none;
67
+ -moz-appearance: none;
68
+ -ms-appearance: none;
69
+ }
70
+
71
+ input[type="checkbox"],
72
+ input[type="radio"] {
73
+ display: inline;
74
+ margin-right: $base-spacing / 4;
75
+ }
76
+
77
+ input[type="file"] {
78
+ width: 100%;
79
+ padding-bottom: $base-spacing / 2;
80
+ }
81
+
82
+ select {
83
+ max-width: 100%;
84
+ width: auto;
85
+ margin-bottom: $base-spacing;
86
+ }
@@ -1,7 +1,7 @@
1
1
  // ------------------------------------------------------------------- //
2
- // Strip Units from a value
2
+ // Layouts Normalization
3
3
  // ------------------------------------------------------------------- //
4
4
 
5
- @function strip-units($value){
6
- @return $value / ($value * 0 + 1)
5
+ * {
6
+ box-sizing: border-box;
7
7
  }
@@ -0,0 +1,35 @@
1
+ // ------------------------------------------------------------------- //
2
+ // List Normalization
3
+ // ------------------------------------------------------------------- //
4
+
5
+ ul,
6
+ ol {
7
+ margin: 0;
8
+ padding: 0;
9
+ list-style-type: none;
10
+
11
+ &%default-ul {
12
+ margin-bottom: $base-spacing / 2;
13
+ padding-left: $base-spacing;
14
+ list-style-type: disc;
15
+ }
16
+
17
+ &%default-ol {
18
+ margin-bottom: $base-spacing / 2;
19
+ padding-left: $base-spacing;
20
+ list-style-type: decimal;
21
+ }
22
+ }
23
+
24
+ dl {
25
+ margin-bottom: $base-spacing / 2;
26
+
27
+ dt {
28
+ margin-top: $base-spacing / 2;
29
+ font-weight: bold;
30
+ }
31
+
32
+ dd {
33
+ margin: 0;
34
+ }
35
+ }