activeadmin_blaze_theme 0.7.0 → 0.7.4

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 (114) hide show
  1. checksums.yaml +4 -4
  2. data/Gemfile +13 -0
  3. data/README.md +30 -8
  4. data/activeadmin_blaze_theme.gemspec +1 -13
  5. data/app/assets/stylesheets/activeadmin_blaze_theme/_contents.scss +1 -0
  6. data/app/assets/stylesheets/activeadmin_blaze_theme/_tables.scss +1 -1
  7. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/blaze.colors.scss +30 -0
  8. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/blaze.scss +43 -49
  9. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.addresses.scss +12 -0
  10. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.alerts.scss +59 -0
  11. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.avatars.scss +36 -0
  12. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.badges.scss +60 -0
  13. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.breadcrumbs.scss +20 -0
  14. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.bubbles.scss +49 -0
  15. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.buttons.scss +77 -0
  16. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.calendars.scss +69 -0
  17. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.cards.scss +213 -0
  18. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.headings.scss +14 -0
  19. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.hints.scss +27 -0
  20. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.input-groups.scss +163 -0
  21. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.inputs.scss +135 -0
  22. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.links.scss +31 -0
  23. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.lists.scss +60 -0
  24. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.navs.scss +126 -0
  25. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.overlays.scss +33 -0
  26. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.pagination.scss +42 -0
  27. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.progress.scss +51 -0
  28. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.ranges.scss +114 -0
  29. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.tables.scss +88 -0
  30. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.tabs.scss +72 -0
  31. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.tags.scss +42 -0
  32. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.toggles.scss +74 -0
  33. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{_components.tooltips.scss → components.tooltips.scss} +30 -28
  34. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.trees.scss +47 -0
  35. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.typography.scss +95 -0
  36. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/generics.global.scss +13 -0
  37. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.alerts.scss +6 -0
  38. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.badges.scss +8 -0
  39. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.buttons.scss +43 -82
  40. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.inputs.scss +40 -2
  41. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.links.scss +22 -0
  42. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.lists.scss +10 -0
  43. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.navs.scss +29 -0
  44. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.ranges.scss +89 -0
  45. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.tabs.scss +5 -0
  46. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.toggles.scss +6 -0
  47. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.typography.scss +25 -0
  48. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_objects.containers.scss +10 -0
  49. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_objects.grid.scss +10 -38
  50. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_settings.global.scss +864 -0
  51. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_tools.mediaqueries.scss +34 -13
  52. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_utilities.boxing.scss +125 -0
  53. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_utilities.visibility.scss +46 -6
  54. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.containers.scss +29 -0
  55. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.drawers.scss +88 -0
  56. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.forms.scss +25 -0
  57. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{_objects.grid.responsive.scss → objects.grid.responsive.scss} +14 -14
  58. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{_objects.grid.scss → objects.grid.scss} +2 -2
  59. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{_objects.images.scss → objects.images.scss} +1 -1
  60. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{_objects.media.scss → objects.media.scss} +3 -3
  61. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.modals.scss +58 -0
  62. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{_objects.panels.scss → objects.panels.scss} +11 -1
  63. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/themes/blaze.example.scss +7 -0
  64. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{_utilities.alignment.scss → utilities.alignment.scss} +1 -1
  65. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/utilities.boxing.scss +101 -0
  66. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/utilities.elevation.scss +19 -0
  67. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/utilities.sizes.scss +25 -0
  68. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/utilities.visibility.scss +45 -0
  69. data/lib/activeadmin_blaze_theme.rb +3 -3
  70. data/lib/activeadmin_blaze_theme/version.rb +1 -1
  71. data/package.json +1 -1
  72. metadata +59 -206
  73. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.addresses.scss +0 -11
  74. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.alerts.scss +0 -78
  75. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.avatars.scss +0 -38
  76. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.back-to-top.scss +0 -17
  77. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.badges.scss +0 -71
  78. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.breadcrumbs.scss +0 -24
  79. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.buttons.scss +0 -91
  80. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.calendars.scss +0 -80
  81. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.cards.scss +0 -195
  82. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.divider.scss +0 -39
  83. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.file-upload.scss +0 -24
  84. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.github-buttons.scss +0 -131
  85. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.headings.scss +0 -12
  86. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.hints.scss +0 -21
  87. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.input-groups.scss +0 -164
  88. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.inputs.scss +0 -128
  89. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.links.scss +0 -72
  90. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.lists.scss +0 -64
  91. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.navs.scss +0 -83
  92. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.overlays.scss +0 -23
  93. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.pagination.scss +0 -31
  94. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.progress.scss +0 -83
  95. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.ranges.scss +0 -176
  96. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.tables.scss +0 -86
  97. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.tabs.scss +0 -68
  98. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.tags.scss +0 -39
  99. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.timelines.scss +0 -113
  100. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.toggles.scss +0 -89
  101. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.trees.scss +0 -48
  102. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_generics.global.scss +0 -17
  103. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_objects.containers.scss +0 -37
  104. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_objects.drawers.scss +0 -91
  105. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_objects.forms.scss +0 -25
  106. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_objects.modals.scss +0 -70
  107. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.boxing.scss +0 -111
  108. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.elevation.scss +0 -17
  109. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.radius.scss +0 -11
  110. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.sizes.scss +0 -23
  111. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.typography.scss +0 -160
  112. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.visibility.scss +0 -54
  113. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_variables.scss +0 -93
  114. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_utilities.states.scss +0 -7
@@ -1,16 +1,37 @@
1
- $screen-limits: (
2
- xsmall: 20em,
3
- small: 30em,
4
- medium: 48em,
5
- large: 64em,
6
- xlarge: 78em,
7
- super: 116em,
8
- );
9
-
10
- $screen-adjustment: 0.01 !default;
11
-
12
- @mixin screen-and-up($size) {
13
- @media (min-width: #{map-get($screen-limits, $size)}) {
1
+ @import "settings.global";
2
+
3
+ @mixin screen--xsmall-and-up {
4
+ @media (min-width: #{map-get($screen-limits, xsmall)}) {
5
+ @content;
6
+ }
7
+ }
8
+
9
+ @mixin screen--small-and-up {
10
+ @media (min-width: #{map-get($screen-limits, small)}) {
11
+ @content;
12
+ }
13
+ }
14
+
15
+ @mixin screen--medium-and-up {
16
+ @media (min-width: #{map-get($screen-limits, medium)}) {
17
+ @content;
18
+ }
19
+ }
20
+
21
+ @mixin screen--large-and-up {
22
+ @media (min-width: #{map-get($screen-limits, large)}) {
23
+ @content;
24
+ }
25
+ }
26
+
27
+ @mixin screen--xlarge-and-up {
28
+ @media (min-width: #{map-get($screen-limits, xlarge)}) {
29
+ @content;
30
+ }
31
+ }
32
+
33
+ @mixin screen--super-and-up {
34
+ @media (min-width: #{map-get($screen-limits, super)}) {
14
35
  @content;
15
36
  }
16
37
  }
@@ -0,0 +1,125 @@
1
+ @import "settings.global";
2
+
3
+ @mixin no-overflow {
4
+ overflow: hidden;
5
+ }
6
+
7
+ @mixin letter-box--super {
8
+ padding-top: $spacing-super;
9
+ padding-bottom: $spacing-super;
10
+ }
11
+
12
+ @mixin letter-box--xlarge {
13
+ padding-top: $spacing-xlarge;
14
+ padding-bottom: $spacing-xlarge;
15
+ }
16
+
17
+ @mixin letter-box--large {
18
+ padding-top: $spacing-large;
19
+ padding-bottom: $spacing-large;
20
+ }
21
+
22
+ @mixin letter-box--medium {
23
+ padding-top: $spacing-medium;
24
+ padding-bottom: $spacing-medium;
25
+ }
26
+
27
+ @mixin letter-box--small {
28
+ padding-top: $spacing-small;
29
+ padding-bottom: $spacing-small;
30
+ }
31
+
32
+ @mixin letter-box--xsmall {
33
+ padding-top: $spacing-xsmall;
34
+ padding-bottom: $spacing-xsmall;
35
+ }
36
+
37
+ @mixin letter-box--tiny {
38
+ padding-top: $spacing-tiny;
39
+ padding-bottom: $spacing-tiny;
40
+ }
41
+
42
+ @mixin letter-box--none {
43
+ padding-top: 0;
44
+ padding-bottom: 0;
45
+ }
46
+
47
+ @mixin pillar-box--super {
48
+ padding-right: $spacing-super;
49
+ padding-left: $spacing-super;
50
+ }
51
+
52
+ @mixin pillar-box--xlarge {
53
+ padding-right: $spacing-xlarge;
54
+ padding-left: $spacing-xlarge;
55
+ }
56
+
57
+ @mixin pillar-box--large {
58
+ padding-right: $spacing-large;
59
+ padding-left: $spacing-large;
60
+ }
61
+
62
+ @mixin pillar-box--medium {
63
+ padding-right: $spacing-medium;
64
+ padding-left: $spacing-medium;
65
+ }
66
+
67
+ @mixin pillar-box--small {
68
+ padding-right: $spacing-small;
69
+ padding-left: $spacing-small;
70
+ }
71
+
72
+ @mixin pillar-box--xsmall {
73
+ padding-right: $spacing-xsmall;
74
+ padding-left: $spacing-xsmall;
75
+ }
76
+
77
+ @mixin pillar-box--tiny {
78
+ padding-right: $spacing-tiny;
79
+ padding-left: $spacing-tiny;
80
+ }
81
+
82
+ @mixin pillar-box--none {
83
+ padding-right: 0;
84
+ padding-left: 0;
85
+ }
86
+
87
+ @mixin window-box--super {
88
+ @include letter-box--super;
89
+ @include pillar-box--super;
90
+ }
91
+
92
+ @mixin window-box--xlarge {
93
+ @include letter-box--xlarge;
94
+ @include pillar-box--xlarge;
95
+ }
96
+
97
+ @mixin window-box--large {
98
+ @include letter-box--large;
99
+ @include pillar-box--large;
100
+ }
101
+
102
+ @mixin window-box--medium {
103
+ @include letter-box--medium;
104
+ @include pillar-box--medium;
105
+ }
106
+
107
+ @mixin window-box--small {
108
+ @include letter-box--small;
109
+ @include pillar-box--small;
110
+ }
111
+
112
+ @mixin window-box--xsmall {
113
+ @include letter-box--xsmall;
114
+ @include pillar-box--xsmall;
115
+ }
116
+
117
+ @mixin window-box--tiny {
118
+ @include letter-box--tiny;
119
+ @include pillar-box--tiny;
120
+ }
121
+
122
+ @mixin window-box--none {
123
+ @include letter-box--none;
124
+ @include pillar-box--none;
125
+ }
@@ -1,7 +1,47 @@
1
- @mixin visually-hidden {
2
- position: absolute;
3
- width: 1px;
4
- height: 1px;
5
- overflow: hidden;
6
- clip-path: inset(50%);
1
+ @import "settings.global";
2
+ @import "tools.mediaqueries";
3
+
4
+ @mixin visible {
5
+ visibility: visible;
7
6
  }
7
+
8
+ @mixin invisible {
9
+ visibility: hidden;
10
+ }
11
+
12
+ @mixin display-none {
13
+ display: none;
14
+ }
15
+
16
+ @mixin display-initial {
17
+ display: initial;
18
+ }
19
+
20
+ @mixin display-inline {
21
+ display: inline;
22
+ }
23
+
24
+ @mixin display-inline-block {
25
+ display: inline-block;
26
+ }
27
+
28
+ @mixin display-block {
29
+ display: block;
30
+ }
31
+
32
+ @mixin display-table {
33
+ display: table;
34
+ }
35
+
36
+ @mixin display-table-cell {
37
+ display: table-cell;
38
+ }
39
+
40
+ @mixin display-flex {
41
+ display: flex;
42
+ }
43
+
44
+ @mixin display-inline-flex {
45
+ display: inline-flex;
46
+ }
47
+
@@ -0,0 +1,29 @@
1
+ @import "mixins/objects.containers";
2
+
3
+ .o-container {
4
+ @include screen--xsmall-and-up {
5
+ @include containers__responsive(xsmall);
6
+ }
7
+ @include screen--small-and-up {
8
+ @include containers__responsive(small);
9
+ }
10
+ @include screen--medium-and-up {
11
+ @include containers__responsive(medium);
12
+ }
13
+ @include screen--large-and-up {
14
+ @include containers__responsive(large);
15
+ }
16
+ @include screen--xlarge-and-up {
17
+ @include containers__responsive(xlarge);
18
+ }
19
+ @include screen--super-and-up {
20
+ @include containers__responsive(super);
21
+ }
22
+
23
+ margin: auto;
24
+ @each $size, $width in $screen-limits {
25
+ &--#{$size} {
26
+ max-width: $width;
27
+ }
28
+ }
29
+ }
@@ -0,0 +1,88 @@
1
+ @import "mixins/settings.global";
2
+ @import "mixins/objects.grid";
3
+ @import "mixins/utilities.boxing";
4
+
5
+ .o-drawer {
6
+ position: absolute;
7
+ background-color: $drawer-background-color;
8
+ color: $drawer-color;
9
+ z-index: $drawer-z-index;
10
+ overflow-x: hidden;
11
+ overflow-y: auto;
12
+ -webkit-overflow-scrolling: touch;
13
+
14
+ > .c-card {
15
+ background-color: transparent;
16
+ box-shadow: none;
17
+ }
18
+
19
+ &:not(.o-drawer--visible) {
20
+ &.u-high,
21
+ &.u-higher,
22
+ &.u-highest {
23
+ box-shadow: none;
24
+ }
25
+ }
26
+ }
27
+
28
+ .o-drawer--bottom,
29
+ .o-drawer--top {
30
+ left: 0;
31
+ width: $drawer-width-horizontal;
32
+ height: auto;
33
+ margin-left: (100% - $drawer-width-horizontal) / 2;
34
+ transform: translate(0, 0);
35
+ }
36
+
37
+ .o-drawer--bottom {
38
+ top: 100%;
39
+ border-radius: $drawer-border-radius $drawer-border-radius 0 0;
40
+ }
41
+
42
+ .o-drawer--bottom.o-drawer--visible {
43
+ transform: translateY(-99%);
44
+ }
45
+
46
+ .o-drawer--top {
47
+ bottom: 100%;
48
+ border-radius: 0 0 $drawer-border-radius $drawer-border-radius;
49
+ }
50
+
51
+ .o-drawer--top.o-drawer--visible {
52
+ transform: translateY(99%);
53
+ }
54
+
55
+ .o-drawer--left,
56
+ .o-drawer--right {
57
+ top: 0;
58
+ width: $drawer-width-vertical;
59
+ height: 100%;
60
+
61
+ .c-card__footer--block {
62
+ position: absolute;
63
+ bottom: 0;
64
+ width: 100%;
65
+
66
+ .c-button {
67
+ border-radius: 0;
68
+ }
69
+ }
70
+ }
71
+
72
+ .o-drawer--left {
73
+ left: 0;
74
+ transform: translateX(-100%);
75
+ }
76
+
77
+ .o-drawer--left.o-drawer--visible {
78
+ transform: translateX(-1%);
79
+ }
80
+
81
+ .o-drawer--right {
82
+ left: 100%;
83
+ transform: translate(0, 0);
84
+ }
85
+
86
+ .o-drawer--right.o-drawer--visible {
87
+ transform: translateX(-99%);
88
+ }
@@ -0,0 +1,25 @@
1
+ @import "mixins/objects.grid";
2
+ @import "mixins/components.inputs";
3
+
4
+ .o-fieldset,
5
+ .o-fieldset.c-list {
6
+ display: block;
7
+ width: $fieldset-width;
8
+ margin: $fieldset-margin;
9
+ padding: $fieldset-padding;
10
+ border: $fieldset-border;
11
+ }
12
+
13
+ .o-fieldset__legend {
14
+ @include label;
15
+ padding: $legend-padding;
16
+ }
17
+
18
+ .o-form-element {
19
+ position: relative;
20
+ padding: $form-element-padding;
21
+
22
+ .c-label:first-child {
23
+ padding: $form-element-label-padding;
24
+ }
25
+ }
@@ -1,9 +1,9 @@
1
- @import 'mixins/tools.mediaqueries';
2
- @import 'mixins/objects.grid';
1
+ @import "mixins/tools.mediaqueries";
2
+ @import "mixins/objects.grid";
3
3
 
4
4
  .o-grid {
5
5
  @include screen--xsmall-only {
6
- &.o-grid--xsmall-fit > .o-grid__cell:not([class*='o-grid__cell--width']) {
6
+ &.o-grid--xsmall-fit > .o-grid__cell:not([class*="o-grid__cell--width"]) {
7
7
  @include grid__cell--fit;
8
8
  }
9
9
 
@@ -17,7 +17,7 @@
17
17
  }
18
18
 
19
19
  @include screen--small-only {
20
- &.o-grid--small-fit > .o-grid__cell:not([class*='o-grid__cell--width']) {
20
+ &.o-grid--small-fit > .o-grid__cell:not([class*="o-grid__cell--width"]) {
21
21
  @include grid__cell--fit;
22
22
  }
23
23
 
@@ -31,7 +31,7 @@
31
31
  }
32
32
 
33
33
  @include screen--medium-only {
34
- &.o-grid--medium-fit > .o-grid__cell:not([class*='o-grid__cell--width']) {
34
+ &.o-grid--medium-fit > .o-grid__cell:not([class*="o-grid__cell--width"]) {
35
35
  @include grid__cell--fit;
36
36
  }
37
37
 
@@ -45,7 +45,7 @@
45
45
  }
46
46
 
47
47
  @include screen--large-only {
48
- &.o-grid--large-fit > .o-grid__cell:not([class*='o-grid__cell--width']) {
48
+ &.o-grid--large-fit > .o-grid__cell:not([class*="o-grid__cell--width"]) {
49
49
  @include grid__cell--fit;
50
50
  }
51
51
 
@@ -59,7 +59,7 @@
59
59
  }
60
60
 
61
61
  @include screen--xlarge-only {
62
- &.o-grid--xlarge-fit > .o-grid__cell:not([class*='o-grid__cell--width']) {
62
+ &.o-grid--xlarge-fit > .o-grid__cell:not([class*="o-grid__cell--width"]) {
63
63
  @include grid__cell--fit;
64
64
  }
65
65
 
@@ -73,7 +73,7 @@
73
73
  }
74
74
 
75
75
  @include screen--super-only {
76
- &.o-grid--super-fit > .o-grid__cell:not([class*='o-grid__cell--width']) {
76
+ &.o-grid--super-fit > .o-grid__cell:not([class*="o-grid__cell--width"]) {
77
77
  @include grid__cell--fit;
78
78
  }
79
79
 
@@ -86,37 +86,37 @@
86
86
  }
87
87
  }
88
88
 
89
- @include screen-and-up(xsmall) {
89
+ @include screen--xsmall-and-up {
90
90
  &__cell {
91
91
  @include grid__responsive-cells(xsmall);
92
92
  }
93
93
  }
94
94
 
95
- @include screen-and-up(small) {
95
+ @include screen--small-and-up {
96
96
  &__cell {
97
97
  @include grid__responsive-cells(small);
98
98
  }
99
99
  }
100
100
 
101
- @include screen-and-up(medium) {
101
+ @include screen--medium-and-up {
102
102
  &__cell {
103
103
  @include grid__responsive-cells(medium);
104
104
  }
105
105
  }
106
106
 
107
- @include screen-and-up(large) {
107
+ @include screen--large-and-up {
108
108
  &__cell {
109
109
  @include grid__responsive-cells(large);
110
110
  }
111
111
  }
112
112
 
113
- @include screen-and-up(xlarge) {
113
+ @include screen--xlarge-and-up {
114
114
  &__cell {
115
115
  @include grid__responsive-cells(xlarge);
116
116
  }
117
117
  }
118
118
 
119
- @include screen-and-up(super) {
119
+ @include screen--super-and-up {
120
120
  &__cell {
121
121
  @include grid__responsive-cells(super);
122
122
  }