source: imaps-frontend/node_modules/bootstrap/scss/forms/_form-select.scss

main
Last change on this file was d565449, checked in by stefan toskovski <stefantoska84@…>, 4 weeks ago

Update repo after prototype presentation

  • Property mode set to 100644
File size: 2.4 KB
Line 
1// Select
2//
3// Replaces the browser default select with a custom one, mostly pulled from
4// https://primer.github.io/.
5
6.form-select {
7 --#{$prefix}form-select-bg-img: #{escape-svg($form-select-indicator)};
8
9 display: block;
10 width: 100%;
11 padding: $form-select-padding-y $form-select-indicator-padding $form-select-padding-y $form-select-padding-x;
12 font-family: $form-select-font-family;
13 @include font-size($form-select-font-size);
14 font-weight: $form-select-font-weight;
15 line-height: $form-select-line-height;
16 color: $form-select-color;
17 appearance: none;
18 background-color: $form-select-bg;
19 background-image: var(--#{$prefix}form-select-bg-img), var(--#{$prefix}form-select-bg-icon, none);
20 background-repeat: no-repeat;
21 background-position: $form-select-bg-position;
22 background-size: $form-select-bg-size;
23 border: $form-select-border-width solid $form-select-border-color;
24 @include border-radius($form-select-border-radius, 0);
25 @include box-shadow($form-select-box-shadow);
26 @include transition($form-select-transition);
27
28 &:focus {
29 border-color: $form-select-focus-border-color;
30 outline: 0;
31 @if $enable-shadows {
32 @include box-shadow($form-select-box-shadow, $form-select-focus-box-shadow);
33 } @else {
34 // Avoid using mixin so we can pass custom focus shadow properly
35 box-shadow: $form-select-focus-box-shadow;
36 }
37 }
38
39 &[multiple],
40 &[size]:not([size="1"]) {
41 padding-right: $form-select-padding-x;
42 background-image: none;
43 }
44
45 &:disabled {
46 color: $form-select-disabled-color;
47 background-color: $form-select-disabled-bg;
48 border-color: $form-select-disabled-border-color;
49 }
50
51 // Remove outline from select box in FF
52 &:-moz-focusring {
53 color: transparent;
54 text-shadow: 0 0 0 $form-select-color;
55 }
56}
57
58.form-select-sm {
59 padding-top: $form-select-padding-y-sm;
60 padding-bottom: $form-select-padding-y-sm;
61 padding-left: $form-select-padding-x-sm;
62 @include font-size($form-select-font-size-sm);
63 @include border-radius($form-select-border-radius-sm);
64}
65
66.form-select-lg {
67 padding-top: $form-select-padding-y-lg;
68 padding-bottom: $form-select-padding-y-lg;
69 padding-left: $form-select-padding-x-lg;
70 @include font-size($form-select-font-size-lg);
71 @include border-radius($form-select-border-radius-lg);
72}
73
74@if $enable-dark-mode {
75 @include color-mode(dark) {
76 .form-select {
77 --#{$prefix}form-select-bg-img: #{escape-svg($form-select-indicator-dark)};
78 }
79 }
80}
Note: See TracBrowser for help on using the repository browser.