administrate-bootstrap-theme 0.2.2 → 1.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 (66) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +64 -32
  3. data/app/assets/javascripts/administrate-bootstrap-theme/{bootstrap/bootstrap.bundle.js → bootstrap.bundle.js} +910 -857
  4. data/app/assets/stylesheets/administrate-bootstrap-theme/_base.scss +2 -14
  5. data/app/assets/stylesheets/administrate-bootstrap-theme/_variables.scss +4 -0
  6. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_card.scss +7 -6
  7. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_carousel.scss +2 -2
  8. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_dropdown.scss +4 -4
  9. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_functions.scss +94 -3
  10. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_grid.scss +11 -0
  11. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_helpers.scss +2 -0
  12. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_images.scss +1 -1
  13. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_mixins.scss +1 -0
  14. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_modal.scss +5 -15
  15. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_navbar.scss +30 -1
  16. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_offcanvas.scss +8 -2
  17. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_placeholders.scss +51 -0
  18. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_popover.scss +10 -10
  19. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_reboot.scss +12 -8
  20. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_root.scss +39 -2
  21. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_tables.scss +1 -1
  22. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_toasts.scss +3 -3
  23. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_tooltip.scss +4 -4
  24. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_transitions.scss +6 -0
  25. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_utilities.scss +44 -8
  26. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/_variables.scss +189 -24
  27. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/bootstrap-grid.scss +1 -1
  28. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/bootstrap-reboot.scss +1 -1
  29. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/bootstrap-utilities.scss +1 -1
  30. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/bootstrap.scss +2 -1
  31. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/forms/_floating-labels.scss +3 -1
  32. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/forms/_form-check.scss +1 -1
  33. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/forms/_form-control.scss +1 -1
  34. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/forms/_form-range.scss +1 -1
  35. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/forms/_form-select.scss +3 -0
  36. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/helpers/_stacks.scss +15 -0
  37. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/helpers/_vr.scss +8 -0
  38. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/mixins/_backdrop.scss +14 -0
  39. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/mixins/_buttons.scss +1 -1
  40. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/mixins/_grid.scss +33 -8
  41. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/mixins/_utilities.scss +27 -6
  42. data/app/assets/stylesheets/administrate-bootstrap-theme/bootstrap/vendor/_rfs.scss +55 -13
  43. data/app/assets/stylesheets/administrate-bootstrap-theme/colors/_autumn.scss +8 -0
  44. data/app/assets/stylesheets/administrate-bootstrap-theme/colors/_default.scss +8 -0
  45. data/app/assets/stylesheets/administrate-bootstrap-theme/colors/_forest.scss +9 -0
  46. data/app/assets/stylesheets/administrate-bootstrap-theme/colors/_industrial.scss +8 -0
  47. data/app/assets/stylesheets/administrate-bootstrap-theme/colors/_water.scss +8 -0
  48. data/app/assets/stylesheets/administrate-bootstrap-theme/components/_content_body.scss +21 -1
  49. data/app/assets/stylesheets/administrate-bootstrap-theme/components/_content_header.scss +1 -1
  50. data/app/assets/stylesheets/administrate-bootstrap-theme/components/_form.scss +2 -0
  51. data/app/assets/stylesheets/administrate-bootstrap-theme/components/_navigation.scss +26 -3
  52. data/app/assets/stylesheets/administrate-bootstrap-theme/components/_pagination.scss +1 -1
  53. data/app/assets/stylesheets/administrate-bootstrap-theme/fonts/_lato.scss +5 -0
  54. data/app/assets/stylesheets/administrate-bootstrap-theme/fonts/_montserrat.scss +5 -0
  55. data/app/assets/stylesheets/administrate-bootstrap-theme/fonts/_open_sans.scss +5 -0
  56. data/app/assets/stylesheets/administrate-bootstrap-theme/fonts/_roboto.scss +5 -0
  57. data/app/assets/stylesheets/administrate-bootstrap-theme/fonts/_source_sans_pro.scss +5 -0
  58. data/app/assets/stylesheets/administrate-bootstrap-theme/theme.scss +10 -61
  59. data/lib/administrate-bootstrap-theme/version.rb +2 -1
  60. data/lib/generators/administrate_bootstrap_theme/install/USAGE +10 -0
  61. data/lib/generators/administrate_bootstrap_theme/install/install_generator.rb +33 -0
  62. data/package.json +2 -3
  63. metadata +38 -10
  64. data/app/assets/javascripts/administrate-bootstrap-theme/flatpickr/flatpickr.js +0 -2673
  65. data/app/assets/javascripts/administrate-bootstrap-theme/theme.js +0 -22
  66. data/app/assets/stylesheets/administrate-bootstrap-theme/flatpickr/flatpickr.scss +0 -791
@@ -0,0 +1,8 @@
1
+ .vr {
2
+ display: inline-block;
3
+ align-self: stretch;
4
+ width: 1px;
5
+ min-height: 1em;
6
+ background-color: currentColor;
7
+ opacity: $hr-opacity;
8
+ }
@@ -0,0 +1,14 @@
1
+ // Shared between modals and offcanvases
2
+ @mixin overlay-backdrop($zindex, $backdrop-bg, $backdrop-opacity) {
3
+ position: fixed;
4
+ top: 0;
5
+ left: 0;
6
+ z-index: $zindex;
7
+ width: 100vw;
8
+ height: 100vh;
9
+ background-color: $backdrop-bg;
10
+
11
+ // Fade for backdrop
12
+ &.fade { opacity: 0; }
13
+ &.show { opacity: $backdrop-opacity; }
14
+ }
@@ -11,7 +11,7 @@
11
11
  $hover-background: if($color == $color-contrast-light, shade-color($background, $btn-hover-bg-shade-amount), tint-color($background, $btn-hover-bg-tint-amount)),
12
12
  $hover-border: if($color == $color-contrast-light, shade-color($border, $btn-hover-border-shade-amount), tint-color($border, $btn-hover-border-tint-amount)),
13
13
  $hover-color: color-contrast($hover-background),
14
- $active-background: if($color == $color-contrast-light, shade-color($background,$btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),
14
+ $active-background: if($color == $color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),
15
15
  $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),
16
16
  $active-color: color-contrast($active-background),
17
17
  $disabled-background: $background,
@@ -1,4 +1,4 @@
1
- /// Grid system
1
+ // Grid system
2
2
  //
3
3
  // Generate semantic grid columns with these mixins.
4
4
 
@@ -8,8 +8,8 @@
8
8
  display: flex;
9
9
  flex-wrap: wrap;
10
10
  margin-top: calc(var(--#{$variable-prefix}gutter-y) * -1); // stylelint-disable-line function-disallowed-list
11
- margin-right: calc(var(--#{$variable-prefix}gutter-x) / -2); // stylelint-disable-line function-disallowed-list
12
- margin-left: calc(var(--#{$variable-prefix}gutter-x) / -2); // stylelint-disable-line function-disallowed-list
11
+ margin-right: calc(var(--#{$variable-prefix}gutter-x) * -.5); // stylelint-disable-line function-disallowed-list
12
+ margin-left: calc(var(--#{$variable-prefix}gutter-x) * -.5); // stylelint-disable-line function-disallowed-list
13
13
  }
14
14
 
15
15
  @mixin make-col-ready($gutter: $grid-gutter-width) {
@@ -21,15 +21,16 @@
21
21
  flex-shrink: 0;
22
22
  width: 100%;
23
23
  max-width: 100%; // Prevent `.col-auto`, `.col` (& responsive variants) from breaking out the grid
24
- padding-right: calc(var(--#{$variable-prefix}gutter-x) / 2); // stylelint-disable-line function-disallowed-list
25
- padding-left: calc(var(--#{$variable-prefix}gutter-x) / 2); // stylelint-disable-line function-disallowed-list
24
+ padding-right: calc(var(--#{$variable-prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list
25
+ padding-left: calc(var(--#{$variable-prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list
26
26
  margin-top: var(--#{$variable-prefix}gutter-y);
27
27
  }
28
28
 
29
29
  @mixin make-col($size: false, $columns: $grid-columns) {
30
30
  @if $size {
31
31
  flex: 0 0 auto;
32
- width: percentage($size / $columns);
32
+ width: percentage(divide($size, $columns));
33
+
33
34
  } @else {
34
35
  flex: 1 1 0;
35
36
  max-width: 100%;
@@ -42,7 +43,7 @@
42
43
  }
43
44
 
44
45
  @mixin make-col-offset($size, $columns: $grid-columns) {
45
- $num: $size / $columns;
46
+ $num: divide($size, $columns);
46
47
  margin-left: if($num == 0, 0, percentage($num));
47
48
  }
48
49
 
@@ -54,7 +55,7 @@
54
55
  @mixin row-cols($count) {
55
56
  > * {
56
57
  flex: 0 0 auto;
57
- width: 100% / $count;
58
+ width: divide(100%, $count);
58
59
  }
59
60
  }
60
61
 
@@ -123,3 +124,27 @@
123
124
  }
124
125
  }
125
126
  }
127
+
128
+ @mixin make-cssgrid($columns: $grid-columns, $breakpoints: $grid-breakpoints) {
129
+ @each $breakpoint in map-keys($breakpoints) {
130
+ $infix: breakpoint-infix($breakpoint, $breakpoints);
131
+
132
+ @include media-breakpoint-up($breakpoint, $breakpoints) {
133
+ @if $columns > 0 {
134
+ @for $i from 1 through $columns {
135
+ .g-col#{$infix}-#{$i} {
136
+ grid-column: auto / span $i;
137
+ }
138
+ }
139
+
140
+ // Start with `1` because `0` is and invalid value.
141
+ // Ends with `$columns - 1` because offsetting by the width of an entire row isn't possible.
142
+ @for $i from 1 through ($columns - 1) {
143
+ .g-start#{$infix}-#{$i} {
144
+ grid-column-start: $i;
145
+ }
146
+ }
147
+ }
148
+ }
149
+ }
150
+ }
@@ -41,25 +41,46 @@
41
41
  }
42
42
  }
43
43
 
44
+ $is-css-var: map-get($utility, css-var);
45
+ $is-local-vars: map-get($utility, local-vars);
44
46
  $is-rtl: map-get($utility, rtl);
45
47
 
46
48
  @if $value != null {
47
49
  @if $is-rtl == false {
48
50
  /* rtl:begin:remove */
49
51
  }
50
- .#{$property-class + $infix + $property-class-modifier} {
51
- @each $property in $properties {
52
- #{$property}: $value if($enable-important-utilities, !important, null);
52
+
53
+ @if $is-css-var {
54
+ .#{$property-class + $infix + $property-class-modifier} {
55
+ --#{$variable-prefix}#{$property-class}: #{$value};
53
56
  }
54
- }
55
57
 
56
- @each $pseudo in $state {
57
- .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
58
+ @each $pseudo in $state {
59
+ .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
60
+ --#{$variable-prefix}#{$property-class}: #{$value};
61
+ }
62
+ }
63
+ } @else {
64
+ .#{$property-class + $infix + $property-class-modifier} {
58
65
  @each $property in $properties {
66
+ @if $is-local-vars {
67
+ @each $local-var, $value in $is-local-vars {
68
+ --#{$variable-prefix}#{$local-var}: #{$value};
69
+ }
70
+ }
59
71
  #{$property}: $value if($enable-important-utilities, !important, null);
60
72
  }
61
73
  }
74
+
75
+ @each $pseudo in $state {
76
+ .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
77
+ @each $property in $properties {
78
+ #{$property}: $value if($enable-important-utilities, !important, null);
79
+ }
80
+ }
81
+ }
62
82
  }
83
+
63
84
  @if $is-rtl == false {
64
85
  /* rtl:end:remove */
65
86
  }
@@ -4,7 +4,7 @@
4
4
  //
5
5
  // Automated responsive values for font sizes, paddings, margins and much more
6
6
  //
7
- // Licensed under MIT (https://github.com/twbs/rfs/blob/master/LICENSE)
7
+ // Licensed under MIT (https://github.com/twbs/rfs/blob/main/LICENSE)
8
8
 
9
9
  // Configuration
10
10
 
@@ -52,12 +52,54 @@ $enable-rfs: true !default;
52
52
  // Cache $rfs-base-value unit
53
53
  $rfs-base-value-unit: unit($rfs-base-value);
54
54
 
55
+ @function divide($dividend, $divisor, $precision: 10) {
56
+ $sign: if($dividend > 0 and $divisor > 0 or $dividend < 0 and $divisor < 0, 1, -1);
57
+ $dividend: abs($dividend);
58
+ $divisor: abs($divisor);
59
+ @if $dividend == 0 {
60
+ @return 0;
61
+ }
62
+ @if $divisor == 0 {
63
+ @error "Cannot divide by 0";
64
+ }
65
+ $remainder: $dividend;
66
+ $result: 0;
67
+ $factor: 10;
68
+ @while ($remainder > 0 and $precision >= 0) {
69
+ $quotient: 0;
70
+ @while ($remainder >= $divisor) {
71
+ $remainder: $remainder - $divisor;
72
+ $quotient: $quotient + 1;
73
+ }
74
+ $result: $result * 10 + $quotient;
75
+ $factor: $factor * .1;
76
+ $remainder: $remainder * 10;
77
+ $precision: $precision - 1;
78
+ @if ($precision < 0 and $remainder >= $divisor * 5) {
79
+ $result: $result + 1;
80
+ }
81
+ }
82
+ $result: $result * $factor * $sign;
83
+ $dividend-unit: unit($dividend);
84
+ $divisor-unit: unit($divisor);
85
+ $unit-map: (
86
+ "px": 1px,
87
+ "rem": 1rem,
88
+ "em": 1em,
89
+ "%": 1%
90
+ );
91
+ @if ($dividend-unit != $divisor-unit and map-has-key($unit-map, $dividend-unit)) {
92
+ $result: $result * map-get($unit-map, $dividend-unit);
93
+ }
94
+ @return $result;
95
+ }
96
+
55
97
  // Remove px-unit from $rfs-base-value for calculations
56
98
  @if $rfs-base-value-unit == px {
57
- $rfs-base-value: $rfs-base-value / ($rfs-base-value * 0 + 1);
99
+ $rfs-base-value: divide($rfs-base-value, $rfs-base-value * 0 + 1);
58
100
  }
59
101
  @else if $rfs-base-value-unit == rem {
60
- $rfs-base-value: $rfs-base-value / ($rfs-base-value * 0 + 1 / $rfs-rem-value);
102
+ $rfs-base-value: divide($rfs-base-value, divide($rfs-base-value * 0 + 1, $rfs-rem-value));
61
103
  }
62
104
 
63
105
  // Cache $rfs-breakpoint unit to prevent multiple calls
@@ -65,14 +107,14 @@ $rfs-breakpoint-unit-cache: unit($rfs-breakpoint);
65
107
 
66
108
  // Remove unit from $rfs-breakpoint for calculations
67
109
  @if $rfs-breakpoint-unit-cache == px {
68
- $rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1);
110
+ $rfs-breakpoint: divide($rfs-breakpoint, $rfs-breakpoint * 0 + 1);
69
111
  }
70
112
  @else if $rfs-breakpoint-unit-cache == rem or $rfs-breakpoint-unit-cache == "em" {
71
- $rfs-breakpoint: $rfs-breakpoint / ($rfs-breakpoint * 0 + 1 / $rfs-rem-value);
113
+ $rfs-breakpoint: divide($rfs-breakpoint, divide($rfs-breakpoint * 0 + 1, $rfs-rem-value));
72
114
  }
73
115
 
74
116
  // Calculate the media query value
75
- $rfs-mq-value: if($rfs-breakpoint-unit == px, #{$rfs-breakpoint}px, #{$rfs-breakpoint / $rfs-rem-value}#{$rfs-breakpoint-unit});
117
+ $rfs-mq-value: if($rfs-breakpoint-unit == px, #{$rfs-breakpoint}px, #{divide($rfs-breakpoint, $rfs-rem-value)}#{$rfs-breakpoint-unit});
76
118
  $rfs-mq-property-width: if($rfs-mode == max-media-query, max-width, min-width);
77
119
  $rfs-mq-property-height: if($rfs-mode == max-media-query, max-height, min-height);
78
120
 
@@ -164,11 +206,11 @@ $rfs-mq-property-height: if($rfs-mode == max-media-query, max-height, min-height
164
206
 
165
207
  @if $unit == px {
166
208
  // Convert to rem if needed
167
- $val: $val + ' ' + if($rfs-unit == rem, #{$value / ($value * 0 + $rfs-rem-value)}rem, $value);
209
+ $val: $val + ' ' + if($rfs-unit == rem, #{divide($value, $value * 0 + $rfs-rem-value)}rem, $value);
168
210
  }
169
211
  @else if $unit == rem {
170
212
  // Convert to px if needed
171
- $val: $val + ' ' + if($rfs-unit == px, #{$value / ($value * 0 + 1) * $rfs-rem-value}px, $value);
213
+ $val: $val + ' ' + if($rfs-unit == px, #{divide($value, $value * 0 + 1) * $rfs-rem-value}px, $value);
172
214
  }
173
215
  @else {
174
216
  // If $value isn't a number (like inherit) or $value has a unit (not px or rem, like 1.5em) or $ is 0, just print the value
@@ -205,21 +247,21 @@ $rfs-mq-property-height: if($rfs-mode == max-media-query, max-height, min-height
205
247
 
206
248
  @else {
207
249
  // Remove unit from $value for calculations
208
- $value: $value / ($value * 0 + if($unit == px, 1, 1 / $rfs-rem-value));
250
+ $value: divide($value, $value * 0 + if($unit == px, 1, divide(1, $rfs-rem-value)));
209
251
 
210
252
  // Only add the media query if the value is greater than the minimum value
211
253
  @if abs($value) <= $rfs-base-value or not $enable-rfs {
212
- $val: $val + ' ' + if($rfs-unit == rem, #{$value / $rfs-rem-value}rem, #{$value}px);
254
+ $val: $val + ' ' + if($rfs-unit == rem, #{divide($value, $rfs-rem-value)}rem, #{$value}px);
213
255
  }
214
256
  @else {
215
257
  // Calculate the minimum value
216
- $value-min: $rfs-base-value + (abs($value) - $rfs-base-value) / $rfs-factor;
258
+ $value-min: $rfs-base-value + divide(abs($value) - $rfs-base-value, $rfs-factor);
217
259
 
218
260
  // Calculate difference between $value and the minimum value
219
261
  $value-diff: abs($value) - $value-min;
220
262
 
221
263
  // Base value formatting
222
- $min-width: if($rfs-unit == rem, #{$value-min / $rfs-rem-value}rem, #{$value-min}px);
264
+ $min-width: if($rfs-unit == rem, #{divide($value-min, $rfs-rem-value)}rem, #{$value-min}px);
223
265
 
224
266
  // Use negative value if needed
225
267
  $min-width: if($value < 0, -$min-width, $min-width);
@@ -228,7 +270,7 @@ $rfs-mq-property-height: if($rfs-mode == max-media-query, max-height, min-height
228
270
  $variable-unit: if($rfs-two-dimensional, vmin, vw);
229
271
 
230
272
  // Calculate the variable width between 0 and $rfs-breakpoint
231
- $variable-width: #{$value-diff * 100 / $rfs-breakpoint}#{$variable-unit};
273
+ $variable-width: #{divide($value-diff * 100, $rfs-breakpoint)}#{$variable-unit};
232
274
 
233
275
  // Return the calculated value
234
276
  $val: $val + ' calc(' + $min-width + if($value < 0, ' - ', ' + ') + $variable-width + ')';
@@ -0,0 +1,8 @@
1
+ $navigation-bg: #722a00;
2
+ $navigation-bg-active: #d51;
3
+ $navigation-fg: #eee;
4
+
5
+ $primary: #b87800;
6
+ $secondary: #614107;
7
+ $main-content-bg: #fcfafa;
8
+ $main-content-fg: #302725;
@@ -0,0 +1,8 @@
1
+ $navigation-bg: #055160;
2
+ $navigation-bg-active: #d51;
3
+ $navigation-fg: #eee;
4
+
5
+ $primary: #0d6ecd;
6
+ $secondary: #075261;
7
+ $main-content-bg: #f4f8fb;
8
+ $main-content-fg: #253029;
@@ -0,0 +1,9 @@
1
+ $navigation-bg: #025514;
2
+ $navigation-bg-active: #37ac02;
3
+ $navigation-fg: #eee;
4
+
5
+ $primary: #007219;
6
+ $secondary: #566356;
7
+ $danger: #ee6c6c;
8
+ $main-content-bg: #fdfdfd;
9
+ $main-content-fg: #1b3b1e;
@@ -0,0 +1,8 @@
1
+ $navigation-bg: #333;
2
+ $navigation-bg-active: #d51;
3
+ $navigation-fg: #eee;
4
+
5
+ $primary: #6f6f6f;
6
+ $secondary: #404040;
7
+ $main-content-bg: #fafafa;
8
+ $main-content-fg: #202020;
@@ -0,0 +1,8 @@
1
+ $navigation-bg: #0059b3;
2
+ $navigation-bg-active: #0099ff;
3
+ $navigation-fg: #eee;
4
+
5
+ $primary: #0d6ecd;
6
+ $secondary: #3b3d61;
7
+ $main-content-bg: #f4f8fb;
8
+ $main-content-fg: #222;
@@ -1,6 +1,10 @@
1
1
  .main-content__body {
2
2
  @extend .container-fluid, .mb-3;
3
3
 
4
+ table {
5
+ @extend .table-striped;
6
+ }
7
+
4
8
  > dl {
5
9
  @extend .row;
6
10
 
@@ -23,6 +27,10 @@
23
27
  @extend .table;
24
28
  }
25
29
 
30
+ .attribute-data > table {
31
+ @extend .table-bordered;
32
+ }
33
+
26
34
  .attribute--nested {
27
35
  > div {
28
36
  display: flex;
@@ -46,6 +54,10 @@
46
54
  transform: rotate(180deg);
47
55
  }
48
56
 
57
+ .form-actions > input {
58
+ @extend .btn-primary;
59
+ }
60
+
49
61
  .js-table-row {
50
62
  > td {
51
63
  padding: 0.25rem 0.25rem;
@@ -57,8 +69,16 @@
57
69
  }
58
70
  }
59
71
 
72
+ .action-show {
73
+ @extend .link-secondary;
74
+ }
75
+
60
76
  .action-edit {
61
- @extend .btn, .btn-sm;
77
+ @extend .btn, .btn-sm, .btn-secondary;
78
+ }
79
+
80
+ [data-method="delete"] {
81
+ @extend .btn-danger;
62
82
  }
63
83
 
64
84
  [data-method="delete"] {
@@ -28,7 +28,7 @@
28
28
  }
29
29
 
30
30
  .button {
31
- @extend .btn, .btn-sm;
31
+ @extend .btn, .btn-sm, .btn-primary;
32
32
  }
33
33
 
34
34
  .search__input {
@@ -18,6 +18,8 @@
18
18
  .field-unit__field {
19
19
  @extend .col-10;
20
20
 
21
+ position: relative;
22
+
21
23
  > input:not([type="checkbox"]) {
22
24
  @extend .form-control;
23
25
  }
@@ -1,13 +1,36 @@
1
1
  nav.navigation {
2
- @extend .nav, .nav-pills, .flex-column, .p-3;
2
+ @extend .nav, .nav-pills, .flex-column, .p-3, .text-white;
3
3
 
4
+ background: $navigation-bg;
4
5
  width: $navigation-width;
5
6
 
6
7
  .button--alt {
7
- @extend .btn, .mb-2;
8
+ @extend .btn, .btn-outline-light, .mb-2;
9
+
10
+ color: $navigation-fg;
11
+ }
12
+
13
+ .button--title {
14
+ @extend .btn, .mb-2, .pb-3, .fs-3, .border-bottom, .fw-bold, .text-start;
15
+
16
+ color: $navigation-fg;
17
+
18
+ &:hover {
19
+ color: $navigation-fg;
20
+ }
21
+ }
22
+
23
+ .copy {
24
+ @extend .pt-2, .border-top, .text-center;
8
25
  }
9
26
 
10
27
  .navigation__link {
11
- @extend .nav-link;
28
+ @extend .btn-outline-light, .nav-link;
29
+
30
+ color: $navigation-fg;
31
+ }
32
+
33
+ .navigation__link--active {
34
+ background: $navigation-bg-active;
12
35
  }
13
36
  }
@@ -1,5 +1,5 @@
1
1
  nav.pagination {
2
- @extend .justify-content-center, .mb-3;
2
+ @extend .border, .justify-content-center, .mb-3;
3
3
 
4
4
  > span {
5
5
  @extend .nav-link;
@@ -0,0 +1,5 @@
1
+ @import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,400&display=swap');
2
+
3
+ * {
4
+ font-family: 'Lato', sans-serif;
5
+ }
@@ -0,0 +1,5 @@
1
+ @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,700;1,400&display=swap');
2
+
3
+ * {
4
+ font-family: 'Montserrat', sans-serif;
5
+ }
@@ -0,0 +1,5 @@
1
+ @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,700;1,400&display=swap');
2
+
3
+ * {
4
+ font-family: 'Open Sans', sans-serif;
5
+ }
@@ -0,0 +1,5 @@
1
+ @import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,700;1,400&display=swap');
2
+
3
+ * {
4
+ font-family: 'Roboto', sans-serif;
5
+ }
@@ -0,0 +1,5 @@
1
+ @import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,400;0,700;1,400&display=swap');
2
+
3
+ * {
4
+ font-family: 'Source Sans Pro', sans-serif;
5
+ }
@@ -1,65 +1,14 @@
1
- @import "base";
2
-
3
- nav.navigation {
4
- @extend .text-white;
5
-
6
- background: $navigation-bg;
7
-
8
- .button--alt {
9
- @extend .btn-outline-light;
10
-
11
- color: $navigation-fg;
12
- }
13
-
14
- .navigation__link {
15
- @extend .btn-outline-light;
16
-
17
- color: $navigation-fg;
18
- }
1
+ // from: node_modules/bootstrap/scss
2
+ @import "bootstrap/bootstrap";
19
3
 
20
- .navigation__link--active {
21
- background: $navigation-bg-active;
22
- }
23
- }
4
+ @import "selectize"; // included in Administrate
24
5
 
25
- nav.pagination {
26
- @extend .border;
27
- }
6
+ @import "variables";
28
7
 
29
- .main-content {
30
- @extend .bg-light;
31
- }
8
+ @import "components/navigation";
9
+ @import "components/content_header";
10
+ @import "components/content_body";
11
+ @import "components/form";
12
+ @import "components/pagination";
32
13
 
33
- .main-content__body {
34
- table {
35
- @extend .table-striped;
36
- }
37
-
38
- .attribute-data > table {
39
- @extend .table-bordered;
40
- }
41
-
42
- .form-actions > input {
43
- @extend .btn-primary;
44
- }
45
-
46
- .js-table-row {
47
- .action-show {
48
- @extend .link-secondary;
49
- }
50
-
51
- .action-edit {
52
- @extend .btn-secondary;
53
- }
54
-
55
- [data-method="delete"] {
56
- @extend .btn-danger;
57
- }
58
- }
59
- }
60
-
61
- .main-content__header {
62
- .button {
63
- @extend .btn-primary;
64
- }
65
- }
14
+ @import "base";
@@ -1,5 +1,6 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module AdministrateBootstrapTheme
4
- VERSION = '0.2.2'
4
+ VERSION = '1.0.0'
5
+ BOOTSTRAP_VERSION = '5.1.0'
5
6
  end
@@ -0,0 +1,10 @@
1
+ Description:
2
+ AdministrateBootstrapTheme installer
3
+
4
+ Example:
5
+ bin/rails generate administrate_bootstrap_theme:install
6
+
7
+ This will:
8
+ - create a new initializer: administrate_bootstrap_theme
9
+ - create a new SCSS stylesheet: administrate-bootstrap-theme.scss
10
+ - append the necessary assets to: config/initializers/assets.rb
@@ -0,0 +1,33 @@
1
+ # frozen_string_literal: true
2
+
3
+ module AdministrateBootstrapTheme
4
+ class InstallGenerator < Rails::Generators::Base
5
+ source_root File.expand_path('templates', __dir__)
6
+
7
+ def append_assets
8
+ append_file 'config/initializers/assets.rb', <<~FILE
9
+ Rails.application.config.assets.precompile += %w[
10
+ administrate-bootstrap-theme.scss
11
+ administrate-bootstrap-theme/theme.css
12
+ administrate-bootstrap-theme/bootstrap.bundle.js
13
+ ]
14
+ FILE
15
+ end
16
+
17
+ def create_stylesheets_assets
18
+ create_file 'app/assets/stylesheets/administrate-bootstrap-theme.scss', <<~FILE
19
+ @import 'administrate-bootstrap-theme/colors/default';
20
+ @import 'administrate-bootstrap-theme/fonts/source_sans_pro';
21
+ @import 'administrate-bootstrap-theme/theme';
22
+ FILE
23
+ end
24
+
25
+ def create_initializer
26
+ initializer 'administrate_bootstrap_theme.rb', <<~FILE
27
+ Administrate::Engine.stylesheets.clear # required to remove Administrate base styles
28
+ Administrate::Engine.add_stylesheet('administrate-bootstrap-theme')
29
+ Administrate::Engine.add_javascript('administrate-bootstrap-theme/bootstrap.bundle.js')
30
+ FILE
31
+ end
32
+ end
33
+ end
data/package.json CHANGED
@@ -1,11 +1,10 @@
1
1
  {
2
2
  "name": "administrate-bootstrap-theme",
3
- "version": "0.2.2",
3
+ "version": "1.0.0",
4
4
  "main": "index.js",
5
5
  "author": "Mattia Roccoberton <mat@blocknot.es>",
6
6
  "license": "MIT",
7
7
  "dependencies": {
8
- "bootstrap": "^5.0.1",
9
- "flatpickr": "^4.6.9"
8
+ "bootstrap": "^5.0.1"
10
9
  }
11
10
  }