activeadmin_blaze_theme 0.7.0 → 0.7.4

Sign up to get free protection for your applications and to get access to all the features.
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
  }