@finqu/cool 1.2.29 → 1.3.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 (206) hide show
  1. package/README.md +680 -1
  2. package/dist/css/cool.css +23575 -16644
  3. package/dist/css/cool.css.map +1 -154
  4. package/dist/css/cool.min.css +89 -3
  5. package/dist/css/cool.min.css.map +1 -1
  6. package/dist/js/cool.bundle.js +15402 -3800
  7. package/dist/js/cool.bundle.js.map +1 -1
  8. package/dist/js/cool.bundle.min.js +20 -8
  9. package/dist/js/cool.bundle.min.js.map +1 -1
  10. package/dist/js/cool.esm.js +4269 -3360
  11. package/dist/js/cool.esm.js.map +1 -1
  12. package/dist/js/cool.esm.min.js +9 -8
  13. package/dist/js/cool.esm.min.js.map +1 -1
  14. package/dist/js/cool.js +4271 -3362
  15. package/dist/js/cool.js.map +1 -1
  16. package/dist/js/cool.min.js +9 -8
  17. package/dist/js/cool.min.js.map +1 -1
  18. package/package.json +94 -61
  19. package/.babelrc.js +0 -20
  20. package/.browserslistrc +0 -13
  21. package/build/.eslintrc.json +0 -10
  22. package/build/banner.js +0 -14
  23. package/build/build-plugins.js +0 -92
  24. package/build/rollup.config.js +0 -46
  25. package/dist/css/cool-grid.css +0 -4390
  26. package/dist/css/cool-grid.css.map +0 -30
  27. package/dist/css/cool-grid.min.css +0 -7
  28. package/dist/css/cool-grid.min.css.map +0 -1
  29. package/dist/css/cool-reboot.css +0 -286
  30. package/dist/css/cool-reboot.css.map +0 -62
  31. package/dist/css/cool-reboot.min.css +0 -7
  32. package/dist/css/cool-reboot.min.css.map +0 -1
  33. package/html/index.html +0 -2703
  34. package/js/dist/collapse.js +0 -5535
  35. package/js/dist/collapse.js.map +0 -1
  36. package/js/dist/common.js +0 -21996
  37. package/js/dist/common.js.map +0 -1
  38. package/js/dist/cooldropdown.js +0 -467
  39. package/js/dist/cooldropdown.js.map +0 -1
  40. package/js/dist/coolpopover.js +0 -391
  41. package/js/dist/coolpopover.js.map +0 -1
  42. package/js/dist/coolsectiontabs.js +0 -256
  43. package/js/dist/coolsectiontabs.js.map +0 -1
  44. package/js/dist/coolselect.js +0 -796
  45. package/js/dist/coolselect.js.map +0 -1
  46. package/js/dist/cooltooltip.js +0 -360
  47. package/js/dist/cooltooltip.js.map +0 -1
  48. package/js/dist/coolui.js +0 -73
  49. package/js/dist/coolui.js.map +0 -1
  50. package/js/dist/dropdown.js +0 -27421
  51. package/js/dist/dropdown.js.map +0 -1
  52. package/js/dist/popover.js +0 -9472
  53. package/js/dist/popover.js.map +0 -1
  54. package/js/dist/sectiontabs.js +0 -4483
  55. package/js/dist/sectiontabs.js.map +0 -1
  56. package/js/dist/select.js +0 -37080
  57. package/js/dist/select.js.map +0 -1
  58. package/js/dist/tooltip.js +0 -8786
  59. package/js/dist/tooltip.js.map +0 -1
  60. package/js/index.esm.js +0 -21
  61. package/js/index.umd.js +0 -21
  62. package/js/src/abstract-ui-component.js +0 -81
  63. package/js/src/collapse.js +0 -286
  64. package/js/src/common.js +0 -296
  65. package/js/src/dialog.js +0 -579
  66. package/js/src/dropdown.js +0 -525
  67. package/js/src/popover.js +0 -632
  68. package/js/src/section-tabs.js +0 -215
  69. package/js/src/select.js +0 -1342
  70. package/js/src/toast.js +0 -581
  71. package/js/src/tooltip.js +0 -591
  72. package/js/src/util/animate-css.js +0 -22
  73. package/js/src/util/index.js +0 -122
  74. package/js/src/util/perfect-scrollbar.js +0 -1316
  75. package/less/alert.less +0 -345
  76. package/less/badge.less +0 -38
  77. package/less/bootstrap-noconflict.less +0 -23
  78. package/less/bootstrap.less +0 -23
  79. package/less/button-group.less +0 -153
  80. package/less/buttons.less +0 -287
  81. package/less/dialog-noconflict.less +0 -174
  82. package/less/dialog.less +0 -203
  83. package/less/dropdown.less +0 -209
  84. package/less/forms.less +0 -770
  85. package/less/images.less +0 -242
  86. package/less/input-group.less +0 -163
  87. package/less/list-group.less +0 -73
  88. package/less/mixins/aspect-ratio.less +0 -23
  89. package/less/mixins/border-radius.less +0 -24
  90. package/less/mixins/box-shadow.less +0 -4
  91. package/less/mixins/buttons.less +0 -17
  92. package/less/mixins/caret.less +0 -51
  93. package/less/mixins/clearfix.less +0 -10
  94. package/less/mixins/gradients.less +0 -34
  95. package/less/mixins/nav-divider.less +0 -7
  96. package/less/mixins/object-fit.less +0 -13
  97. package/less/mixins/reset-text.less +0 -16
  98. package/less/mixins.less +0 -11
  99. package/less/package.json +0 -11
  100. package/less/pagination.less +0 -69
  101. package/less/popover.less +0 -143
  102. package/less/project.sublime-workspace +0 -774
  103. package/less/reboot.less +0 -235
  104. package/less/section.less +0 -793
  105. package/less/select.less +0 -150
  106. package/less/tables.less +0 -737
  107. package/less/tabs.less +0 -162
  108. package/less/tooltip.less +0 -87
  109. package/less/type.less +0 -71
  110. package/less/utilities/align.less +0 -27
  111. package/less/utilities/animate.less +0 -3512
  112. package/less/utilities/background.less +0 -70
  113. package/less/utilities/borders.less +0 -16
  114. package/less/utilities/color.less +0 -70
  115. package/less/utilities/cursor.less +0 -8
  116. package/less/utilities/display.less +0 -38
  117. package/less/utilities/embed.less +0 -61
  118. package/less/utilities/flex.less +0 -76
  119. package/less/utilities/jquery-ui.less +0 -116
  120. package/less/utilities/lazyload.less +0 -29
  121. package/less/utilities/overflow.less +0 -11
  122. package/less/utilities/pace.less +0 -25
  123. package/less/utilities/placeholder.less +0 -60
  124. package/less/utilities/position.less +0 -42
  125. package/less/utilities/scrollbar.less +0 -152
  126. package/less/utilities/spacing.less +0 -197
  127. package/less/utilities/text.less +0 -68
  128. package/less/utilities/transform.less +0 -7
  129. package/less/utilities.less +0 -21
  130. package/less/variables.less +0 -343
  131. package/scss/LISENCE +0 -15
  132. package/scss/_alert.scss +0 -102
  133. package/scss/_badge.scss +0 -102
  134. package/scss/_button-group.scss +0 -129
  135. package/scss/_buttons.scss +0 -248
  136. package/scss/_custom-forms.scss +0 -444
  137. package/scss/_dialog.scss +0 -160
  138. package/scss/_dropdown.scss +0 -233
  139. package/scss/_forms.scss +0 -258
  140. package/scss/_frame.scss +0 -627
  141. package/scss/_functions.scss +0 -124
  142. package/scss/_grid.scss +0 -35
  143. package/scss/_images.scss +0 -361
  144. package/scss/_input-group.scss +0 -285
  145. package/scss/_list-group.scss +0 -82
  146. package/scss/_mixins.scss +0 -34
  147. package/scss/_navbar.scss +0 -290
  148. package/scss/_notification.scss +0 -13
  149. package/scss/_pagination.scss +0 -88
  150. package/scss/_popover.scss +0 -167
  151. package/scss/_reboot.scss +0 -284
  152. package/scss/_root.scss +0 -15
  153. package/scss/_section.scss +0 -977
  154. package/scss/_select.scss +0 -187
  155. package/scss/_tables.scss +0 -735
  156. package/scss/_tabs.scss +0 -178
  157. package/scss/_toast.scss +0 -182
  158. package/scss/_tooltip.scss +0 -101
  159. package/scss/_type.scss +0 -129
  160. package/scss/_utilities.scss +0 -23
  161. package/scss/_variables.scss +0 -823
  162. package/scss/cool-grid.scss +0 -29
  163. package/scss/cool-reboot.scss +0 -11
  164. package/scss/cool.scss +0 -37
  165. package/scss/mixins/_alert-variant.scss +0 -20
  166. package/scss/mixins/_aspect-ratio.scss +0 -29
  167. package/scss/mixins/_background-variant.scss +0 -25
  168. package/scss/mixins/_badge-variant.scss +0 -36
  169. package/scss/mixins/_breakpoints.scss +0 -102
  170. package/scss/mixins/_buttons.scss +0 -104
  171. package/scss/mixins/_caret.scss +0 -80
  172. package/scss/mixins/_clearfix.scss +0 -10
  173. package/scss/mixins/_float.scss +0 -14
  174. package/scss/mixins/_forms.scss +0 -67
  175. package/scss/mixins/_gradients.scss +0 -40
  176. package/scss/mixins/_grid-framework.scss +0 -72
  177. package/scss/mixins/_grid.scss +0 -60
  178. package/scss/mixins/_nav-divider.scss +0 -9
  179. package/scss/mixins/_notification-variant.scss +0 -7
  180. package/scss/mixins/_object-fit.scss +0 -16
  181. package/scss/mixins/_reset-text.scss +0 -19
  182. package/scss/mixins/_text-emphasis.scss +0 -21
  183. package/scss/mixins/_text-hide.scss +0 -10
  184. package/scss/mixins/_text-truncate.scss +0 -81
  185. package/scss/mixins/_visibility.scss +0 -7
  186. package/scss/project.sublime-workspace +0 -491
  187. package/scss/utilities/_align.scss +0 -41
  188. package/scss/utilities/_animate.scss +0 -3512
  189. package/scss/utilities/_background.scss +0 -14
  190. package/scss/utilities/_borders.scss +0 -146
  191. package/scss/utilities/_clearfix.scss +0 -6
  192. package/scss/utilities/_collapse.scss +0 -33
  193. package/scss/utilities/_cursor.scss +0 -22
  194. package/scss/utilities/_display.scss +0 -16
  195. package/scss/utilities/_embed.scss +0 -78
  196. package/scss/utilities/_flex.scss +0 -52
  197. package/scss/utilities/_lazyload.scss +0 -31
  198. package/scss/utilities/_overflow.scss +0 -6
  199. package/scss/utilities/_perfect-scrollbar.scss +0 -141
  200. package/scss/utilities/_placeholder.scss +0 -77
  201. package/scss/utilities/_position.scss +0 -30
  202. package/scss/utilities/_sizing.scss +0 -32
  203. package/scss/utilities/_spacing.scss +0 -92
  204. package/scss/utilities/_text.scss +0 -99
  205. package/scss/utilities/_user-select.scss +0 -14
  206. package/scss/utilities/_visibility.scss +0 -10
package/scss/_dialog.scss DELETED
@@ -1,160 +0,0 @@
1
- // Dialog
2
- // ---------------------------------------------------------------------------------------------------------------
3
-
4
- .dialog {
5
- position: fixed;
6
- top: 0;
7
- right: 0;
8
- bottom: 0;
9
- left: 0;
10
- z-index: $zindex-dialog;
11
- overflow: hidden;
12
- outline: 0;
13
- -webkit-overflow-scrolling: touch;
14
-
15
- .dialog-container {
16
- position: relative;
17
- width: auto;
18
- margin: 10px;
19
- pointer-events: none;
20
- @include media-breakpoint-up(sm) {
21
- max-width: 600px;
22
- margin: 25px auto;
23
- }
24
-
25
- .dialog-content {
26
- display: flex;
27
- flex-direction: column;
28
- width: 100%;
29
- pointer-events: auto;
30
- position: relative;
31
- text-align: left;
32
- border: none;
33
- border-radius: $border-radius;
34
- background-color: #ffffff;
35
- background-clip: padding-box;
36
- outline: 0;
37
- overflow: auto;
38
- box-shadow: 0 30px 40px 0 rgba(34, 44, 54, 0.2), 0 2px 16px 0 rgba(34, 44, 54, 0.09);
39
-
40
- .dialog-header {
41
- display: flex;
42
- align-items: flex-start;
43
- justify-content: space-between;
44
- padding: $dialog-padding-y $dialog-padding-x;
45
- border-bottom: $dialog-border-width solid $border-color;
46
-
47
- .dialog-title {
48
- font-size: 20px;
49
- width: 100%;
50
- font-family: $dialog-title-font-family;
51
- font-weight: $dialog-title-font-weight;
52
- @include text-truncate;
53
- }
54
-
55
- button[data-dialog-close] {
56
- font-size: 18px;
57
- background-color: transparent;
58
- border: 0;
59
- opacity: 0.75;
60
- color: $body-color;
61
-
62
- &:hover,
63
- &:focus {
64
- opacity: 1;
65
- outline: 0
66
- }
67
- }
68
- }
69
-
70
- .dialog-body {
71
- position: relative;
72
- flex: 1 1 auto;
73
- padding: $dialog-padding-y $dialog-padding-x;
74
- overflow-y: auto;
75
-
76
- .content-full-width {
77
- margin-left: -$dialog-padding-x;
78
- margin-right: -$dialog-padding-x;
79
- }
80
- }
81
-
82
- .dialog-footer {
83
- display: flex;
84
- align-items: center;
85
- padding: $dialog-padding-y $dialog-padding-x;
86
- border-top: $dialog-border-width solid $border-color;
87
-
88
- .spacer {
89
- flex: 1;
90
- }
91
- }
92
- }
93
- }
94
- }
95
-
96
-
97
- // Sizes
98
- .dialog-sm {
99
- .dialog-container {
100
- @include media-breakpoint-up(sm) {
101
- max-width: 300px;
102
- }
103
- }
104
- }
105
-
106
- .dialog-lg {
107
- .dialog-container {
108
- @include media-breakpoint-up(sm) {
109
- max-width: 800px;
110
- }
111
- }
112
- }
113
-
114
-
115
- // Utilities
116
- .dialog-centered {
117
- .dialog-container {
118
- display: flex;
119
- align-items: center;
120
- @include media-breakpoint-up(sm) {
121
- min-height: calc(100% - 50px);
122
- }
123
- }
124
- }
125
-
126
- .dialog-prevent-scroll {
127
- overflow: hidden;
128
- }
129
-
130
- .dialog-backdrop {
131
- position: fixed;
132
- top: 0;
133
- bottom: 0;
134
- left: 0;
135
- right: 0;
136
- opacity: 0;
137
- background-color: #000000;
138
- z-index: $zindex-dialog;
139
- backface-visibility: hidden;
140
- transition: opacity 0.1s;
141
- }
142
-
143
- .has-dialogs .dialog-backdrop {
144
- opacity: 0.3;
145
- }
146
-
147
- .dialog-overflow-visible {
148
- overflow: visible;
149
-
150
- .dialog-container {
151
-
152
- .dialog-content {
153
- overflow: visible;
154
-
155
- .dialog-body {
156
- overflow-y: visible;
157
- }
158
- }
159
- }
160
- }
@@ -1,233 +0,0 @@
1
- // Dropdown
2
- // ---------------------------------------------------------------------------------------------------------------
3
-
4
- .dropup,
5
- .dropright,
6
- .dropdown,
7
- .dropleft {
8
- position: relative;
9
- display: inline-flex;
10
- align-items: center;
11
-
12
- .dropdown-trigger {
13
- > .icon {
14
- pointer-events: none;
15
- }
16
- }
17
- }
18
-
19
- .dropdown-toggle {
20
- @include caret-down;
21
-
22
- &:after {
23
- margin-top: -2px;
24
- }
25
- }
26
-
27
- .dropdown-menu {
28
- position: absolute;
29
- top: 100%;
30
- left: 0;
31
- z-index: $zindex-dropdown;
32
- display: none;
33
- float: left;
34
- min-width: $dropdown-min-width;
35
- padding: $dropdown-padding-y 0;
36
- margin: $dropdown-spacer 0 0;
37
- font-size: $font-size-base;
38
- text-align: left;
39
- list-style: none;
40
- background-color: $dropdown-bg;
41
- background-clip: padding-box;
42
- border: $dropdown-border-width solid $dropdown-border-color;
43
- color: $dropdown-color;
44
- box-sizing: border-box;
45
- overflow: hidden;
46
- box-shadow: $dropdown-box-shadow;
47
- border-radius: $dropdown-border-radius;
48
- font-family: $font-family-sans-serif;
49
-
50
- // IE11 fix for flexboxes
51
- @media all and (-ms-high-contrast:none) {
52
- max-width: 100%;
53
- }
54
- }
55
-
56
- .dropdown-menu-right {
57
- right: 0;
58
- left: auto;
59
- }
60
-
61
- .dropdown-menu-text-wrap {
62
- .dropdown-item {
63
- white-space: normal;
64
- }
65
- }
66
-
67
- .dropup {
68
- .dropdown-menu {
69
- top: auto;
70
- bottom: 100%;
71
- margin-top: 0;
72
- margin-bottom: $dropdown-spacer;
73
- }
74
-
75
- .dropdown-toggle {
76
- @include caret-up;
77
- }
78
- }
79
-
80
- .dropright {
81
- .dropdown-menu {
82
- top: 0;
83
- right: auto;
84
- left: 100%;
85
- margin-top: 0;
86
- margin-left: $dropdown-spacer;
87
- }
88
-
89
- .dropdown-toggle {
90
- @include caret-right;
91
- }
92
- }
93
-
94
- .dropleft {
95
- .dropdown-menu {
96
- top: 0;
97
- right: 100%;
98
- left: auto;
99
- margin-top: 0;
100
- margin-right: $dropdown-spacer;
101
- }
102
-
103
- .dropdown-toggle {
104
- @include caret-left;
105
- }
106
- }
107
-
108
- .dropdown-menu {
109
- &[x-placement^="top"],
110
- &[x-placement^="right"],
111
- &[x-placement^="bottom"],
112
- &[x-placement^="left"] {
113
- right: auto;
114
- bottom: auto;
115
- }
116
- }
117
-
118
- .dropdown-divider {
119
- @include nav-divider($dropdown-divider-bg);
120
- }
121
-
122
- .dropdown-item {
123
- display: block;
124
- width: 100%;
125
- padding: $dropdown-item-padding-y $dropdown-item-padding-x;
126
- clear: both;
127
- font-weight: $font-weight-normal;
128
- color: $dropdown-link-color;
129
- text-align: inherit;
130
- white-space: nowrap;
131
- background-color: transparent;
132
- border: 0;
133
- box-sizing: border-box;
134
- appearance: none;
135
- font-family: $font-family-sans-serif;
136
-
137
- &:hover,
138
- &:focus {
139
- color: $dropdown-link-hover-color;
140
- text-decoration: none;
141
- cursor: pointer;
142
- @include gradient-bg($dropdown-link-hover-bg);
143
- }
144
-
145
- &.active,
146
- &:active {
147
- color: $dropdown-link-active-color;
148
- text-decoration: none;
149
- @include gradient-bg($dropdown-link-active-bg);
150
- }
151
-
152
- &.disabled,
153
- &:disabled {
154
- color: $dropdown-link-disabled-color;
155
- background: transparent;
156
- cursor: default;
157
- }
158
-
159
- .icon + span {
160
- margin-left: $icon-spacer;
161
- }
162
- }
163
-
164
- button.dropdown-item {
165
- cursor: pointer;
166
- outline: 0;
167
- }
168
-
169
- .dropdown-menu.show {
170
- display: block;
171
- }
172
-
173
- .dropdown-header {
174
- display: block;
175
- padding-top: $dropdown-item-padding-y;
176
- padding-right: $dropdown-item-padding-x;
177
- padding-bottom: $dropdown-item-padding-y + $nav-divider-margin-y;
178
- padding-left: $dropdown-item-padding-x;
179
- margin-top: 0;
180
- margin-bottom: $nav-divider-margin-y;
181
- font-size: $font-size-sm;
182
- color: $dropdown-header-color;
183
- white-space: nowrap;
184
- border-bottom: 1px solid $nav-divider-color;
185
- }
186
-
187
- .dropdown-item-text {
188
- display: block;
189
- padding: $dropdown-item-padding-y $dropdown-item-padding-x;
190
- color: $dropdown-link-color;
191
- }
192
-
193
- .dropdown-scrollable-content {
194
- position: relative;
195
- }
196
-
197
- .dropdown-list {
198
- padding: 0;
199
- margin: 0;
200
- list-style: none;
201
-
202
- li {
203
-
204
- a {
205
- display: block;
206
- width: 100%;
207
- font-weight: $font-weight-normal;
208
- color: $dropdown-link-color;
209
- white-space: nowrap;
210
- box-sizing: border-box;
211
-
212
- &:hover,
213
- &:focus {
214
- color: $dropdown-link-hover-color;
215
- text-decoration: none;
216
- @include gradient-bg($dropdown-link-hover-bg);
217
- }
218
-
219
- &.active,
220
- &:active {
221
- color: $dropdown-link-active-color;
222
- text-decoration: none;
223
- @include gradient-bg($dropdown-link-active-bg);
224
- }
225
-
226
- &.disabled,
227
- &:disabled {
228
- color: $dropdown-link-disabled-color;
229
- background-color: transparent;
230
- }
231
- }
232
- }
233
- }
package/scss/_forms.scss DELETED
@@ -1,258 +0,0 @@
1
- // Forms
2
- // ---------------------------------------------------------------------------------------------------------------
3
-
4
- html.dom-ready .form-control {
5
- transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
6
- }
7
-
8
- .form-control {
9
- display: block;
10
- width: 100%;
11
- height: $input-height;
12
- padding: $input-padding-y $input-padding-x;
13
- font-family: $input-font-family;
14
- font-size: $input-font-size;
15
- font-weight: $input-font-weight;
16
- line-height: $input-line-height;
17
- color: $input-color;
18
- background-color: $input-bg;
19
- background-clip: padding-box;
20
- border: $input-border-width solid $input-border-color;
21
- border-radius: $input-border-radius;
22
- @include form-control-focus;
23
-
24
- // Unstyle the caret on `<select>`s in IE10+.
25
- &::-ms-expand {
26
- background-color: transparent;
27
- border: 0;
28
- }
29
-
30
- // Placeholder
31
- &::placeholder {
32
- color: $input-placeholder-color;
33
- opacity: 1;
34
- }
35
-
36
- // Disabled and read-only inputs
37
- &:disabled,
38
- &[readonly] {
39
- background-color: $input-disabled-bg;
40
- opacity: 1;
41
- color: $input-disabled-color;
42
- }
43
- }
44
-
45
- select.form-control {
46
- // Suppress the nested default white text on blue background highlight on ie and edge
47
- &:focus::-ms-value {
48
- color: $input-color;
49
- background-color: $input-bg;
50
- }
51
- }
52
-
53
-
54
- // Labels
55
- .col-form-label {
56
- padding-top: calc(#{$input-padding-y} + #{$input-border-width});
57
- padding-bottom: calc(#{$input-padding-y} + #{$input-border-width});
58
- margin-bottom: 0;
59
- font-size: inherit;
60
- line-height: $input-line-height;
61
- }
62
-
63
- .col-form-label-lg {
64
- padding-top: calc(#{$input-padding-y-lg} + #{$input-border-width});
65
- padding-bottom: calc(#{$input-padding-y-lg} + #{$input-border-width});
66
- font-size: $input-font-size-lg;
67
- line-height: $input-line-height-lg;
68
- }
69
-
70
- .col-form-label-sm {
71
- padding-top: calc(#{$input-padding-y-sm} + #{$input-border-width});
72
- padding-bottom: calc(#{$input-padding-y-sm} + #{$input-border-width});
73
- font-size: $input-font-size-sm;
74
- line-height: $input-line-height-sm;
75
- }
76
-
77
-
78
- // Readonly controls as plain text
79
- .form-control-plaintext {
80
- display: block;
81
- width: 100%;
82
- padding-top: $input-padding-y;
83
- padding-bottom: $input-padding-y;
84
- margin-bottom: 0;
85
- line-height: $input-line-height;
86
- color: $input-plaintext-color;
87
- background-color: transparent;
88
- border: solid transparent;
89
- border-width: $input-border-width 0;
90
-
91
- &.form-control-sm,
92
- &.form-control-lg {
93
- padding-right: 0;
94
- padding-left: 0;
95
- }
96
- }
97
-
98
-
99
- // Form control sizing
100
- .form-control-sm {
101
- height: $input-height-sm;
102
- padding: $input-padding-y-sm $input-padding-x-sm;
103
- font-size: $input-font-size-sm;
104
- line-height: $input-line-height-sm;
105
- border-radius: $input-border-radius-sm;
106
- }
107
-
108
- .form-control-lg {
109
- height: $input-height-lg;
110
- padding: $input-padding-y-lg $input-padding-x-lg;
111
- font-size: $input-font-size-lg;
112
- line-height: $input-line-height-lg;
113
- border-radius: $input-border-radius-lg;
114
- }
115
-
116
- select.form-control {
117
- &[size],
118
- &[multiple] {
119
- height: auto;
120
- }
121
- }
122
-
123
- textarea.form-control {
124
- height: auto;
125
- }
126
-
127
-
128
- // Form groups
129
- .form-group {
130
- margin-bottom: $form-group-margin-bottom;
131
- }
132
-
133
- .form-text {
134
- display: block;
135
- margin-top: $form-text-margin-top;
136
- }
137
-
138
-
139
- // Form grid
140
- .form-row {
141
- display: flex;
142
- flex-wrap: wrap;
143
- margin-right: -$form-grid-gutter-width / 2;
144
- margin-left: -$form-grid-gutter-width / 2;
145
-
146
- > .col,
147
- > [class*="col-"] {
148
- padding-right: $form-grid-gutter-width / 2;
149
- padding-left: $form-grid-gutter-width / 2;
150
- }
151
- }
152
-
153
-
154
- // Checkboxes and radios
155
- .form-check {
156
- position: relative;
157
- display: block;
158
- padding-left: $form-check-input-gutter;
159
- }
160
-
161
- .form-check-input {
162
- position: absolute;
163
- margin-top: $form-check-input-margin-y;
164
- margin-left: -$form-check-input-gutter;
165
-
166
- &:disabled ~ .form-check-label {
167
- color: theme-color('medium')
168
- }
169
- }
170
-
171
- .form-check-label {
172
- margin-bottom: 0;
173
- }
174
-
175
- .form-check-inline {
176
- display: inline-flex;
177
- align-items: center;
178
- padding-left: 0; // Override base .form-check
179
- margin-right: $form-check-inline-margin-x;
180
-
181
- // Undo .form-check-input defaults and add some `margin-right`.
182
- .form-check-input {
183
- position: static;
184
- margin-top: 0;
185
- margin-right: $form-check-inline-input-margin-x;
186
- margin-left: 0;
187
- }
188
- }
189
-
190
-
191
- // Form validation
192
- @each $state, $data in $form-validation-states {
193
- @include form-validation-state($state, map-get($data, color));
194
- }
195
-
196
-
197
- // Inline forms
198
- .form-inline {
199
- display: flex;
200
- flex-flow: row wrap;
201
- align-items: center;
202
- .form-check {
203
- width: 100%;
204
- }
205
-
206
- // Kick in the inline
207
- @include media-breakpoint-up(sm) {
208
-
209
- label {
210
- display: flex;
211
- align-items: center;
212
- justify-content: center;
213
- margin-bottom: 0;
214
- }
215
-
216
- // Inline-block all the things for "inline"
217
- .form-group {
218
- display: flex;
219
- flex: 0 0 auto;
220
- flex-flow: row wrap;
221
- align-items: center;
222
- margin-bottom: 0;
223
- }
224
-
225
- // Allow folks to *not* use `.form-group`
226
- .form-control {
227
- display: inline-block;
228
- width: auto;
229
- vertical-align: middle;
230
- }
231
-
232
- // Make static controls behave like regular ones
233
- .form-control-plaintext {
234
- display: inline-block;
235
- }
236
-
237
- .input-group {
238
- width: auto;
239
- }
240
-
241
- // Remove default margin on radios/checkboxes that were used for stacking, and then undo the floating of radios and checkboxes to match.
242
- .form-check {
243
- display: flex;
244
- align-items: center;
245
- justify-content: center;
246
- width: auto;
247
- padding-left: 0;
248
- }
249
-
250
- .form-check-input {
251
- position: relative;
252
- flex-shrink: 0;
253
- margin-top: 0;
254
- margin-right: $form-check-input-margin-x;
255
- margin-left: 0;
256
- }
257
- }
258
- }