blaze-css-rails 0.0.8 → 0.0.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (121) hide show
  1. checksums.yaml +4 -4
  2. data/lib/blaze/css/rails.rb +9 -1
  3. data/lib/blaze/css/rails/version.rb +1 -1
  4. data/vendor/assets/stylesheets/blaze.scss +1 -0
  5. data/vendor/blaze-css/CONTRIBUTING.md +35 -0
  6. data/{LICENSE.md → vendor/blaze-css/LICENSE} +1 -0
  7. data/vendor/blaze-css/README.md +18 -0
  8. data/vendor/blaze-css/bower.json +32 -0
  9. data/vendor/blaze-css/demo/blaze.colors.min.css +1 -0
  10. data/vendor/blaze-css/demo/blaze.min.css +1 -0
  11. data/vendor/blaze-css/demo/index.html +2593 -0
  12. data/vendor/blaze-css/demo/themes/blaze.example.min.css +1 -0
  13. data/vendor/blaze-css/dist/blaze.colors.min.css +1 -0
  14. data/vendor/blaze-css/dist/blaze.min.css +1 -0
  15. data/vendor/blaze-css/dist/components.addresses.min.css +1 -0
  16. data/vendor/blaze-css/dist/components.alerts.min.css +1 -0
  17. data/vendor/blaze-css/dist/components.avatars.min.css +1 -0
  18. data/vendor/blaze-css/dist/components.badges.min.css +1 -0
  19. data/vendor/blaze-css/dist/components.breadcrumbs.min.css +1 -0
  20. data/vendor/blaze-css/dist/components.bubbles.min.css +1 -0
  21. data/vendor/blaze-css/dist/components.buttons.min.css +1 -0
  22. data/vendor/blaze-css/dist/components.calendars.min.css +1 -0
  23. data/vendor/blaze-css/dist/components.cards.min.css +1 -0
  24. data/vendor/blaze-css/dist/components.headings.min.css +1 -0
  25. data/vendor/blaze-css/dist/components.hints.min.css +1 -0
  26. data/vendor/blaze-css/dist/components.input-groups.min.css +1 -0
  27. data/vendor/blaze-css/dist/components.inputs.min.css +1 -0
  28. data/vendor/blaze-css/dist/components.links.min.css +1 -0
  29. data/vendor/blaze-css/dist/components.lists.min.css +1 -0
  30. data/vendor/blaze-css/dist/components.navs.min.css +1 -0
  31. data/vendor/blaze-css/dist/components.overlays.min.css +1 -0
  32. data/vendor/blaze-css/dist/components.pagination.min.css +1 -0
  33. data/vendor/blaze-css/dist/components.progress.min.css +1 -0
  34. data/vendor/blaze-css/dist/components.ranges.min.css +1 -0
  35. data/vendor/blaze-css/dist/components.tables.min.css +1 -0
  36. data/vendor/blaze-css/dist/components.tabs.min.css +1 -0
  37. data/vendor/blaze-css/dist/components.tags.min.css +1 -0
  38. data/vendor/blaze-css/dist/components.toggles.min.css +1 -0
  39. data/vendor/blaze-css/dist/components.tooltips.min.css +1 -0
  40. data/vendor/blaze-css/dist/components.trees.min.css +1 -0
  41. data/vendor/blaze-css/dist/components.typography.min.css +1 -0
  42. data/vendor/blaze-css/dist/generics.global.min.css +1 -0
  43. data/vendor/blaze-css/dist/objects.containers.min.css +1 -0
  44. data/vendor/blaze-css/dist/objects.drawers.min.css +1 -0
  45. data/vendor/blaze-css/dist/objects.forms.min.css +1 -0
  46. data/vendor/blaze-css/dist/objects.grid.min.css +1 -0
  47. data/vendor/blaze-css/dist/objects.grid.responsive.min.css +1 -0
  48. data/vendor/blaze-css/dist/objects.images.min.css +1 -0
  49. data/vendor/blaze-css/dist/objects.media.min.css +1 -0
  50. data/vendor/blaze-css/dist/objects.modals.min.css +1 -0
  51. data/vendor/blaze-css/dist/objects.panels.min.css +1 -0
  52. data/vendor/blaze-css/dist/themes/blaze.example.min.css +1 -0
  53. data/vendor/blaze-css/dist/utilities.alignment.min.css +1 -0
  54. data/vendor/blaze-css/dist/utilities.boxing.min.css +1 -0
  55. data/vendor/blaze-css/dist/utilities.elevation.min.css +1 -0
  56. data/vendor/blaze-css/dist/utilities.sizes.min.css +1 -0
  57. data/vendor/blaze-css/gulpfile.js +68 -0
  58. data/vendor/blaze-css/package.json +55 -0
  59. data/vendor/blaze-css/scss/blaze.colors.scss +14 -0
  60. data/vendor/blaze-css/scss/blaze.scss +41 -0
  61. data/vendor/blaze-css/scss/components.addresses.scss +12 -0
  62. data/vendor/blaze-css/scss/components.alerts.scss +59 -0
  63. data/vendor/blaze-css/scss/components.avatars.scss +36 -0
  64. data/vendor/blaze-css/scss/components.badges.scss +60 -0
  65. data/vendor/blaze-css/scss/components.breadcrumbs.scss +20 -0
  66. data/vendor/blaze-css/scss/components.bubbles.scss +49 -0
  67. data/vendor/blaze-css/scss/components.buttons.scss +77 -0
  68. data/vendor/blaze-css/scss/components.calendars.scss +69 -0
  69. data/vendor/blaze-css/scss/components.cards.scss +200 -0
  70. data/vendor/blaze-css/scss/components.headings.scss +38 -0
  71. data/vendor/blaze-css/scss/components.hints.scss +27 -0
  72. data/vendor/blaze-css/scss/components.input-groups.scss +159 -0
  73. data/vendor/blaze-css/scss/components.inputs.scss +138 -0
  74. data/vendor/blaze-css/scss/components.links.scss +31 -0
  75. data/vendor/blaze-css/scss/components.lists.scss +60 -0
  76. data/vendor/blaze-css/scss/components.navs.scss +126 -0
  77. data/vendor/blaze-css/scss/components.overlays.scss +26 -0
  78. data/vendor/blaze-css/scss/components.pagination.scss +42 -0
  79. data/vendor/blaze-css/scss/components.progress.scss +51 -0
  80. data/vendor/blaze-css/scss/components.ranges.scss +114 -0
  81. data/vendor/blaze-css/scss/components.tables.scss +88 -0
  82. data/vendor/blaze-css/scss/components.tabs.scss +57 -0
  83. data/vendor/blaze-css/scss/components.tags.scss +42 -0
  84. data/vendor/blaze-css/scss/components.toggles.scss +74 -0
  85. data/vendor/blaze-css/scss/components.tooltips.scss +96 -0
  86. data/vendor/blaze-css/scss/components.trees.scss +39 -0
  87. data/vendor/blaze-css/scss/components.typography.scss +94 -0
  88. data/vendor/blaze-css/scss/generics.global.scss +13 -0
  89. data/vendor/blaze-css/scss/mixins/_components.alerts.scss +6 -0
  90. data/vendor/blaze-css/scss/mixins/_components.badges.scss +8 -0
  91. data/vendor/blaze-css/scss/mixins/_components.buttons.scss +83 -0
  92. data/vendor/blaze-css/scss/mixins/_components.inputs.scss +45 -0
  93. data/vendor/blaze-css/scss/mixins/_components.links.scss +22 -0
  94. data/vendor/blaze-css/scss/mixins/_components.lists.scss +10 -0
  95. data/vendor/blaze-css/scss/mixins/_components.navs.scss +29 -0
  96. data/vendor/blaze-css/scss/mixins/_components.ranges.scss +89 -0
  97. data/vendor/blaze-css/scss/mixins/_components.tabs.scss +5 -0
  98. data/vendor/blaze-css/scss/mixins/_components.toggles.scss +6 -0
  99. data/vendor/blaze-css/scss/mixins/_components.typography.scss +25 -0
  100. data/vendor/blaze-css/scss/mixins/_objects.grid.scss +112 -0
  101. data/vendor/blaze-css/scss/mixins/_settings.global.scss +864 -0
  102. data/vendor/blaze-css/scss/mixins/_tools.mediaqueries.scss +73 -0
  103. data/vendor/blaze-css/scss/mixins/_utilities.alignment.scss +24 -0
  104. data/vendor/blaze-css/scss/mixins/_utilities.boxing.scss +125 -0
  105. data/vendor/blaze-css/scss/objects.containers.scss +10 -0
  106. data/vendor/blaze-css/scss/objects.drawers.scss +88 -0
  107. data/vendor/blaze-css/scss/objects.forms.scss +25 -0
  108. data/vendor/blaze-css/scss/objects.grid.responsive.scss +124 -0
  109. data/vendor/blaze-css/scss/objects.grid.scss +62 -0
  110. data/vendor/blaze-css/scss/objects.images.scss +5 -0
  111. data/vendor/blaze-css/scss/objects.media.scss +36 -0
  112. data/vendor/blaze-css/scss/objects.modals.scss +51 -0
  113. data/vendor/blaze-css/scss/objects.panels.scss +23 -0
  114. data/vendor/blaze-css/scss/themes/blaze.example.scss +7 -0
  115. data/vendor/blaze-css/scss/utilities.alignment.scss +22 -0
  116. data/vendor/blaze-css/scss/utilities.boxing.scss +101 -0
  117. data/vendor/blaze-css/scss/utilities.elevation.scss +19 -0
  118. data/vendor/blaze-css/scss/utilities.sizes.scss +25 -0
  119. metadata +126 -9
  120. data/README.md +0 -42
  121. data/lib/blaze/css/rails/engine.rb +0 -8
@@ -0,0 +1,38 @@
1
+ @import "mixins/settings.global";
2
+
3
+ .c-heading,
4
+ .c-heading__sub {
5
+ margin: $heading-margin;
6
+ padding: $heading-padding;
7
+ font-weight: $heading-font-weight;
8
+ }
9
+
10
+ .c-heading__sub {
11
+ padding: $heading-subheading-padding;
12
+ font-size: $heading-subheading-font-size;
13
+ opacity: $heading-subheading-opacity;
14
+ }
15
+
16
+ h1.c-heading {
17
+ font-size: $text-font-size-super;
18
+ }
19
+
20
+ h2.c-heading {
21
+ font-size: $text-font-size-xlarge;
22
+ }
23
+
24
+ h3.c-heading {
25
+ font-size: $text-font-size-large;
26
+ }
27
+
28
+ h4.c-heading {
29
+ font-size: $text-font-size-medium;
30
+ }
31
+
32
+ h5.c-heading {
33
+ font-size: $text-font-size-small;
34
+ }
35
+
36
+ h6.c-heading {
37
+ font-size: $text-font-size-xsmall;
38
+ }
@@ -0,0 +1,27 @@
1
+ @import "mixins/settings.global";
2
+
3
+ .c-hint {
4
+ position: absolute;
5
+ padding: $hint-padding;
6
+ transform: scale(.8);
7
+ transform-origin: top left;
8
+ color: $hint-color;
9
+ font-size: $hint-font-size;
10
+ opacity: 0;
11
+ pointer-events: none;
12
+ }
13
+
14
+ .c-hint--static,
15
+ .c-field:focus ~ .c-hint,
16
+ .c-label__field:focus ~ .c-hint {
17
+ transform: scale(.9);
18
+ opacity: 1;
19
+ }
20
+
21
+ .c-hint--success {
22
+ color: $hint-success-color;
23
+ }
24
+
25
+ .c-hint--error {
26
+ color: $hint-error-color;
27
+ }
@@ -0,0 +1,159 @@
1
+ @import "mixins/objects.grid";
2
+ @import "mixins/components.inputs";
3
+
4
+ // INPUT GROUP
5
+ .c-input-group {
6
+ @include grid;
7
+
8
+ .c-button {
9
+ border-radius: 0;
10
+
11
+ &:not(:first-child) {
12
+ border-left-width: 0;
13
+ }
14
+
15
+ &:first-child {
16
+ border-top-left-radius: $border-radius;
17
+ border-bottom-left-radius: $border-radius;
18
+ }
19
+
20
+ &:last-child {
21
+ border-top-right-radius: $border-radius;
22
+ border-bottom-right-radius: $border-radius;
23
+ }
24
+ }
25
+
26
+ .o-field {
27
+ @include grid__cell--fit;
28
+
29
+ .c-field {
30
+ border-radius: 0;
31
+ }
32
+
33
+ &:not(:first-child) .c-field {
34
+ border-left-width: 0;
35
+ }
36
+
37
+ &:first-child .c-field {
38
+ border-top-left-radius: $border-radius;
39
+ border-bottom-left-radius: $border-radius;
40
+ }
41
+
42
+ &:last-child .c-field {
43
+ border-top-right-radius: $border-radius;
44
+ border-bottom-right-radius: $border-radius;
45
+ }
46
+ }
47
+ }
48
+
49
+ .c-input-group--rounded {
50
+ .c-button {
51
+ &:first-child {
52
+ border-top-left-radius: $border-radius-rounded;
53
+ border-bottom-left-radius: $border-radius-rounded;
54
+ }
55
+
56
+ &:last-child {
57
+ border-top-right-radius: $border-radius-rounded;
58
+ border-bottom-right-radius: $border-radius-rounded;
59
+ }
60
+ }
61
+
62
+ .o-field {
63
+ &:first-child .c-field {
64
+ border-top-left-radius: $border-radius-rounded;
65
+ border-bottom-left-radius: $border-radius-rounded;
66
+ }
67
+
68
+ &:last-child .c-field {
69
+ border-top-right-radius: $border-radius-rounded;
70
+ border-bottom-right-radius: $border-radius-rounded;
71
+ }
72
+ }
73
+ }
74
+
75
+ .c-input-group--rounded-left {
76
+ .c-button {
77
+ &:first-child {
78
+ border-top-left-radius: $border-radius-rounded;
79
+ border-bottom-left-radius: $border-radius-rounded;
80
+ }
81
+ }
82
+
83
+ .o-field {
84
+ &:first-child .c-field {
85
+ border-top-left-radius: $border-radius-rounded;
86
+ border-bottom-left-radius: $border-radius-rounded;
87
+ }
88
+ }
89
+ }
90
+
91
+ .c-input-group--rounded-right {
92
+ .c-button {
93
+ &:last-child {
94
+ border-top-right-radius: $border-radius-rounded;
95
+ border-bottom-right-radius: $border-radius-rounded;
96
+ }
97
+ }
98
+
99
+ .o-field {
100
+ &:last-child .c-field {
101
+ border-top-right-radius: $border-radius-rounded;
102
+ border-bottom-right-radius: $border-radius-rounded;
103
+ }
104
+ }
105
+ }
106
+
107
+ .c-input-group--stacked {
108
+ @include grid;
109
+ @include grid--wrap;
110
+
111
+ .o-field:not(:first-child) .c-field {
112
+ border-left-width: $field-border-width;
113
+ }
114
+
115
+ .c-button:not(:first-child) {
116
+ border-left-width: $button-border-width;
117
+ }
118
+
119
+ .o-field,
120
+ .c-button {
121
+ @include grid__cell--full;
122
+ }
123
+
124
+ .c-button {
125
+ &:not(:first-child) {
126
+ border-top: 0;
127
+ }
128
+
129
+ &:not(:first-child):not(:last-child) {
130
+ border-radius: 0;
131
+ }
132
+
133
+ &:first-child {
134
+ border-radius: $field-border-radius $field-border-radius 0 0;
135
+ }
136
+
137
+ &:last-child {
138
+ border-radius: 0 0 $field-border-radius $field-border-radius;
139
+ }
140
+ }
141
+
142
+ .o-field {
143
+ &:not(:first-child) .c-field {
144
+ border-top: 0;
145
+ }
146
+
147
+ &:not(:first-child):not(:last-child) .c-field {
148
+ border-radius: 0;
149
+ }
150
+
151
+ &:first-child .c-field {
152
+ border-radius: $field-border-radius $field-border-radius 0 0;
153
+ }
154
+
155
+ &:last-child .c-field {
156
+ border-radius: 0 0 $field-border-radius $field-border-radius;
157
+ }
158
+ }
159
+ }
@@ -0,0 +1,138 @@
1
+ @import "mixins/components.inputs";
2
+
3
+ .o-field {
4
+ position: relative;
5
+
6
+ .c-field--success ~ .c-icon {
7
+ color: $field-success-border-color;
8
+ }
9
+
10
+ .c-field--error ~ .c-icon {
11
+ color: $field-error-border-color;
12
+ }
13
+
14
+ .c-field:disabled ~ .c-icon {
15
+ color: $field-disabled-border-color;
16
+ }
17
+
18
+ .c-icon {
19
+ position: absolute;
20
+ top: 50%;
21
+ transform: translateY(-50%);
22
+ color: $field-border-color;
23
+ }
24
+ }
25
+
26
+ .o-field--icon-right {
27
+ .c-field + .c-icon {
28
+ right: $field-padding;
29
+ }
30
+
31
+ .c-field {
32
+ padding-right: $field-padding * 4;
33
+ }
34
+ }
35
+
36
+ .o-field--icon-left {
37
+ .c-icon:first-child {
38
+ left: $field-padding;
39
+ }
40
+
41
+ .c-field {
42
+ padding-left: $field-padding * 4;
43
+ }
44
+ }
45
+
46
+ .c-fieldset,
47
+ .c-fieldset.c-list {
48
+ display: block;
49
+ width: $fieldset-width;
50
+ margin: $fieldset-margin;
51
+ padding: $fieldset-padding;
52
+ border: $fieldset-border;
53
+ }
54
+
55
+ .c-fieldset__legend {
56
+ @include label;
57
+ padding: $legend-padding;
58
+ }
59
+
60
+ // LABELS
61
+ .c-label {
62
+ @include label;
63
+ }
64
+
65
+ // TEXT FIELDS
66
+ .c-field {
67
+ display: block;
68
+ width: 100%;
69
+ margin: $field-margin;
70
+ padding: $field-padding;
71
+ border: $field-border;
72
+ border-radius: $field-border-radius;
73
+ outline: 0;
74
+ background-color: $field-background-color;
75
+ font-family: inherit;
76
+ font-size: $field-font-size;
77
+ font-weight: $field-font-weight;
78
+ resize: vertical;
79
+ appearance: none;
80
+
81
+ &:focus {
82
+ border-color: $field-focus-border-color;
83
+ box-shadow: $field-focus-box-shadow;
84
+ }
85
+ }
86
+
87
+ // SELECTS, CHECKBOXES AND RADIOS
88
+ select.c-field {
89
+ cursor: pointer;
90
+ }
91
+
92
+ // SELECTS
93
+ select.c-field:not([multiple]) {
94
+ padding-right: 1em;
95
+ background: url("data:image/png;base64,R0lGODlhDwAUAIABAAAAAP///yH5BAEAAAEALAAAAAAPABQAAAIXjI+py+0Po5wH2HsXzmw//lHiSJZmUAAAOw==") no-repeat 99% 50%;
96
+ }
97
+
98
+ // CHECKBOXES and RADIOs
99
+ .c-field input {
100
+ margin-right: $checkbox-margin;
101
+ outline: 0;
102
+ font-size: $checkbox-font-size;
103
+ }
104
+
105
+ .c-field--label {
106
+ margin: $label-field-margin;
107
+ }
108
+
109
+ .c-field--error {
110
+ border-color: $field-error-border-color;
111
+ color: $field-error-color;
112
+ }
113
+
114
+ .c-field--success {
115
+ border-color: $field-success-border-color;
116
+ color: $field-success-color;
117
+ }
118
+
119
+ .c-field--choice {
120
+ border: $checkbox-border;
121
+ border-radius: 0;
122
+ background-color: $checkbox-background-color;
123
+ }
124
+
125
+ .c-fieldset--disabled .c-field,
126
+ .c-fieldset:disabled .c-field,
127
+ .c-field--disabled,
128
+ .c-field:disabled {
129
+ @include field--disabled;
130
+
131
+ &.c-field--choice {
132
+ background-color: $checkbox-background-color;
133
+ }
134
+ }
135
+
136
+ .c-field input:disabled {
137
+ @include disabled;
138
+ }
@@ -0,0 +1,31 @@
1
+ @import "mixins/components.links";
2
+
3
+ .c-link {
4
+ @include link--color;
5
+ text-decoration: $link-text-decoration;
6
+ cursor: pointer;
7
+
8
+ &:hover {
9
+ text-decoration: $link-hover-text-decoration;
10
+ }
11
+ }
12
+
13
+ .c-link--brand {
14
+ @include link--color($link-brand-color);
15
+ }
16
+
17
+ .c-link--info {
18
+ @include link--color($link-info-color);
19
+ }
20
+
21
+ .c-link--warning {
22
+ @include link--color($link-warning-color);
23
+ }
24
+
25
+ .c-link--success {
26
+ @include link--color($link-success-color);
27
+ }
28
+
29
+ .c-link--error {
30
+ @include link--color($link-error-color);
31
+ }
@@ -0,0 +1,60 @@
1
+ @import "mixins/components.lists";
2
+
3
+ .c-list {
4
+ display: block;
5
+ margin: $list-margin;
6
+ padding: $list-padding;
7
+ list-style-position: outside;
8
+ }
9
+
10
+ .c-list .c-list {
11
+ padding: $list-nested-padding;
12
+ }
13
+
14
+ .c-list__item {
15
+ padding: $list-item-padding;
16
+ }
17
+
18
+ .c-list__item--unstyled {
19
+ list-style: $list-item-unstyled-list-style;
20
+ }
21
+
22
+ .c-list--unstyled {
23
+ @include list--unstyled;
24
+ }
25
+
26
+ .c-list--ordered {
27
+ @include list--unstyled;
28
+ counter-reset: ordered;
29
+
30
+ .c-list__item {
31
+ &:before {
32
+ padding: $list-ordered-item-padding;
33
+ content: counters(ordered, ".") " ";
34
+ counter-increment: ordered;
35
+ }
36
+ }
37
+ }
38
+
39
+ .c-list--inline {
40
+ @include list--inline;
41
+
42
+ .c-list--inline {
43
+ @include list--inline;
44
+ }
45
+
46
+ .c-list__item {
47
+ display: inline-block;
48
+ width: auto;
49
+ padding-right: $list-inline-item-padding-right;
50
+ }
51
+
52
+ &:not(.c-list--unstyled) {
53
+ .c-list__item {
54
+ &:before {
55
+ padding: $list-inline-item-bullet-padding;
56
+ content: $list-inline-item-bullet-content;
57
+ }
58
+ }
59
+ }
60
+ }