|
1 | 1 | :root { |
2 | | - --bb-primary-color: #{$bb-primary-color}; |
3 | | - --bb-primary-color-rgb: #{$bb-primary-color-rgb}; |
4 | | - --bb-border-focus-color: #{$bb-border-focus-color}; |
5 | | - --bb-border-hover-color: #{$bb-border-hover-color}; |
6 | | - --bb-height: #{$bb-height}; |
7 | | - --bb-dropdown-max-height: #{$bb-dropdown-max-height}; |
8 | | - --bb-shadow: #{$bb-shadow}; |
9 | | - --bb-hover-shadow: #{$bb-hover-shadow}; |
10 | | - --bb-font-size: #{$bb-font-size}; |
| 2 | + --bb-primary-color: #{$bb-primary-color}; |
| 3 | + --bb-primary-color-rgb: #{$bb-primary-color-rgb}; |
| 4 | + --bb-border-focus-color: #{$bb-border-focus-color}; |
| 5 | + --bb-border-hover-color: #{$bb-border-hover-color}; |
| 6 | + --bb-height: #{$bb-height}; |
| 7 | + --bb-dropdown-max-height: #{$bb-dropdown-max-height}; |
| 8 | + --bb-shadow: #{$bb-shadow}; |
| 9 | + --bb-hover-shadow: #{$bb-hover-shadow}; |
| 10 | + --bb-font-size: #{$bb-font-size}; |
11 | 11 | } |
12 | 12 |
|
13 | 13 | body, |
14 | 14 | .form-control, |
15 | 15 | .dropdown-menu, |
16 | 16 | .form-select, |
17 | 17 | .input-group-text { |
18 | | - font-size: var(--bb-font-size); |
| 18 | + font-size: var(--bb-font-size); |
19 | 19 | } |
20 | 20 |
|
21 | 21 | a, |
22 | 22 | [for] { |
23 | | - cursor: pointer; |
| 23 | + cursor: pointer; |
24 | 24 | } |
25 | 25 |
|
26 | 26 | a, a:hover, a:focus { |
27 | | - text-decoration: none; |
| 27 | + text-decoration: none; |
28 | 28 | } |
29 | 29 |
|
30 | 30 | [disabled], |
31 | 31 | :disabled, |
32 | 32 | .disabled, |
33 | 33 | .disabled > * { |
34 | | - cursor: not-allowed !important; |
| 34 | + cursor: not-allowed !important; |
35 | 35 | } |
36 | 36 |
|
37 | 37 | .disabled .range-separator, |
38 | 38 | :disabled { |
39 | | - background-color: var(--bs-secondary-bg); |
40 | | - opacity: 1; |
| 39 | + background-color: var(--bs-secondary-bg); |
| 40 | + opacity: 1; |
41 | 41 | } |
42 | 42 |
|
43 | 43 | :focus-visible, |
44 | 44 | :focus { |
45 | | - outline: none; |
| 45 | + outline: none; |
46 | 46 | } |
47 | 47 |
|
48 | 48 | @mixin direction($var, $child) { |
49 | | - > .datetime-picker:not(:#{$child}-child) .form-control, |
50 | | - > .select:not(:#{$child}-child) .form-control, |
51 | | - > .switch:not(:#{$child}-child), |
52 | | - > .multi-select:not(:#{$child}-child) .dropdown-toggle, |
53 | | - > [data-bs-toggle]:not(:#{$child}-child) > .form-control, |
54 | | - > .auto-complete:not(:#{$child}-child) .form-control { |
55 | | - border-top-#{$var}-radius: 0; |
56 | | - border-bottom-#{$var}-radius: 0; |
57 | | - } |
| 49 | + > .datetime-picker:not(:#{$child}-child) .form-control, |
| 50 | + > .select:not(:#{$child}-child) .form-control, |
| 51 | + > .switch:not(:#{$child}-child), |
| 52 | + > .multi-select:not(:#{$child}-child) .dropdown-toggle, |
| 53 | + > [data-bs-toggle]:not(:#{$child}-child) > .form-control, |
| 54 | + > .auto-complete:not(:#{$child}-child) .form-control { |
| 55 | + border-top-#{$var}-radius: 0; |
| 56 | + border-bottom-#{$var}-radius: 0; |
| 57 | + } |
58 | 58 | } |
59 | 59 |
|
60 | 60 | .input-group { |
61 | | - @include direction(right, last); |
62 | | - @include direction(left, first) |
| 61 | + @include direction(right, last); |
| 62 | + @include direction(left, first) |
63 | 63 | } |
64 | 64 |
|
65 | 65 | .btn-group { |
66 | | - @include direction(right, last); |
67 | | - @include direction(left, first) |
| 66 | + @include direction(right, last); |
| 67 | + @include direction(left, first) |
68 | 68 | } |
69 | 69 |
|
70 | 70 | .popover.popover-table-column-toolbox { |
71 | | - --bs-popover-min-width: 120px; |
72 | | - --bs-popover-header-font-size: 12px; |
73 | | - --bs-popover-header-padding-x: 0.5rem; |
74 | | - --bs-popover-header-padding-y: 0.5rem; |
75 | | - --bs-popover-body-padding-x: 0.5rem; |
76 | | - --bs-popover-body-padding-y: 0.5rem; |
| 71 | + --bs-popover-min-width: 120px; |
| 72 | + --bs-popover-header-font-size: 12px; |
| 73 | + --bs-popover-header-padding-x: 0.5rem; |
| 74 | + --bs-popover-header-padding-y: 0.5rem; |
| 75 | + --bs-popover-body-padding-x: 0.5rem; |
| 76 | + --bs-popover-body-padding-y: 0.5rem; |
77 | 77 | } |
78 | 78 |
|
79 | 79 | ::view-transition-old(*) { |
80 | | - mix-blend-mode: normal; |
81 | | - animation: none; |
82 | | - z-index: 1; |
| 80 | + mix-blend-mode: normal; |
| 81 | + animation: none; |
| 82 | + z-index: 1; |
83 | 83 | } |
84 | 84 |
|
85 | 85 | ::view-transition-new(*) { |
86 | | - mix-blend-mode: normal; |
87 | | - animation: clip .3s ease-in-out; |
88 | | - z-index: 9999; |
| 86 | + mix-blend-mode: normal; |
| 87 | + animation: clip .3s ease-in-out; |
| 88 | + z-index: 9999; |
89 | 89 | } |
90 | 90 |
|
91 | 91 | @keyframes clip { |
92 | | - from { |
93 | | - clip-path: circle(0% at var(--bb-theme-x) var(--bb-theme-y)); |
94 | | - } |
| 92 | + from { |
| 93 | + clip-path: circle(0% at var(--bb-theme-x) var(--bb-theme-y)); |
| 94 | + } |
95 | 95 |
|
96 | | - to { |
97 | | - clip-path: circle(100% at var(--bb-theme-x) var(--bb-theme-y)); |
98 | | - } |
| 96 | + to { |
| 97 | + clip-path: circle(100% at var(--bb-theme-x) var(--bb-theme-y)); |
| 98 | + } |
99 | 99 | } |
100 | 100 |
|
101 | 101 | [data-bs-theme='dark'] { |
102 | | - &::view-transition-old(*) { |
103 | | - animation: clip2 .3s ease-in-out; |
104 | | - z-index: 9999; |
105 | | - } |
| 102 | + &::view-transition-old(*) { |
| 103 | + animation: clip2 .3s ease-in-out; |
| 104 | + z-index: 9999; |
| 105 | + } |
106 | 106 |
|
107 | | - &::view-transition-new(*) { |
108 | | - animation: none; |
109 | | - z-index: 1; |
110 | | - } |
| 107 | + &::view-transition-new(*) { |
| 108 | + animation: none; |
| 109 | + z-index: 1; |
| 110 | + } |
111 | 111 | } |
112 | 112 |
|
113 | 113 | @keyframes clip2 { |
114 | | - from { |
115 | | - clip-path: circle(100% at var(--bb-theme-x) var(--bb-theme-y)); |
116 | | - } |
| 114 | + from { |
| 115 | + clip-path: circle(100% at var(--bb-theme-x) var(--bb-theme-y)); |
| 116 | + } |
117 | 117 |
|
118 | | - to { |
119 | | - clip-path: circle(0% at var(--bb-theme-x) var(--bb-theme-y)); |
120 | | - } |
| 118 | + to { |
| 119 | + clip-path: circle(0% at var(--bb-theme-x) var(--bb-theme-y)); |
| 120 | + } |
121 | 121 | } |
122 | 122 |
|
123 | 123 | [data-bs-theme='memorial'] { |
124 | | - &:root { |
125 | | - --bs-body-bg: #000; |
126 | | - --bs-body-color: #b5b5c3; |
127 | | - filter: grayscale(100%); |
128 | | - } |
| 124 | + &:root { |
| 125 | + --bs-body-bg: #000; |
| 126 | + --bs-body-color: #b5b5c3; |
| 127 | + filter: grayscale(100%); |
| 128 | + } |
129 | 129 | } |
130 | 130 |
|
131 | 131 | body:before { |
132 | | - content: "extraExtraSmall"; |
133 | | - display: none; |
| 132 | + content: "extraExtraSmall"; |
| 133 | + display: none; |
134 | 134 | } |
135 | 135 |
|
136 | 136 | @media (min-width: 375px) { |
137 | | - body:before { |
138 | | - content: "extraSmall"; |
139 | | - } |
| 137 | + body:before { |
| 138 | + content: "extraSmall"; |
| 139 | + } |
140 | 140 | } |
141 | 141 |
|
142 | 142 | @media (min-width: 576px) { |
143 | | - body:before { |
144 | | - content: "small"; |
145 | | - } |
| 143 | + body:before { |
| 144 | + content: "small"; |
| 145 | + } |
146 | 146 | } |
147 | 147 |
|
148 | 148 | @media (min-width: 768px) { |
149 | | - body:before { |
150 | | - content: "medium"; |
151 | | - } |
| 149 | + body:before { |
| 150 | + content: "medium"; |
| 151 | + } |
152 | 152 | } |
153 | 153 |
|
154 | 154 | @media (min-width: 992px) { |
155 | | - body:before { |
156 | | - content: "large"; |
157 | | - } |
| 155 | + body:before { |
| 156 | + content: "large"; |
| 157 | + } |
158 | 158 | } |
159 | 159 |
|
160 | 160 | @media (min-width: 1200px) { |
161 | | - body:before { |
162 | | - content: "extraLarge"; |
163 | | - } |
| 161 | + body:before { |
| 162 | + content: "extraLarge"; |
| 163 | + } |
164 | 164 | } |
165 | 165 |
|
166 | 166 | @media (min-width: 1400px) { |
167 | | - body:before { |
168 | | - content: "extraExtraLarge"; |
169 | | - } |
| 167 | + body:before { |
| 168 | + content: "extraExtraLarge"; |
| 169 | + } |
170 | 170 | } |
0 commit comments