cm-admin 1.1.9 → 1.2.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (145) hide show
  1. checksums.yaml +4 -4
  2. data/Gemfile.lock +1 -1
  3. data/app/assets/javascripts/cm_admin/scaffolds.js +6 -0
  4. data/app/assets/javascripts/cm_admin/shared_scaffolds.js +97 -81
  5. data/app/assets/stylesheets/cm_admin/base/form.scss +31 -225
  6. data/app/assets/stylesheets/cm_admin/base/navbar.scss +1 -1
  7. data/app/assets/stylesheets/cm_admin/base/scaffold.scss +8 -5
  8. data/app/assets/stylesheets/cm_admin/base/show.scss +15 -22
  9. data/app/assets/stylesheets/cm_admin/base/table.scss +6 -0
  10. data/app/assets/stylesheets/cm_admin/components/_buttons.scss +1 -1
  11. data/app/assets/stylesheets/cm_admin/components/_modal.scss +7 -30
  12. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_accordion.scss +158 -0
  13. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_alert.scss +68 -0
  14. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_badge.scss +38 -0
  15. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_breadcrumb.scss +40 -0
  16. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_button-group.scss +142 -0
  17. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_buttons.scss +207 -0
  18. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_card.scss +239 -0
  19. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_carousel.scss +244 -0
  20. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_close.scss +63 -0
  21. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_containers.scss +41 -0
  22. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_dropdown.scss +250 -0
  23. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_forms.scss +9 -0
  24. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_functions.scss +302 -0
  25. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_grid.scss +39 -0
  26. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_helpers.scss +12 -0
  27. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_images.scss +42 -0
  28. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_list-group.scss +197 -0
  29. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_maps.scss +174 -0
  30. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_mixins.scss +42 -0
  31. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_modal.scss +237 -0
  32. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_nav.scss +197 -0
  33. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_navbar.scss +289 -0
  34. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_offcanvas.scss +146 -0
  35. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_pagination.scss +109 -0
  36. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_placeholders.scss +51 -0
  37. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_popover.scss +196 -0
  38. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_progress.scss +68 -0
  39. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_reboot.scss +610 -0
  40. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_root.scss +184 -0
  41. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_spinners.scss +85 -0
  42. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_tables.scss +171 -0
  43. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_toasts.scss +73 -0
  44. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_tooltip.scss +119 -0
  45. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_transitions.scss +27 -0
  46. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_type.scss +106 -0
  47. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_utilities.scss +806 -0
  48. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_variables-dark.scss +85 -0
  49. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/_variables.scss +1745 -0
  50. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/bootstrap-grid.scss +62 -0
  51. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/bootstrap-reboot.scss +10 -0
  52. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/bootstrap-utilities.scss +19 -0
  53. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/bootstrap.scss +52 -0
  54. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/forms/_floating-labels.scss +95 -0
  55. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/forms/_form-check.scss +188 -0
  56. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/forms/_form-control.scss +214 -0
  57. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/forms/_form-range.scss +91 -0
  58. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/forms/_form-select.scss +80 -0
  59. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/forms/_form-text.scss +11 -0
  60. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/forms/_input-group.scss +132 -0
  61. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/forms/_labels.scss +36 -0
  62. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/forms/_validation.scss +12 -0
  63. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_clearfix.scss +3 -0
  64. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_color-bg.scss +7 -0
  65. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_colored-links.scss +30 -0
  66. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_focus-ring.scss +5 -0
  67. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_icon-link.scss +25 -0
  68. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_position.scss +36 -0
  69. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_ratio.scss +26 -0
  70. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_stacks.scss +15 -0
  71. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_stretched-link.scss +15 -0
  72. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_text-truncation.scss +7 -0
  73. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_visually-hidden.scss +8 -0
  74. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/helpers/_vr.scss +8 -0
  75. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_alert.scss +18 -0
  76. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_backdrop.scss +14 -0
  77. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_banner.scss +7 -0
  78. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_border-radius.scss +78 -0
  79. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_box-shadow.scss +18 -0
  80. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_breakpoints.scss +127 -0
  81. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_buttons.scss +70 -0
  82. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_caret.scss +69 -0
  83. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_clearfix.scss +9 -0
  84. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_color-mode.scss +21 -0
  85. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_color-scheme.scss +7 -0
  86. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_container.scss +11 -0
  87. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_deprecate.scss +10 -0
  88. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_forms.scss +153 -0
  89. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_gradients.scss +47 -0
  90. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_grid.scss +151 -0
  91. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_image.scss +16 -0
  92. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_list-group.scss +26 -0
  93. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_lists.scss +7 -0
  94. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_pagination.scss +10 -0
  95. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_reset-text.scss +17 -0
  96. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_resize.scss +6 -0
  97. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_table-variants.scss +24 -0
  98. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_text-truncate.scss +8 -0
  99. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_transition.scss +26 -0
  100. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_utilities.scss +97 -0
  101. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/mixins/_visually-hidden.scss +33 -0
  102. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/tests/jasmine.js +16 -0
  103. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/tests/mixins/_color-modes.test.scss +69 -0
  104. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/tests/mixins/_media-query-color-mode-full.test.scss +8 -0
  105. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/tests/mixins/_utilities.test.scss +393 -0
  106. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/tests/sass-true/register.js +14 -0
  107. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/tests/sass-true/runner.js +17 -0
  108. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/tests/utilities/_api.test.scss +75 -0
  109. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/utilities/_api.scss +47 -0
  110. data/app/assets/stylesheets/cm_admin/dependency/bootstrap/scss/vendor/_rfs.scss +348 -0
  111. data/app/controllers/cm_admin/resource_controller.rb +22 -5
  112. data/app/helpers/cm_admin/application_helper.rb +4 -4
  113. data/app/views/cm_admin/main/_actions_dropdown.html.slim +2 -2
  114. data/app/views/cm_admin/main/_custom_action_modal_form.html.slim +6 -0
  115. data/app/views/cm_admin/main/_nested_fields.html.slim +36 -17
  116. data/app/views/cm_admin/main/_nested_table_form.html.slim +17 -8
  117. data/app/views/cm_admin/main/_nested_table_section.html.slim +17 -0
  118. data/app/views/cm_admin/main/_show_section.html.slim +10 -0
  119. data/app/views/cm_admin/main/_tabs.html.slim +1 -1
  120. data/app/views/cm_admin/main/_top_navbar.html.slim +9 -3
  121. data/app/views/cm_admin/main/associated_show.html.slim +5 -4
  122. data/app/views/cm_admin/main/edit.html.slim +18 -18
  123. data/app/views/cm_admin/main/history.html.slim +3 -3
  124. data/app/views/cm_admin/main/import_form.html.slim +1 -1
  125. data/app/views/cm_admin/main/new.html.slim +17 -17
  126. data/app/views/cm_admin/main/show.html.slim +10 -10
  127. data/app/views/layouts/_custom_action_modal.html.slim +11 -0
  128. data/app/views/layouts/_custom_action_modals.html.slim +13 -9
  129. data/app/views/layouts/_destroy_action_modal.html.slim +16 -0
  130. data/app/views/layouts/cm_admin.html.slim +5 -5
  131. data/config/routes.rb +1 -3
  132. data/lib/cm_admin/model.rb +1 -0
  133. data/lib/cm_admin/models/custom_action.rb +6 -0
  134. data/lib/cm_admin/models/dsl_method.rb +9 -4
  135. data/lib/cm_admin/models/field.rb +2 -1
  136. data/lib/cm_admin/models/form_field.rb +2 -1
  137. data/lib/cm_admin/models/row.rb +40 -0
  138. data/lib/cm_admin/models/section.rb +20 -3
  139. data/lib/cm_admin/version.rb +1 -1
  140. data/lib/cm_admin/view_helpers/field_display_helper.rb +3 -3
  141. data/lib/cm_admin/view_helpers/form_field_helper.rb +40 -14
  142. data/lib/cm_admin/view_helpers/form_helper.rb +59 -22
  143. data/lib/cm_admin/view_helpers/page_info_helper.rb +4 -4
  144. data/lib/cm_admin/view_helpers.rb +1 -1
  145. metadata +107 -2
@@ -0,0 +1,78 @@
1
+ // stylelint-disable property-disallowed-list
2
+ // Single side border-radius
3
+
4
+ // Helper function to replace negative values with 0
5
+ @function valid-radius($radius) {
6
+ $return: ();
7
+ @each $value in $radius {
8
+ @if type-of($value) == number {
9
+ $return: append($return, max($value, 0));
10
+ } @else {
11
+ $return: append($return, $value);
12
+ }
13
+ }
14
+ @return $return;
15
+ }
16
+
17
+ // scss-docs-start border-radius-mixins
18
+ @mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {
19
+ @if $enable-rounded {
20
+ border-radius: valid-radius($radius);
21
+ }
22
+ @else if $fallback-border-radius != false {
23
+ border-radius: $fallback-border-radius;
24
+ }
25
+ }
26
+
27
+ @mixin border-top-radius($radius: $border-radius) {
28
+ @if $enable-rounded {
29
+ border-top-left-radius: valid-radius($radius);
30
+ border-top-right-radius: valid-radius($radius);
31
+ }
32
+ }
33
+
34
+ @mixin border-end-radius($radius: $border-radius) {
35
+ @if $enable-rounded {
36
+ border-top-right-radius: valid-radius($radius);
37
+ border-bottom-right-radius: valid-radius($radius);
38
+ }
39
+ }
40
+
41
+ @mixin border-bottom-radius($radius: $border-radius) {
42
+ @if $enable-rounded {
43
+ border-bottom-right-radius: valid-radius($radius);
44
+ border-bottom-left-radius: valid-radius($radius);
45
+ }
46
+ }
47
+
48
+ @mixin border-start-radius($radius: $border-radius) {
49
+ @if $enable-rounded {
50
+ border-top-left-radius: valid-radius($radius);
51
+ border-bottom-left-radius: valid-radius($radius);
52
+ }
53
+ }
54
+
55
+ @mixin border-top-start-radius($radius: $border-radius) {
56
+ @if $enable-rounded {
57
+ border-top-left-radius: valid-radius($radius);
58
+ }
59
+ }
60
+
61
+ @mixin border-top-end-radius($radius: $border-radius) {
62
+ @if $enable-rounded {
63
+ border-top-right-radius: valid-radius($radius);
64
+ }
65
+ }
66
+
67
+ @mixin border-bottom-end-radius($radius: $border-radius) {
68
+ @if $enable-rounded {
69
+ border-bottom-right-radius: valid-radius($radius);
70
+ }
71
+ }
72
+
73
+ @mixin border-bottom-start-radius($radius: $border-radius) {
74
+ @if $enable-rounded {
75
+ border-bottom-left-radius: valid-radius($radius);
76
+ }
77
+ }
78
+ // scss-docs-end border-radius-mixins
@@ -0,0 +1,18 @@
1
+ @mixin box-shadow($shadow...) {
2
+ @if $enable-shadows {
3
+ $result: ();
4
+
5
+ @each $value in $shadow {
6
+ @if $value != null {
7
+ $result: append($result, $value, "comma");
8
+ }
9
+ @if $value == none and length($shadow) > 1 {
10
+ @warn "The keyword 'none' must be used as a single argument.";
11
+ }
12
+ }
13
+
14
+ @if (length($result) > 0) {
15
+ box-shadow: $result;
16
+ }
17
+ }
18
+ }
@@ -0,0 +1,127 @@
1
+ // Breakpoint viewport sizes and media queries.
2
+ //
3
+ // Breakpoints are defined as a map of (name: minimum width), order from small to large:
4
+ //
5
+ // (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px)
6
+ //
7
+ // The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.
8
+
9
+ // Name of the next breakpoint, or null for the last breakpoint.
10
+ //
11
+ // >> breakpoint-next(sm)
12
+ // md
13
+ // >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px))
14
+ // md
15
+ // >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl xxl))
16
+ // md
17
+ @function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {
18
+ $n: index($breakpoint-names, $name);
19
+ @if not $n {
20
+ @error "breakpoint `#{$name}` not found in `#{$breakpoints}`";
21
+ }
22
+ @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
23
+ }
24
+
25
+ // Minimum breakpoint width. Null for the smallest (first) breakpoint.
26
+ //
27
+ // >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px))
28
+ // 576px
29
+ @function breakpoint-min($name, $breakpoints: $grid-breakpoints) {
30
+ $min: map-get($breakpoints, $name);
31
+ @return if($min != 0, $min, null);
32
+ }
33
+
34
+ // Maximum breakpoint width.
35
+ // The maximum value is reduced by 0.02px to work around the limitations of
36
+ // `min-` and `max-` prefixes and viewports with fractional widths.
37
+ // See https://www.w3.org/TR/mediaqueries-4/#mq-min-max
38
+ // Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.
39
+ // See https://bugs.webkit.org/show_bug.cgi?id=178261
40
+ //
41
+ // >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px))
42
+ // 767.98px
43
+ @function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
44
+ $max: map-get($breakpoints, $name);
45
+ @return if($max and $max > 0, $max - .02, null);
46
+ }
47
+
48
+ // Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.
49
+ // Useful for making responsive utilities.
50
+ //
51
+ // >> breakpoint-infix(xs, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px))
52
+ // "" (Returns a blank string)
53
+ // >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px))
54
+ // "-sm"
55
+ @function breakpoint-infix($name, $breakpoints: $grid-breakpoints) {
56
+ @return if(breakpoint-min($name, $breakpoints) == null, "", "-#{$name}");
57
+ }
58
+
59
+ // Media of at least the minimum breakpoint width. No query for the smallest breakpoint.
60
+ // Makes the @content apply to the given breakpoint and wider.
61
+ @mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {
62
+ $min: breakpoint-min($name, $breakpoints);
63
+ @if $min {
64
+ @media (min-width: $min) {
65
+ @content;
66
+ }
67
+ } @else {
68
+ @content;
69
+ }
70
+ }
71
+
72
+ // Media of at most the maximum breakpoint width. No query for the largest breakpoint.
73
+ // Makes the @content apply to the given breakpoint and narrower.
74
+ @mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {
75
+ $max: breakpoint-max($name, $breakpoints);
76
+ @if $max {
77
+ @media (max-width: $max) {
78
+ @content;
79
+ }
80
+ } @else {
81
+ @content;
82
+ }
83
+ }
84
+
85
+ // Media that spans multiple breakpoint widths.
86
+ // Makes the @content apply between the min and max breakpoints
87
+ @mixin media-breakpoint-between($lower, $upper, $breakpoints: $grid-breakpoints) {
88
+ $min: breakpoint-min($lower, $breakpoints);
89
+ $max: breakpoint-max($upper, $breakpoints);
90
+
91
+ @if $min != null and $max != null {
92
+ @media (min-width: $min) and (max-width: $max) {
93
+ @content;
94
+ }
95
+ } @else if $max == null {
96
+ @include media-breakpoint-up($lower, $breakpoints) {
97
+ @content;
98
+ }
99
+ } @else if $min == null {
100
+ @include media-breakpoint-down($upper, $breakpoints) {
101
+ @content;
102
+ }
103
+ }
104
+ }
105
+
106
+ // Media between the breakpoint's minimum and maximum widths.
107
+ // No minimum for the smallest breakpoint, and no maximum for the largest one.
108
+ // Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.
109
+ @mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {
110
+ $min: breakpoint-min($name, $breakpoints);
111
+ $next: breakpoint-next($name, $breakpoints);
112
+ $max: breakpoint-max($next, $breakpoints);
113
+
114
+ @if $min != null and $max != null {
115
+ @media (min-width: $min) and (max-width: $max) {
116
+ @content;
117
+ }
118
+ } @else if $max == null {
119
+ @include media-breakpoint-up($name, $breakpoints) {
120
+ @content;
121
+ }
122
+ } @else if $min == null {
123
+ @include media-breakpoint-down($next, $breakpoints) {
124
+ @content;
125
+ }
126
+ }
127
+ }
@@ -0,0 +1,70 @@
1
+ // Button variants
2
+ //
3
+ // Easily pump out default styles, as well as :hover, :focus, :active,
4
+ // and disabled options for all buttons
5
+
6
+ // scss-docs-start btn-variant-mixin
7
+ @mixin button-variant(
8
+ $background,
9
+ $border,
10
+ $color: color-contrast($background),
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
+ $hover-border: if($color == $color-contrast-light, shade-color($border, $btn-hover-border-shade-amount), tint-color($border, $btn-hover-border-tint-amount)),
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)),
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
+ $active-color: color-contrast($active-background),
17
+ $disabled-background: $background,
18
+ $disabled-border: $border,
19
+ $disabled-color: color-contrast($disabled-background)
20
+ ) {
21
+ --#{$prefix}btn-color: #{$color};
22
+ --#{$prefix}btn-bg: #{$background};
23
+ --#{$prefix}btn-border-color: #{$border};
24
+ --#{$prefix}btn-hover-color: #{$hover-color};
25
+ --#{$prefix}btn-hover-bg: #{$hover-background};
26
+ --#{$prefix}btn-hover-border-color: #{$hover-border};
27
+ --#{$prefix}btn-focus-shadow-rgb: #{to-rgb(mix($color, $border, 15%))};
28
+ --#{$prefix}btn-active-color: #{$active-color};
29
+ --#{$prefix}btn-active-bg: #{$active-background};
30
+ --#{$prefix}btn-active-border-color: #{$active-border};
31
+ --#{$prefix}btn-active-shadow: #{$btn-active-box-shadow};
32
+ --#{$prefix}btn-disabled-color: #{$disabled-color};
33
+ --#{$prefix}btn-disabled-bg: #{$disabled-background};
34
+ --#{$prefix}btn-disabled-border-color: #{$disabled-border};
35
+ }
36
+ // scss-docs-end btn-variant-mixin
37
+
38
+ // scss-docs-start btn-outline-variant-mixin
39
+ @mixin button-outline-variant(
40
+ $color,
41
+ $color-hover: color-contrast($color),
42
+ $active-background: $color,
43
+ $active-border: $color,
44
+ $active-color: color-contrast($active-background)
45
+ ) {
46
+ --#{$prefix}btn-color: #{$color};
47
+ --#{$prefix}btn-border-color: #{$color};
48
+ --#{$prefix}btn-hover-color: #{$color-hover};
49
+ --#{$prefix}btn-hover-bg: #{$active-background};
50
+ --#{$prefix}btn-hover-border-color: #{$active-border};
51
+ --#{$prefix}btn-focus-shadow-rgb: #{to-rgb($color)};
52
+ --#{$prefix}btn-active-color: #{$active-color};
53
+ --#{$prefix}btn-active-bg: #{$active-background};
54
+ --#{$prefix}btn-active-border-color: #{$active-border};
55
+ --#{$prefix}btn-active-shadow: #{$btn-active-box-shadow};
56
+ --#{$prefix}btn-disabled-color: #{$color};
57
+ --#{$prefix}btn-disabled-bg: transparent;
58
+ --#{$prefix}btn-disabled-border-color: #{$color};
59
+ --#{$prefix}gradient: none;
60
+ }
61
+ // scss-docs-end btn-outline-variant-mixin
62
+
63
+ // scss-docs-start btn-size-mixin
64
+ @mixin button-size($padding-y, $padding-x, $font-size, $border-radius) {
65
+ --#{$prefix}btn-padding-y: #{$padding-y};
66
+ --#{$prefix}btn-padding-x: #{$padding-x};
67
+ @include rfs($font-size, --#{$prefix}btn-font-size);
68
+ --#{$prefix}btn-border-radius: #{$border-radius};
69
+ }
70
+ // scss-docs-end btn-size-mixin
@@ -0,0 +1,69 @@
1
+ // scss-docs-start caret-mixins
2
+ @mixin caret-down($width: $caret-width) {
3
+ border-top: $width solid;
4
+ border-right: $width solid transparent;
5
+ border-bottom: 0;
6
+ border-left: $width solid transparent;
7
+ }
8
+
9
+ @mixin caret-up($width: $caret-width) {
10
+ border-top: 0;
11
+ border-right: $width solid transparent;
12
+ border-bottom: $width solid;
13
+ border-left: $width solid transparent;
14
+ }
15
+
16
+ @mixin caret-end($width: $caret-width) {
17
+ border-top: $width solid transparent;
18
+ border-right: 0;
19
+ border-bottom: $width solid transparent;
20
+ border-left: $width solid;
21
+ }
22
+
23
+ @mixin caret-start($width: $caret-width) {
24
+ border-top: $width solid transparent;
25
+ border-right: $width solid;
26
+ border-bottom: $width solid transparent;
27
+ }
28
+
29
+ @mixin caret(
30
+ $direction: down,
31
+ $width: $caret-width,
32
+ $spacing: $caret-spacing,
33
+ $vertical-align: $caret-vertical-align
34
+ ) {
35
+ @if $enable-caret {
36
+ &::after {
37
+ display: inline-block;
38
+ margin-left: $spacing;
39
+ vertical-align: $vertical-align;
40
+ content: "";
41
+ @if $direction == down {
42
+ @include caret-down($width);
43
+ } @else if $direction == up {
44
+ @include caret-up($width);
45
+ } @else if $direction == end {
46
+ @include caret-end($width);
47
+ }
48
+ }
49
+
50
+ @if $direction == start {
51
+ &::after {
52
+ display: none;
53
+ }
54
+
55
+ &::before {
56
+ display: inline-block;
57
+ margin-right: $spacing;
58
+ vertical-align: $vertical-align;
59
+ content: "";
60
+ @include caret-start($width);
61
+ }
62
+ }
63
+
64
+ &:empty::after {
65
+ margin-left: 0;
66
+ }
67
+ }
68
+ }
69
+ // scss-docs-end caret-mixins
@@ -0,0 +1,9 @@
1
+ // scss-docs-start clearfix
2
+ @mixin clearfix() {
3
+ &::after {
4
+ display: block;
5
+ clear: both;
6
+ content: "";
7
+ }
8
+ }
9
+ // scss-docs-end clearfix
@@ -0,0 +1,21 @@
1
+ // scss-docs-start color-mode-mixin
2
+ @mixin color-mode($mode: light, $root: false) {
3
+ @if $color-mode-type == "media-query" {
4
+ @if $root == true {
5
+ @media (prefers-color-scheme: $mode) {
6
+ :root {
7
+ @content;
8
+ }
9
+ }
10
+ } @else {
11
+ @media (prefers-color-scheme: $mode) {
12
+ @content;
13
+ }
14
+ }
15
+ } @else {
16
+ [data-bs-theme="#{$mode}"] {
17
+ @content;
18
+ }
19
+ }
20
+ }
21
+ // scss-docs-end color-mode-mixin
@@ -0,0 +1,7 @@
1
+ // scss-docs-start mixin-color-scheme
2
+ @mixin color-scheme($name) {
3
+ @media (prefers-color-scheme: #{$name}) {
4
+ @content;
5
+ }
6
+ }
7
+ // scss-docs-end mixin-color-scheme
@@ -0,0 +1,11 @@
1
+ // Container mixins
2
+
3
+ @mixin make-container($gutter: $container-padding-x) {
4
+ --#{$prefix}gutter-x: #{$gutter};
5
+ --#{$prefix}gutter-y: 0;
6
+ width: 100%;
7
+ padding-right: calc(var(--#{$prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list
8
+ padding-left: calc(var(--#{$prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list
9
+ margin-right: auto;
10
+ margin-left: auto;
11
+ }
@@ -0,0 +1,10 @@
1
+ // Deprecate mixin
2
+ //
3
+ // This mixin can be used to deprecate mixins or functions.
4
+ // `$enable-deprecation-messages` is a global variable, `$ignore-warning` is a variable that can be passed to
5
+ // some deprecated mixins to suppress the warning (for example if the mixin is still be used in the current version of Bootstrap)
6
+ @mixin deprecate($name, $deprecate-version, $remove-version, $ignore-warning: false) {
7
+ @if ($enable-deprecation-messages != false and $ignore-warning != true) {
8
+ @warn "#{$name} has been deprecated as of #{$deprecate-version}. It will be removed entirely in #{$remove-version}.";
9
+ }
10
+ }
@@ -0,0 +1,153 @@
1
+ // This mixin uses an `if()` technique to be compatible with Dart Sass
2
+ // See https://github.com/sass/sass/issues/1873#issuecomment-152293725 for more details
3
+
4
+ // scss-docs-start form-validation-mixins
5
+ @mixin form-validation-state-selector($state) {
6
+ @if ($state == "valid" or $state == "invalid") {
7
+ .was-validated #{if(&, "&", "")}:#{$state},
8
+ #{if(&, "&", "")}.is-#{$state} {
9
+ @content;
10
+ }
11
+ } @else {
12
+ #{if(&, "&", "")}.is-#{$state} {
13
+ @content;
14
+ }
15
+ }
16
+ }
17
+
18
+ @mixin form-validation-state(
19
+ $state,
20
+ $color,
21
+ $icon,
22
+ $tooltip-color: color-contrast($color),
23
+ $tooltip-bg-color: rgba($color, $form-feedback-tooltip-opacity),
24
+ $focus-box-shadow: 0 0 $input-btn-focus-blur $input-focus-width rgba($color, $input-btn-focus-color-opacity),
25
+ $border-color: $color
26
+ ) {
27
+ .#{$state}-feedback {
28
+ display: none;
29
+ width: 100%;
30
+ margin-top: $form-feedback-margin-top;
31
+ @include font-size($form-feedback-font-size);
32
+ font-style: $form-feedback-font-style;
33
+ color: $color;
34
+ }
35
+
36
+ .#{$state}-tooltip {
37
+ position: absolute;
38
+ top: 100%;
39
+ z-index: 5;
40
+ display: none;
41
+ max-width: 100%; // Contain to parent when possible
42
+ padding: $form-feedback-tooltip-padding-y $form-feedback-tooltip-padding-x;
43
+ margin-top: .1rem;
44
+ @include font-size($form-feedback-tooltip-font-size);
45
+ line-height: $form-feedback-tooltip-line-height;
46
+ color: $tooltip-color;
47
+ background-color: $tooltip-bg-color;
48
+ @include border-radius($form-feedback-tooltip-border-radius);
49
+ }
50
+
51
+ @include form-validation-state-selector($state) {
52
+ ~ .#{$state}-feedback,
53
+ ~ .#{$state}-tooltip {
54
+ display: block;
55
+ }
56
+ }
57
+
58
+ .form-control {
59
+ @include form-validation-state-selector($state) {
60
+ border-color: $border-color;
61
+
62
+ @if $enable-validation-icons {
63
+ padding-right: $input-height-inner;
64
+ background-image: escape-svg($icon);
65
+ background-repeat: no-repeat;
66
+ background-position: right $input-height-inner-quarter center;
67
+ background-size: $input-height-inner-half $input-height-inner-half;
68
+ }
69
+
70
+ &:focus {
71
+ border-color: $border-color;
72
+ box-shadow: $focus-box-shadow;
73
+ }
74
+ }
75
+ }
76
+
77
+ // stylelint-disable-next-line selector-no-qualifying-type
78
+ textarea.form-control {
79
+ @include form-validation-state-selector($state) {
80
+ @if $enable-validation-icons {
81
+ padding-right: $input-height-inner;
82
+ background-position: top $input-height-inner-quarter right $input-height-inner-quarter;
83
+ }
84
+ }
85
+ }
86
+
87
+ .form-select {
88
+ @include form-validation-state-selector($state) {
89
+ border-color: $border-color;
90
+
91
+ @if $enable-validation-icons {
92
+ &:not([multiple]):not([size]),
93
+ &:not([multiple])[size="1"] {
94
+ --#{$prefix}form-select-bg-icon: #{escape-svg($icon)};
95
+ padding-right: $form-select-feedback-icon-padding-end;
96
+ background-position: $form-select-bg-position, $form-select-feedback-icon-position;
97
+ background-size: $form-select-bg-size, $form-select-feedback-icon-size;
98
+ }
99
+ }
100
+
101
+ &:focus {
102
+ border-color: $border-color;
103
+ box-shadow: $focus-box-shadow;
104
+ }
105
+ }
106
+ }
107
+
108
+ .form-control-color {
109
+ @include form-validation-state-selector($state) {
110
+ @if $enable-validation-icons {
111
+ width: add($form-color-width, $input-height-inner);
112
+ }
113
+ }
114
+ }
115
+
116
+ .form-check-input {
117
+ @include form-validation-state-selector($state) {
118
+ border-color: $border-color;
119
+
120
+ &:checked {
121
+ background-color: $color;
122
+ }
123
+
124
+ &:focus {
125
+ box-shadow: $focus-box-shadow;
126
+ }
127
+
128
+ ~ .form-check-label {
129
+ color: $color;
130
+ }
131
+ }
132
+ }
133
+ .form-check-inline .form-check-input {
134
+ ~ .#{$state}-feedback {
135
+ margin-left: .5em;
136
+ }
137
+ }
138
+
139
+ .input-group {
140
+ > .form-control:not(:focus),
141
+ > .form-select:not(:focus),
142
+ > .form-floating:not(:focus-within) {
143
+ @include form-validation-state-selector($state) {
144
+ @if $state == "valid" {
145
+ z-index: 3;
146
+ } @else if $state == "invalid" {
147
+ z-index: 4;
148
+ }
149
+ }
150
+ }
151
+ }
152
+ }
153
+ // scss-docs-end form-validation-mixins
@@ -0,0 +1,47 @@
1
+ // Gradients
2
+
3
+ // scss-docs-start gradient-bg-mixin
4
+ @mixin gradient-bg($color: null) {
5
+ background-color: $color;
6
+
7
+ @if $enable-gradients {
8
+ background-image: var(--#{$prefix}gradient);
9
+ }
10
+ }
11
+ // scss-docs-end gradient-bg-mixin
12
+
13
+ // scss-docs-start gradient-mixins
14
+ // Horizontal gradient, from left to right
15
+ //
16
+ // Creates two color stops, start and end, by specifying a color and position for each color stop.
17
+ @mixin gradient-x($start-color: $gray-700, $end-color: $gray-800, $start-percent: 0%, $end-percent: 100%) {
18
+ background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent);
19
+ }
20
+
21
+ // Vertical gradient, from top to bottom
22
+ //
23
+ // Creates two color stops, start and end, by specifying a color and position for each color stop.
24
+ @mixin gradient-y($start-color: $gray-700, $end-color: $gray-800, $start-percent: null, $end-percent: null) {
25
+ background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent);
26
+ }
27
+
28
+ @mixin gradient-directional($start-color: $gray-700, $end-color: $gray-800, $deg: 45deg) {
29
+ background-image: linear-gradient($deg, $start-color, $end-color);
30
+ }
31
+
32
+ @mixin gradient-x-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) {
33
+ background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color);
34
+ }
35
+
36
+ @mixin gradient-y-three-colors($start-color: $blue, $mid-color: $purple, $color-stop: 50%, $end-color: $red) {
37
+ background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color);
38
+ }
39
+
40
+ @mixin gradient-radial($inner-color: $gray-700, $outer-color: $gray-800) {
41
+ background-image: radial-gradient(circle, $inner-color, $outer-color);
42
+ }
43
+
44
+ @mixin gradient-striped($color: rgba($white, .15), $angle: 45deg) {
45
+ background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);
46
+ }
47
+ // scss-docs-end gradient-mixins