jekyll-rtd-theme 1.1.8 → 2.0.0.pre.beta
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/LICENSE +1 -1
- data/README.md +23 -65
- data/_includes/addons/analytics.liquid +4 -4
- data/_includes/addons/github.liquid +7 -10
- data/_includes/breadcrumbs.liquid +27 -0
- data/_includes/extend/list.liquid +2 -2
- data/_includes/{reset → extend}/tabs.liquid +0 -0
- data/_includes/extend/toctree.liquid +6 -5
- data/_includes/footer.liquid +36 -0
- data/_includes/reset/defaults.liquid +25 -60
- data/_includes/reset/workdir.liquid +1 -0
- data/_includes/safe/shortcodes.liquid +9 -0
- data/_includes/shortcodes/danger.liquid +3 -2
- data/_includes/shortcodes/note.liquid +3 -2
- data/_includes/shortcodes/tip.liquid +3 -2
- data/_includes/shortcodes/warning.liquid +3 -2
- data/_includes/{class/_toctree.liquid → toctree.liquid} +2 -2
- data/_layouts/default.liquid +182 -23
- data/_layouts/plugins/extension.liquid +6 -8
- data/_sass/@primer/base/base.scss +90 -0
- data/_sass/@primer/base/index.scss +6 -0
- data/_sass/@primer/base/kbd.scss +21 -0
- data/_sass/@primer/base/normalize.scss +423 -0
- data/_sass/@primer/base/typography-base.scss +100 -0
- data/_sass/@primer/breadcrumb/breadcrumb.scss +28 -0
- data/_sass/@primer/breadcrumb/index.scss +3 -0
- data/_sass/@primer/buttons/button-group.scss +91 -0
- data/_sass/@primer/buttons/button.scss +296 -0
- data/_sass/@primer/buttons/index.scss +4 -0
- data/_sass/@primer/buttons/misc.scss +205 -0
- data/_sass/@primer/forms/form-control.scss +278 -0
- data/_sass/@primer/forms/form-group.scss +279 -0
- data/_sass/@primer/forms/form-select.scss +38 -0
- data/_sass/@primer/forms/form-validation.scss +369 -0
- data/_sass/@primer/forms/index.scss +7 -0
- data/_sass/@primer/forms/input-group.scss +53 -0
- data/_sass/@primer/forms/radio-group.scss +43 -0
- data/_sass/@primer/markdown/blob-csv.scss +31 -0
- data/_sass/@primer/markdown/code.scss +73 -0
- data/_sass/@primer/markdown/headings.scss +72 -0
- data/_sass/@primer/markdown/images.scss +131 -0
- data/_sass/@primer/markdown/index.scss +8 -0
- data/_sass/@primer/markdown/lists.scss +76 -0
- data/_sass/@primer/markdown/markdown-body.scss +99 -0
- data/_sass/@primer/markdown/tables.scss +38 -0
- data/_sass/@primer/support/index.scss +11 -0
- data/_sass/@primer/support/mixins/buttons.scss +184 -0
- data/_sass/@primer/support/mixins/layout.scss +55 -0
- data/_sass/@primer/support/mixins/misc.scss +32 -0
- data/_sass/@primer/support/mixins/typography.scss +88 -0
- data/_sass/@primer/support/variables/color-system.scss +243 -0
- data/_sass/@primer/support/variables/colors.scss +55 -0
- data/_sass/@primer/support/variables/layout.scss +149 -0
- data/_sass/@primer/support/variables/misc.scss +42 -0
- data/_sass/@primer/support/variables/typography.scss +43 -0
- data/_sass/@primer/utilities/animations.scss +187 -0
- data/_sass/@primer/utilities/borders.scss +184 -0
- data/_sass/@primer/utilities/box-shadow.scss +25 -0
- data/_sass/@primer/utilities/colors.scss +185 -0
- data/_sass/@primer/utilities/details.scss +34 -0
- data/_sass/@primer/utilities/flexbox.scss +121 -0
- data/_sass/@primer/utilities/index.scss +14 -0
- data/_sass/@primer/utilities/layout.scss +134 -0
- data/_sass/@primer/utilities/margin.scss +68 -0
- data/_sass/@primer/utilities/padding.scss +59 -0
- data/_sass/@primer/utilities/typography.scss +325 -0
- data/_sass/@primer/utilities/visibility-display.scss +82 -0
- data/_sass/_font-face.scss +65 -0
- data/_sass/_icons.scss +53 -0
- data/_sass/_layout.scss +76 -0
- data/_sass/_reset.scss +21 -0
- data/_sass/_root.scss +9 -0
- data/_sass/_variables.scss +29 -0
- data/_sass/class/addons-wrap.scss +39 -0
- data/_sass/class/container.scss +11 -0
- data/_sass/class/content-wrap.scss +4 -0
- data/_sass/class/header.scss +10 -0
- data/_sass/{highlight.scss → class/highlight.scss} +0 -0
- data/_sass/class/markdown-body.scss +49 -0
- data/_sass/class/sidebar-wrap.scss +72 -0
- data/_sass/class/title.scss +13 -0
- data/_sass/theme.scss +26 -12
- data/assets/404.liquid +1 -3
- data/assets/css/theme.min.css +1 -4
- data/assets/css/theme.scss +4 -0
- data/assets/js/mermaid.min.js +6 -5
- data/assets/js/search.js +90 -0
- data/assets/js/theme.js +55 -121
- data/assets/js/theme.min.js +1 -1
- data/assets/search.liquid +9 -1
- metadata +74 -25
- data/_includes/assets/custom.js +0 -0
- data/_includes/assets/custom.scss +0 -0
- data/_includes/class/_breadcrumbs.liquid +0 -28
- data/_includes/class/_footer.liquid +0 -38
- data/_includes/class/rst-versions.liquid +0 -22
- data/_includes/class/wy-nav-content.liquid +0 -15
- data/_includes/class/wy-nav-side.liquid +0 -18
- data/_includes/class/wy-nav-top.liquid +0 -8
- data/_includes/extra/footer.html +0 -0
- data/_includes/extra/head.html +0 -0
- data/_includes/node/links.liquid +0 -24
- data/_includes/node/metadata.liquid +0 -21
- data/_includes/node/script.extension.liquid +0 -29
- data/_includes/node/script.liquid +0 -20
- data/_includes/node/script.schema.liquid +0 -27
- data/_includes/node/title.liquid +0 -1
- data/_includes/reset/i18n.liquid +0 -1
@@ -0,0 +1,278 @@
|
|
1
|
+
// Needs refactoring
|
2
|
+
// stylelint-disable selector-no-qualifying-type, selector-max-compound-selectors
|
3
|
+
// stylelint-disable selector-max-type
|
4
|
+
// Base form controls
|
5
|
+
//
|
6
|
+
// Overrides for common inputs for easier styling.
|
7
|
+
|
8
|
+
fieldset {
|
9
|
+
padding: 0;
|
10
|
+
margin: 0;
|
11
|
+
border: 0;
|
12
|
+
}
|
13
|
+
|
14
|
+
label {
|
15
|
+
font-weight: $font-weight-bold;
|
16
|
+
}
|
17
|
+
|
18
|
+
.form-control,
|
19
|
+
.form-select {
|
20
|
+
// stylelint-disable-next-line primer/spacing
|
21
|
+
padding: 5px 12px;
|
22
|
+
font-size: $body-font-size;
|
23
|
+
// stylelint-disable-next-line primer/typography
|
24
|
+
line-height: 20px;
|
25
|
+
color: $text-gray-dark;
|
26
|
+
vertical-align: middle;
|
27
|
+
background-color: $bg-white;
|
28
|
+
background-repeat: no-repeat; // Repeat and position set for form states (success, error, etc)
|
29
|
+
background-position: right 8px center; // For form validation. This keeps images 8px from right and centered vertically.
|
30
|
+
border: $border-width $border-style $border-color;
|
31
|
+
border-radius: $border-radius;
|
32
|
+
outline: none;
|
33
|
+
box-shadow: $box-shadow-inset;
|
34
|
+
|
35
|
+
&.focus,
|
36
|
+
&:focus {
|
37
|
+
border-color: $border-blue;
|
38
|
+
outline: none;
|
39
|
+
box-shadow: $box-shadow-focus;
|
40
|
+
}
|
41
|
+
|
42
|
+
&[disabled] {
|
43
|
+
// stylelint-disable-next-line primer/colors
|
44
|
+
color: $gray-400;
|
45
|
+
// stylelint-disable-next-line primer/colors
|
46
|
+
background-color: #f3f4f6; // custom gray
|
47
|
+
}
|
48
|
+
|
49
|
+
// Ensures inputs don't zoom on mobile but are body-font size on desktop
|
50
|
+
@include breakpoint(md) {
|
51
|
+
font-size: $body-font-size;
|
52
|
+
}
|
53
|
+
}
|
54
|
+
|
55
|
+
// Textarea
|
56
|
+
textarea.form-control {
|
57
|
+
padding-top: $spacer-2;
|
58
|
+
padding-bottom: $spacer-2;
|
59
|
+
line-height: $lh-default;
|
60
|
+
}
|
61
|
+
|
62
|
+
// Inputs with contrast for easy light gray backgrounds against white.
|
63
|
+
.input-contrast {
|
64
|
+
background-color: $bg-gray-light;
|
65
|
+
|
66
|
+
&:focus {
|
67
|
+
background-color: $bg-white;
|
68
|
+
}
|
69
|
+
}
|
70
|
+
|
71
|
+
// Inputs to be used against dark backgrounds.
|
72
|
+
.input-dark {
|
73
|
+
color: $text-white;
|
74
|
+
// stylelint-disable-next-line primer/colors
|
75
|
+
background-color: $white-fade-15;
|
76
|
+
border-color: transparent;
|
77
|
+
box-shadow: none;
|
78
|
+
|
79
|
+
&::placeholder {
|
80
|
+
color: inherit;
|
81
|
+
opacity: 0.6; // inceases contrast ratio to 4.52
|
82
|
+
}
|
83
|
+
|
84
|
+
&.focus,
|
85
|
+
&:focus {
|
86
|
+
// stylelint-disable-next-line primer/borders
|
87
|
+
border-color: $black-fade-30;
|
88
|
+
// stylelint-disable-next-line primer/box-shadow
|
89
|
+
box-shadow: 0 0 0 0.2em rgba($blue-300, 0.4);
|
90
|
+
}
|
91
|
+
}
|
92
|
+
|
93
|
+
// Custom styling for HTML5 validation bubbles (WebKit only)
|
94
|
+
::placeholder {
|
95
|
+
color: $text-gray-light;
|
96
|
+
opacity: 1; // override opacity in normalize.css
|
97
|
+
}
|
98
|
+
|
99
|
+
// Mini inputs, to match .minibutton
|
100
|
+
.input-sm {
|
101
|
+
// stylelint-disable-next-line primer/spacing
|
102
|
+
padding-top: 3px;
|
103
|
+
// stylelint-disable-next-line primer/spacing
|
104
|
+
padding-bottom: 3px;
|
105
|
+
font-size: $font-size-small;
|
106
|
+
// stylelint-disable-next-line primer/typography
|
107
|
+
line-height: 20px;
|
108
|
+
}
|
109
|
+
|
110
|
+
// Large inputs
|
111
|
+
.input-lg {
|
112
|
+
font-size: $h4-size;
|
113
|
+
}
|
114
|
+
|
115
|
+
// Full-width inputs
|
116
|
+
.input-block {
|
117
|
+
display: block;
|
118
|
+
width: 100%;
|
119
|
+
}
|
120
|
+
|
121
|
+
// Inputs with monospace text
|
122
|
+
.input-monospace {
|
123
|
+
font-family: $mono-font;
|
124
|
+
}
|
125
|
+
|
126
|
+
// Hide the icon that tries to autofill contact info in webkit
|
127
|
+
.input-hide-webkit-autofill {
|
128
|
+
&::-webkit-contacts-auto-fill-button {
|
129
|
+
position: absolute;
|
130
|
+
right: 0;
|
131
|
+
display: none !important;
|
132
|
+
pointer-events: none;
|
133
|
+
visibility: hidden;
|
134
|
+
}
|
135
|
+
}
|
136
|
+
|
137
|
+
// Checkboxes and Radiobuttons
|
138
|
+
//
|
139
|
+
// For checkboxes and radio button selections.
|
140
|
+
.form-checkbox {
|
141
|
+
// stylelint-disable-next-line primer/spacing
|
142
|
+
padding-left: 20px;
|
143
|
+
// stylelint-disable-next-line primer/spacing
|
144
|
+
margin: 15px 0;
|
145
|
+
vertical-align: middle;
|
146
|
+
|
147
|
+
label {
|
148
|
+
em.highlight {
|
149
|
+
position: relative;
|
150
|
+
left: -$spacer-1;
|
151
|
+
// stylelint-disable-next-line primer/spacing
|
152
|
+
padding: 2px $spacer-1;
|
153
|
+
font-style: normal;
|
154
|
+
// stylelint-disable-next-line primer/colors
|
155
|
+
background: $yellow-100;
|
156
|
+
border-radius: $border-radius;
|
157
|
+
}
|
158
|
+
}
|
159
|
+
|
160
|
+
input[type="checkbox"],
|
161
|
+
input[type="radio"] {
|
162
|
+
float: left;
|
163
|
+
// stylelint-disable-next-line primer/spacing
|
164
|
+
margin: 5px 0 0 -20px;
|
165
|
+
vertical-align: middle;
|
166
|
+
}
|
167
|
+
|
168
|
+
.note {
|
169
|
+
display: block;
|
170
|
+
margin: 0;
|
171
|
+
font-size: $font-size-small;
|
172
|
+
font-weight: $font-weight-normal;
|
173
|
+
color: $text-gray;
|
174
|
+
}
|
175
|
+
}
|
176
|
+
|
177
|
+
.form-checkbox-details {
|
178
|
+
display: none;
|
179
|
+
}
|
180
|
+
|
181
|
+
.form-checkbox-details-trigger {
|
182
|
+
&:checked {
|
183
|
+
// child of sibling or sibling
|
184
|
+
~ * .form-checkbox-details,
|
185
|
+
~ .form-checkbox-details {
|
186
|
+
// eslint-disable selector-combinator-space-before
|
187
|
+
display: block;
|
188
|
+
}
|
189
|
+
}
|
190
|
+
}
|
191
|
+
|
192
|
+
// Field groups
|
193
|
+
//
|
194
|
+
// Wrap field groups in `<div.hfields>` to lay them out horizontally - great for
|
195
|
+
// the top of pages with autosave.
|
196
|
+
.hfields {
|
197
|
+
// stylelint-disable-next-line primer/spacing
|
198
|
+
margin: 15px 0;
|
199
|
+
@include clearfix;
|
200
|
+
|
201
|
+
.form-group {
|
202
|
+
float: left;
|
203
|
+
// stylelint-disable-next-line primer/spacing
|
204
|
+
margin: 0 30px 0 0;
|
205
|
+
|
206
|
+
dt, // TODO: Deprecate
|
207
|
+
.form-group-header {
|
208
|
+
label {
|
209
|
+
display: inline-block;
|
210
|
+
// stylelint-disable-next-line primer/spacing
|
211
|
+
margin: 5px 0 0;
|
212
|
+
color: $text-gray;
|
213
|
+
}
|
214
|
+
|
215
|
+
img {
|
216
|
+
position: relative;
|
217
|
+
top: -2px;
|
218
|
+
}
|
219
|
+
}
|
220
|
+
}
|
221
|
+
|
222
|
+
.btn {
|
223
|
+
float: left;
|
224
|
+
// stylelint-disable-next-line primer/spacing
|
225
|
+
margin: 28px 25px 0 -20px;
|
226
|
+
}
|
227
|
+
|
228
|
+
// stylelint-disable-next-line primer/spacing
|
229
|
+
.form-select {
|
230
|
+
margin-top: 5px;
|
231
|
+
}
|
232
|
+
}
|
233
|
+
|
234
|
+
// Hide the up/down buttons in <input type="number"> in the login form, the
|
235
|
+
// input is used for two-factor auth codes, type="number" makes it more usable
|
236
|
+
// on phones
|
237
|
+
input::-webkit-outer-spin-button,
|
238
|
+
input::-webkit-inner-spin-button {
|
239
|
+
margin: 0;
|
240
|
+
appearance: none;
|
241
|
+
}
|
242
|
+
|
243
|
+
// Input groups
|
244
|
+
|
245
|
+
.form-actions {
|
246
|
+
@include clearfix;
|
247
|
+
|
248
|
+
.btn {
|
249
|
+
float: right;
|
250
|
+
|
251
|
+
+ .btn {
|
252
|
+
// stylelint-disable-next-line primer/spacing
|
253
|
+
margin-right: 5px;
|
254
|
+
}
|
255
|
+
}
|
256
|
+
}
|
257
|
+
|
258
|
+
.form-warning {
|
259
|
+
padding: $spacer-2 10px;
|
260
|
+
// stylelint-disable-next-line primer/spacing
|
261
|
+
margin: 10px 0;
|
262
|
+
font-size: $h5-size;
|
263
|
+
// stylelint-disable-next-line primer/colors
|
264
|
+
color: $yellow-900;
|
265
|
+
// stylelint-disable-next-line primer/colors
|
266
|
+
background: $yellow-100;
|
267
|
+
border: $border-width $border-style $border-yellow;
|
268
|
+
border-radius: $border-radius;
|
269
|
+
|
270
|
+
p {
|
271
|
+
margin: 0;
|
272
|
+
line-height: $lh-default;
|
273
|
+
}
|
274
|
+
|
275
|
+
a {
|
276
|
+
font-weight: $font-weight-bold;
|
277
|
+
}
|
278
|
+
}
|
@@ -0,0 +1,279 @@
|
|
1
|
+
// stylelint-disable selector-max-compound-selectors
|
2
|
+
// stylelint-disable selector-max-type
|
3
|
+
|
4
|
+
// Form groups
|
5
|
+
//
|
6
|
+
// Usage:
|
7
|
+
//
|
8
|
+
// <div class="form-group">
|
9
|
+
// <div class="form-group-header"> containing the label
|
10
|
+
// <div class="form-group-body"> containing the form elements
|
11
|
+
// </div>
|
12
|
+
|
13
|
+
.form-group {
|
14
|
+
// stylelint-disable-next-line primer/spacing
|
15
|
+
margin: 15px 0;
|
16
|
+
|
17
|
+
// Text fields
|
18
|
+
.form-control {
|
19
|
+
width: 440px;
|
20
|
+
max-width: 100%;
|
21
|
+
// stylelint-disable-next-line primer/spacing
|
22
|
+
margin-right: 5px;
|
23
|
+
background-color: $bg-gray-light;
|
24
|
+
|
25
|
+
&:focus {
|
26
|
+
background-color: $bg-white;
|
27
|
+
}
|
28
|
+
|
29
|
+
&.shorter {
|
30
|
+
width: 130px;
|
31
|
+
}
|
32
|
+
|
33
|
+
&.short {
|
34
|
+
width: 250px;
|
35
|
+
}
|
36
|
+
|
37
|
+
&.long {
|
38
|
+
width: 100%;
|
39
|
+
}
|
40
|
+
}
|
41
|
+
|
42
|
+
// Textarea
|
43
|
+
// stylelint-disable selector-no-qualifying-type
|
44
|
+
textarea.form-control {
|
45
|
+
width: 100%;
|
46
|
+
height: 200px;
|
47
|
+
min-height: 200px;
|
48
|
+
|
49
|
+
&.short {
|
50
|
+
height: 50px;
|
51
|
+
min-height: 50px;
|
52
|
+
}
|
53
|
+
}
|
54
|
+
// stylelint-enable selector-no-qualifying-type
|
55
|
+
|
56
|
+
// The Label
|
57
|
+
dt, // TODO: Deprecate
|
58
|
+
.form-group-header {
|
59
|
+
// stylelint-disable-next-line primer/spacing
|
60
|
+
margin: 0 0 6px;
|
61
|
+
}
|
62
|
+
|
63
|
+
label {
|
64
|
+
position: relative;
|
65
|
+
}
|
66
|
+
|
67
|
+
&.flattened dt, // TODO: Deprecate
|
68
|
+
&.flattened .form-group-header {
|
69
|
+
float: left;
|
70
|
+
margin: 0;
|
71
|
+
// stylelint-disable-next-line primer/typography
|
72
|
+
line-height: 32px;
|
73
|
+
}
|
74
|
+
|
75
|
+
&.flattened dd, // TODO: Deprecate
|
76
|
+
&.flattened .form-group-body {
|
77
|
+
// stylelint-disable-next-line primer/typography
|
78
|
+
line-height: 32px;
|
79
|
+
}
|
80
|
+
|
81
|
+
//
|
82
|
+
// Form Elements
|
83
|
+
//
|
84
|
+
// stylelint-disable selector-no-qualifying-type
|
85
|
+
dd, // TODO: Deprecate
|
86
|
+
.form-group-body {
|
87
|
+
h4 {
|
88
|
+
margin: $spacer-1 0 0;
|
89
|
+
|
90
|
+
&.is-error {
|
91
|
+
color: $text-red;
|
92
|
+
}
|
93
|
+
|
94
|
+
&.is-success {
|
95
|
+
color: $text-green;
|
96
|
+
}
|
97
|
+
|
98
|
+
+ .note {
|
99
|
+
margin-top: 0;
|
100
|
+
}
|
101
|
+
}
|
102
|
+
}
|
103
|
+
// stylelint-enable selector-no-qualifying-type
|
104
|
+
|
105
|
+
//
|
106
|
+
// Variants
|
107
|
+
//
|
108
|
+
|
109
|
+
&.required {
|
110
|
+
dt label::after, // TODO: Deprecate
|
111
|
+
.form-group-header label::after {
|
112
|
+
// stylelint-disable-next-line primer/spacing
|
113
|
+
padding-left: 5px;
|
114
|
+
color: $text-red;
|
115
|
+
content: "*";
|
116
|
+
}
|
117
|
+
}
|
118
|
+
|
119
|
+
// Form AJAX states
|
120
|
+
//
|
121
|
+
// Form fields that need feedback for AJAX loading, success
|
122
|
+
// states and errored states.
|
123
|
+
.success,
|
124
|
+
.error,
|
125
|
+
.indicator {
|
126
|
+
display: none;
|
127
|
+
font-size: $font-size-small;
|
128
|
+
font-weight: $font-weight-bold;
|
129
|
+
}
|
130
|
+
|
131
|
+
&.loading {
|
132
|
+
opacity: 0.5;
|
133
|
+
|
134
|
+
.indicator {
|
135
|
+
display: inline;
|
136
|
+
}
|
137
|
+
|
138
|
+
.spinner {
|
139
|
+
display: inline-block;
|
140
|
+
vertical-align: middle;
|
141
|
+
}
|
142
|
+
}
|
143
|
+
|
144
|
+
&.successful {
|
145
|
+
.success {
|
146
|
+
display: inline;
|
147
|
+
color: $text-green;
|
148
|
+
}
|
149
|
+
}
|
150
|
+
|
151
|
+
// Form validation
|
152
|
+
//
|
153
|
+
// Our inline errors
|
154
|
+
|
155
|
+
&.successed,
|
156
|
+
&.warn,
|
157
|
+
&.errored {
|
158
|
+
.success,
|
159
|
+
.warning,
|
160
|
+
.error {
|
161
|
+
position: absolute;
|
162
|
+
z-index: 10;
|
163
|
+
display: block; // Show up in errored/warn state
|
164
|
+
max-width: 450px; // Keep our long errors readable
|
165
|
+
padding: $spacer-1 $spacer-2;
|
166
|
+
margin: $spacer-2 0 0;
|
167
|
+
font-size: $font-size-small;
|
168
|
+
font-weight: $font-weight-normal;
|
169
|
+
border-style: $border-style;
|
170
|
+
border-width: $border-width;
|
171
|
+
border-radius: $border-radius;
|
172
|
+
|
173
|
+
&::after,
|
174
|
+
&::before {
|
175
|
+
position: absolute;
|
176
|
+
bottom: 100%;
|
177
|
+
left: 10px;
|
178
|
+
z-index: 15;
|
179
|
+
width: 0;
|
180
|
+
height: 0;
|
181
|
+
pointer-events: none;
|
182
|
+
content: " ";
|
183
|
+
// stylelint-disable-next-line primer/borders
|
184
|
+
border: $border-style transparent;
|
185
|
+
}
|
186
|
+
|
187
|
+
&::after {
|
188
|
+
// stylelint-disable-next-line primer/borders
|
189
|
+
border-width: 5px;
|
190
|
+
}
|
191
|
+
|
192
|
+
&::before {
|
193
|
+
// stylelint-disable-next-line primer/spacing
|
194
|
+
margin-left: -1px;
|
195
|
+
// stylelint-disable-next-line primer/borders
|
196
|
+
border-width: 6px;
|
197
|
+
}
|
198
|
+
}
|
199
|
+
}
|
200
|
+
|
201
|
+
&.successed {
|
202
|
+
.success {
|
203
|
+
// stylelint-disable-next-line primer/colors
|
204
|
+
color: $green-900;
|
205
|
+
// stylelint-disable-next-line primer/colors
|
206
|
+
background-color: $green-100;
|
207
|
+
border-color: $border-green;
|
208
|
+
|
209
|
+
&::after {
|
210
|
+
// stylelint-disable-next-line primer/borders
|
211
|
+
border-bottom-color: $green-100;
|
212
|
+
}
|
213
|
+
|
214
|
+
&::before {
|
215
|
+
border-bottom-color: $border-green;
|
216
|
+
}
|
217
|
+
}
|
218
|
+
}
|
219
|
+
|
220
|
+
&.warn {
|
221
|
+
.form-control {
|
222
|
+
// stylelint-disable-next-line primer/borders
|
223
|
+
border-color: $yellow-600;
|
224
|
+
}
|
225
|
+
|
226
|
+
.warning {
|
227
|
+
// stylelint-disable-next-line primer/colors
|
228
|
+
background-color: $yellow-200;
|
229
|
+
border-color: $border-yellow;
|
230
|
+
|
231
|
+
&::after {
|
232
|
+
// stylelint-disable-next-line primer/borders
|
233
|
+
border-bottom-color: $yellow-200;
|
234
|
+
}
|
235
|
+
|
236
|
+
&::before {
|
237
|
+
border-bottom-color: $border-yellow;
|
238
|
+
}
|
239
|
+
}
|
240
|
+
}
|
241
|
+
|
242
|
+
&.errored {
|
243
|
+
.form-control {
|
244
|
+
// stylelint-disable-next-line primer/borders
|
245
|
+
border-color: $red-600;
|
246
|
+
}
|
247
|
+
|
248
|
+
label {
|
249
|
+
color: $text-red;
|
250
|
+
}
|
251
|
+
|
252
|
+
.error {
|
253
|
+
background-color: $bg-red-light;
|
254
|
+
border-color: $border-red-light;
|
255
|
+
|
256
|
+
&::after {
|
257
|
+
// stylelint-disable-next-line primer/borders
|
258
|
+
border-bottom-color: $bg-red-light;
|
259
|
+
}
|
260
|
+
|
261
|
+
&::before {
|
262
|
+
border-bottom-color: $border-red-light;
|
263
|
+
}
|
264
|
+
}
|
265
|
+
}
|
266
|
+
}
|
267
|
+
|
268
|
+
.note {
|
269
|
+
min-height: 17px;
|
270
|
+
margin: $spacer-1 0 2px;
|
271
|
+
font-size: $font-size-small;
|
272
|
+
color: $text-gray;
|
273
|
+
|
274
|
+
.spinner {
|
275
|
+
// stylelint-disable-next-line primer/spacing
|
276
|
+
margin-right: 3px;
|
277
|
+
vertical-align: middle;
|
278
|
+
}
|
279
|
+
}
|
@@ -0,0 +1,38 @@
|
|
1
|
+
// Custom select
|
2
|
+
//
|
3
|
+
// Apply `.select` to any `<select>` element for custom styles.
|
4
|
+
.form-select {
|
5
|
+
display: inline-block;
|
6
|
+
max-width: 100%;
|
7
|
+
height: $size-5;
|
8
|
+
padding-right: $spacer-4;
|
9
|
+
background-color: $bg-white;
|
10
|
+
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAUCAMAAACzvE1FAAAADFBMVEUzMzMzMzMzMzMzMzMKAG/3AAAAA3RSTlMAf4C/aSLHAAAAPElEQVR42q3NMQ4AIAgEQTn//2cLdRKppSGzBYwzVXvznNWs8C58CiussPJj8h6NwgorrKRdTvuV9v16Afn0AYFOB7aYAAAAAElFTkSuQmCC");
|
11
|
+
background-repeat: no-repeat;
|
12
|
+
background-position: right 8px center;
|
13
|
+
background-size: 8px 10px;
|
14
|
+
appearance: none;
|
15
|
+
|
16
|
+
// Hides the default caret in IE11
|
17
|
+
&::-ms-expand {
|
18
|
+
opacity: 0;
|
19
|
+
}
|
20
|
+
|
21
|
+
&[multiple] {
|
22
|
+
height: auto;
|
23
|
+
}
|
24
|
+
}
|
25
|
+
|
26
|
+
.select-sm {
|
27
|
+
height: $size-4;
|
28
|
+
// stylelint-disable-next-line primer/spacing
|
29
|
+
padding-top: 3px;
|
30
|
+
// stylelint-disable-next-line primer/spacing
|
31
|
+
padding-bottom: 3px;
|
32
|
+
font-size: $font-size-small;
|
33
|
+
|
34
|
+
&[multiple] {
|
35
|
+
height: auto;
|
36
|
+
min-height: 0;
|
37
|
+
}
|
38
|
+
}
|