administrate-bootstrap-theme 0.1.0 → 0.1.9
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.
- checksums.yaml +4 -4
- data/README.md +25 -11
- data/Rakefile +10 -14
- data/app/assets/config/administrate-bootstrap-theme_manifest.js +1 -0
- data/app/assets/javascripts/administrate-bootstrap-theme/theme.js +2 -0
- data/app/assets/stylesheets/administrate-bootstrap-theme/_base.scss +17 -1
- data/app/assets/stylesheets/administrate-bootstrap-theme/components/_content_body.scss +17 -3
- data/app/assets/stylesheets/administrate-bootstrap-theme/components/_form.scss +52 -16
- data/app/assets/stylesheets/administrate-bootstrap-theme/theme.scss +12 -0
- data/lib/administrate-bootstrap-theme/engine.rb +2 -0
- data/lib/administrate-bootstrap-theme/version.rb +1 -1
- data/node_modules/bootstrap/js/src/alert.js +141 -0
- data/node_modules/bootstrap/js/src/base-component.js +46 -0
- data/node_modules/bootstrap/js/src/button.js +95 -0
- data/node_modules/bootstrap/js/src/carousel.js +624 -0
- data/node_modules/bootstrap/js/src/collapse.js +410 -0
- data/node_modules/bootstrap/js/src/dom/data.js +57 -0
- data/node_modules/bootstrap/js/src/dom/event-handler.js +331 -0
- data/node_modules/bootstrap/js/src/dom/manipulator.js +80 -0
- data/node_modules/bootstrap/js/src/dom/selector-engine.js +75 -0
- data/node_modules/bootstrap/js/src/dropdown.js +543 -0
- data/node_modules/bootstrap/js/src/modal.js +582 -0
- data/node_modules/bootstrap/js/src/offcanvas.js +279 -0
- data/node_modules/bootstrap/js/src/popover.js +171 -0
- data/node_modules/bootstrap/js/src/scrollspy.js +319 -0
- data/node_modules/bootstrap/js/src/tab.js +220 -0
- data/node_modules/bootstrap/js/src/toast.js +219 -0
- data/node_modules/bootstrap/js/src/tooltip.js +802 -0
- data/node_modules/bootstrap/js/src/util/index.js +253 -0
- data/node_modules/bootstrap/js/src/util/sanitizer.js +127 -0
- data/node_modules/bootstrap/js/src/util/scrollbar.js +70 -0
- data/node_modules/bootstrap/scss/_accordion.scss +116 -0
- data/node_modules/bootstrap/scss/_alert.scss +57 -0
- data/node_modules/bootstrap/scss/_badge.scss +29 -0
- data/node_modules/bootstrap/scss/_breadcrumb.scss +28 -0
- data/node_modules/bootstrap/scss/_button-group.scss +139 -0
- data/node_modules/bootstrap/scss/_buttons.scss +111 -0
- data/node_modules/bootstrap/scss/_card.scss +215 -0
- data/node_modules/bootstrap/scss/_carousel.scss +229 -0
- data/node_modules/bootstrap/scss/_close.scss +40 -0
- data/node_modules/bootstrap/scss/_containers.scss +41 -0
- data/node_modules/bootstrap/scss/_dropdown.scss +246 -0
- data/node_modules/bootstrap/scss/_forms.scss +9 -0
- data/node_modules/bootstrap/scss/_functions.scss +205 -0
- data/node_modules/bootstrap/scss/_grid.scss +22 -0
- data/node_modules/bootstrap/scss/_helpers.scss +7 -0
- data/node_modules/bootstrap/scss/_images.scss +42 -0
- data/node_modules/bootstrap/scss/_list-group.scss +174 -0
- data/node_modules/bootstrap/scss/_mixins.scss +41 -0
- data/node_modules/bootstrap/scss/_modal.scss +237 -0
- data/node_modules/bootstrap/scss/_nav.scss +139 -0
- data/node_modules/bootstrap/scss/_navbar.scss +306 -0
- data/node_modules/bootstrap/scss/_offcanvas.scss +77 -0
- data/node_modules/bootstrap/scss/_pagination.scss +64 -0
- data/node_modules/bootstrap/scss/_popover.scss +158 -0
- data/node_modules/bootstrap/scss/_progress.scss +48 -0
- data/node_modules/bootstrap/scss/_reboot.scss +621 -0
- data/node_modules/bootstrap/scss/_root.scss +16 -0
- data/node_modules/bootstrap/scss/_spinners.scss +69 -0
- data/node_modules/bootstrap/scss/_tables.scss +150 -0
- data/node_modules/bootstrap/scss/_toasts.scss +51 -0
- data/node_modules/bootstrap/scss/_tooltip.scss +115 -0
- data/node_modules/bootstrap/scss/_transitions.scss +21 -0
- data/node_modules/bootstrap/scss/_type.scss +104 -0
- data/node_modules/bootstrap/scss/_utilities.scss +594 -0
- data/node_modules/bootstrap/scss/_variables.scss +1464 -0
- data/node_modules/bootstrap/scss/bootstrap-grid.scss +65 -0
- data/node_modules/bootstrap/scss/bootstrap-reboot.scss +15 -0
- data/node_modules/bootstrap/scss/bootstrap-utilities.scss +18 -0
- data/node_modules/bootstrap/scss/bootstrap.scss +52 -0
- data/node_modules/bootstrap/scss/forms/_floating-labels.scss +61 -0
- data/node_modules/bootstrap/scss/forms/_form-check.scss +152 -0
- data/node_modules/bootstrap/scss/forms/_form-control.scss +219 -0
- data/node_modules/bootstrap/scss/forms/_form-range.scss +91 -0
- data/node_modules/bootstrap/scss/forms/_form-select.scss +67 -0
- data/node_modules/bootstrap/scss/forms/_form-text.scss +11 -0
- data/node_modules/bootstrap/scss/forms/_input-group.scss +121 -0
- data/node_modules/bootstrap/scss/forms/_labels.scss +36 -0
- data/node_modules/bootstrap/scss/forms/_validation.scss +12 -0
- data/node_modules/bootstrap/scss/helpers/_clearfix.scss +3 -0
- data/node_modules/bootstrap/scss/helpers/_colored-links.scss +12 -0
- data/node_modules/bootstrap/scss/helpers/_position.scss +30 -0
- data/node_modules/bootstrap/scss/helpers/_ratio.scss +26 -0
- data/node_modules/bootstrap/scss/helpers/_stretched-link.scss +15 -0
- data/node_modules/bootstrap/scss/helpers/_text-truncation.scss +7 -0
- data/node_modules/bootstrap/scss/helpers/_visually-hidden.scss +8 -0
- data/node_modules/bootstrap/scss/mixins/_alert.scss +11 -0
- data/node_modules/bootstrap/scss/mixins/_border-radius.scss +78 -0
- data/node_modules/bootstrap/scss/mixins/_box-shadow.scss +18 -0
- data/node_modules/bootstrap/scss/mixins/_breakpoints.scss +127 -0
- data/node_modules/bootstrap/scss/mixins/_buttons.scss +133 -0
- data/node_modules/bootstrap/scss/mixins/_caret.scss +64 -0
- data/node_modules/bootstrap/scss/mixins/_clearfix.scss +9 -0
- data/node_modules/bootstrap/scss/mixins/_container.scss +9 -0
- data/node_modules/bootstrap/scss/mixins/_deprecate.scss +10 -0
- data/node_modules/bootstrap/scss/mixins/_forms.scss +134 -0
- data/node_modules/bootstrap/scss/mixins/_gradients.scss +47 -0
- data/node_modules/bootstrap/scss/mixins/_grid.scss +120 -0
- data/node_modules/bootstrap/scss/mixins/_image.scss +16 -0
- data/node_modules/bootstrap/scss/mixins/_list-group.scss +24 -0
- data/node_modules/bootstrap/scss/mixins/_lists.scss +7 -0
- data/node_modules/bootstrap/scss/mixins/_pagination.scss +31 -0
- data/node_modules/bootstrap/scss/mixins/_reset-text.scss +17 -0
- data/node_modules/bootstrap/scss/mixins/_resize.scss +6 -0
- data/node_modules/bootstrap/scss/mixins/_table-variants.scss +21 -0
- data/node_modules/bootstrap/scss/mixins/_text-truncate.scss +8 -0
- data/node_modules/bootstrap/scss/mixins/_transition.scss +26 -0
- data/node_modules/bootstrap/scss/mixins/_utilities.scss +68 -0
- data/node_modules/bootstrap/scss/mixins/_visually-hidden.scss +29 -0
- data/node_modules/bootstrap/scss/utilities/_api.scss +47 -0
- data/node_modules/bootstrap/scss/vendor/_rfs.scss +312 -0
- metadata +106 -19
|
@@ -0,0 +1,139 @@
|
|
|
1
|
+
// Base class
|
|
2
|
+
//
|
|
3
|
+
// Kickstart any navigation component with a set of style resets. Works with
|
|
4
|
+
// `<nav>`s, `<ul>`s or `<ol>`s.
|
|
5
|
+
|
|
6
|
+
.nav {
|
|
7
|
+
display: flex;
|
|
8
|
+
flex-wrap: wrap;
|
|
9
|
+
padding-left: 0;
|
|
10
|
+
margin-bottom: 0;
|
|
11
|
+
list-style: none;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.nav-link {
|
|
15
|
+
display: block;
|
|
16
|
+
padding: $nav-link-padding-y $nav-link-padding-x;
|
|
17
|
+
@include font-size($nav-link-font-size);
|
|
18
|
+
font-weight: $nav-link-font-weight;
|
|
19
|
+
color: $nav-link-color;
|
|
20
|
+
text-decoration: if($link-decoration == none, null, none);
|
|
21
|
+
@include transition($nav-link-transition);
|
|
22
|
+
|
|
23
|
+
&:hover,
|
|
24
|
+
&:focus {
|
|
25
|
+
color: $nav-link-hover-color;
|
|
26
|
+
text-decoration: if($link-hover-decoration == underline, none, null);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
// Disabled state lightens text
|
|
30
|
+
&.disabled {
|
|
31
|
+
color: $nav-link-disabled-color;
|
|
32
|
+
pointer-events: none;
|
|
33
|
+
cursor: default;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
//
|
|
38
|
+
// Tabs
|
|
39
|
+
//
|
|
40
|
+
|
|
41
|
+
.nav-tabs {
|
|
42
|
+
border-bottom: $nav-tabs-border-width solid $nav-tabs-border-color;
|
|
43
|
+
|
|
44
|
+
.nav-link {
|
|
45
|
+
margin-bottom: -$nav-tabs-border-width;
|
|
46
|
+
background: none;
|
|
47
|
+
border: $nav-tabs-border-width solid transparent;
|
|
48
|
+
@include border-top-radius($nav-tabs-border-radius);
|
|
49
|
+
|
|
50
|
+
&:hover,
|
|
51
|
+
&:focus {
|
|
52
|
+
border-color: $nav-tabs-link-hover-border-color;
|
|
53
|
+
// Prevents active .nav-link tab overlapping focus outline of previous/next .nav-link
|
|
54
|
+
isolation: isolate;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
&.disabled {
|
|
58
|
+
color: $nav-link-disabled-color;
|
|
59
|
+
background-color: transparent;
|
|
60
|
+
border-color: transparent;
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.nav-link.active,
|
|
65
|
+
.nav-item.show .nav-link {
|
|
66
|
+
color: $nav-tabs-link-active-color;
|
|
67
|
+
background-color: $nav-tabs-link-active-bg;
|
|
68
|
+
border-color: $nav-tabs-link-active-border-color;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
.dropdown-menu {
|
|
72
|
+
// Make dropdown border overlap tab border
|
|
73
|
+
margin-top: -$nav-tabs-border-width;
|
|
74
|
+
// Remove the top rounded corners here since there is a hard edge above the menu
|
|
75
|
+
@include border-top-radius(0);
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
|
|
80
|
+
//
|
|
81
|
+
// Pills
|
|
82
|
+
//
|
|
83
|
+
|
|
84
|
+
.nav-pills {
|
|
85
|
+
.nav-link {
|
|
86
|
+
background: none;
|
|
87
|
+
border: 0;
|
|
88
|
+
@include border-radius($nav-pills-border-radius);
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
.nav-link.active,
|
|
92
|
+
.show > .nav-link {
|
|
93
|
+
color: $nav-pills-link-active-color;
|
|
94
|
+
@include gradient-bg($nav-pills-link-active-bg);
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
|
|
99
|
+
//
|
|
100
|
+
// Justified variants
|
|
101
|
+
//
|
|
102
|
+
|
|
103
|
+
.nav-fill {
|
|
104
|
+
> .nav-link,
|
|
105
|
+
.nav-item {
|
|
106
|
+
flex: 1 1 auto;
|
|
107
|
+
text-align: center;
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
.nav-justified {
|
|
112
|
+
> .nav-link,
|
|
113
|
+
.nav-item {
|
|
114
|
+
flex-basis: 0;
|
|
115
|
+
flex-grow: 1;
|
|
116
|
+
text-align: center;
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
.nav-fill,
|
|
121
|
+
.nav-justified {
|
|
122
|
+
.nav-item .nav-link {
|
|
123
|
+
width: 100%; // Make sure button will grow
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
|
|
128
|
+
// Tabbable tabs
|
|
129
|
+
//
|
|
130
|
+
// Hide tabbable panes to start, show them when `.active`
|
|
131
|
+
|
|
132
|
+
.tab-content {
|
|
133
|
+
> .tab-pane {
|
|
134
|
+
display: none;
|
|
135
|
+
}
|
|
136
|
+
> .active {
|
|
137
|
+
display: block;
|
|
138
|
+
}
|
|
139
|
+
}
|
|
@@ -0,0 +1,306 @@
|
|
|
1
|
+
// Contents
|
|
2
|
+
//
|
|
3
|
+
// Navbar
|
|
4
|
+
// Navbar brand
|
|
5
|
+
// Navbar nav
|
|
6
|
+
// Navbar text
|
|
7
|
+
// Responsive navbar
|
|
8
|
+
// Navbar position
|
|
9
|
+
// Navbar themes
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
// Navbar
|
|
13
|
+
//
|
|
14
|
+
// Provide a static navbar from which we expand to create full-width, fixed, and
|
|
15
|
+
// other navbar variations.
|
|
16
|
+
|
|
17
|
+
.navbar {
|
|
18
|
+
position: relative;
|
|
19
|
+
display: flex;
|
|
20
|
+
flex-wrap: wrap; // allow us to do the line break for collapsing content
|
|
21
|
+
align-items: center;
|
|
22
|
+
justify-content: space-between; // space out brand from logo
|
|
23
|
+
padding-top: $navbar-padding-y;
|
|
24
|
+
padding-right: $navbar-padding-x; // default: null
|
|
25
|
+
padding-bottom: $navbar-padding-y;
|
|
26
|
+
padding-left: $navbar-padding-x; // default: null
|
|
27
|
+
@include gradient-bg();
|
|
28
|
+
|
|
29
|
+
// Because flex properties aren't inherited, we need to redeclare these first
|
|
30
|
+
// few properties so that content nested within behave properly.
|
|
31
|
+
// The `flex-wrap` property is inherited to simplify the expanded navbars
|
|
32
|
+
%container-flex-properties {
|
|
33
|
+
display: flex;
|
|
34
|
+
flex-wrap: inherit;
|
|
35
|
+
align-items: center;
|
|
36
|
+
justify-content: space-between;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
> .container,
|
|
40
|
+
> .container-fluid {
|
|
41
|
+
@extend %container-flex-properties;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
@each $breakpoint, $container-max-width in $container-max-widths {
|
|
45
|
+
> .container#{breakpoint-infix($breakpoint, $container-max-widths)} {
|
|
46
|
+
@extend %container-flex-properties;
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
|
|
52
|
+
// Navbar brand
|
|
53
|
+
//
|
|
54
|
+
// Used for brand, project, or site names.
|
|
55
|
+
|
|
56
|
+
.navbar-brand {
|
|
57
|
+
padding-top: $navbar-brand-padding-y;
|
|
58
|
+
padding-bottom: $navbar-brand-padding-y;
|
|
59
|
+
margin-right: $navbar-brand-margin-end;
|
|
60
|
+
@include font-size($navbar-brand-font-size);
|
|
61
|
+
text-decoration: if($link-decoration == none, null, none);
|
|
62
|
+
white-space: nowrap;
|
|
63
|
+
|
|
64
|
+
&:hover,
|
|
65
|
+
&:focus {
|
|
66
|
+
text-decoration: if($link-hover-decoration == underline, none, null);
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
|
|
71
|
+
// Navbar nav
|
|
72
|
+
//
|
|
73
|
+
// Custom navbar navigation (doesn't require `.nav`, but does make use of `.nav-link`).
|
|
74
|
+
|
|
75
|
+
.navbar-nav {
|
|
76
|
+
display: flex;
|
|
77
|
+
flex-direction: column; // cannot use `inherit` to get the `.navbar`s value
|
|
78
|
+
padding-left: 0;
|
|
79
|
+
margin-bottom: 0;
|
|
80
|
+
list-style: none;
|
|
81
|
+
|
|
82
|
+
.nav-link {
|
|
83
|
+
padding-right: 0;
|
|
84
|
+
padding-left: 0;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
.dropdown-menu {
|
|
88
|
+
position: static;
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
// Navbar text
|
|
94
|
+
//
|
|
95
|
+
//
|
|
96
|
+
|
|
97
|
+
.navbar-text {
|
|
98
|
+
padding-top: $nav-link-padding-y;
|
|
99
|
+
padding-bottom: $nav-link-padding-y;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
|
|
103
|
+
// Responsive navbar
|
|
104
|
+
//
|
|
105
|
+
// Custom styles for responsive collapsing and toggling of navbar contents.
|
|
106
|
+
// Powered by the collapse Bootstrap JavaScript plugin.
|
|
107
|
+
|
|
108
|
+
// When collapsed, prevent the toggleable navbar contents from appearing in
|
|
109
|
+
// the default flexbox row orientation. Requires the use of `flex-wrap: wrap`
|
|
110
|
+
// on the `.navbar` parent.
|
|
111
|
+
.navbar-collapse {
|
|
112
|
+
flex-basis: 100%;
|
|
113
|
+
flex-grow: 1;
|
|
114
|
+
// For always expanded or extra full navbars, ensure content aligns itself
|
|
115
|
+
// properly vertically. Can be easily overridden with flex utilities.
|
|
116
|
+
align-items: center;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
// Button for toggling the navbar when in its collapsed state
|
|
120
|
+
.navbar-toggler {
|
|
121
|
+
padding: $navbar-toggler-padding-y $navbar-toggler-padding-x;
|
|
122
|
+
@include font-size($navbar-toggler-font-size);
|
|
123
|
+
line-height: 1;
|
|
124
|
+
background-color: transparent; // remove default button style
|
|
125
|
+
border: $border-width solid transparent; // remove default button style
|
|
126
|
+
@include border-radius($navbar-toggler-border-radius);
|
|
127
|
+
@include transition($navbar-toggler-transition);
|
|
128
|
+
|
|
129
|
+
&:hover {
|
|
130
|
+
text-decoration: none;
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
&:focus {
|
|
134
|
+
text-decoration: none;
|
|
135
|
+
outline: 0;
|
|
136
|
+
box-shadow: 0 0 0 $navbar-toggler-focus-width;
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
// Keep as a separate element so folks can easily override it with another icon
|
|
141
|
+
// or image file as needed.
|
|
142
|
+
.navbar-toggler-icon {
|
|
143
|
+
display: inline-block;
|
|
144
|
+
width: 1.5em;
|
|
145
|
+
height: 1.5em;
|
|
146
|
+
vertical-align: middle;
|
|
147
|
+
background-repeat: no-repeat;
|
|
148
|
+
background-position: center;
|
|
149
|
+
background-size: 100%;
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
.navbar-nav-scroll {
|
|
153
|
+
max-height: var(--#{$variable-prefix}scroll-height, 75vh);
|
|
154
|
+
overflow-y: auto;
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
// scss-docs-start navbar-expand-loop
|
|
158
|
+
// Generate series of `.navbar-expand-*` responsive classes for configuring
|
|
159
|
+
// where your navbar collapses.
|
|
160
|
+
.navbar-expand {
|
|
161
|
+
@each $breakpoint in map-keys($grid-breakpoints) {
|
|
162
|
+
$next: breakpoint-next($breakpoint, $grid-breakpoints);
|
|
163
|
+
$infix: breakpoint-infix($next, $grid-breakpoints);
|
|
164
|
+
|
|
165
|
+
// stylelint-disable-next-line scss/selector-no-union-class-name
|
|
166
|
+
&#{$infix} {
|
|
167
|
+
@include media-breakpoint-up($next) {
|
|
168
|
+
flex-wrap: nowrap;
|
|
169
|
+
justify-content: flex-start;
|
|
170
|
+
|
|
171
|
+
.navbar-nav {
|
|
172
|
+
flex-direction: row;
|
|
173
|
+
|
|
174
|
+
.dropdown-menu {
|
|
175
|
+
position: absolute;
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
.nav-link {
|
|
179
|
+
padding-right: $navbar-nav-link-padding-x;
|
|
180
|
+
padding-left: $navbar-nav-link-padding-x;
|
|
181
|
+
}
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
.navbar-nav-scroll {
|
|
185
|
+
overflow: visible;
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
.navbar-collapse {
|
|
189
|
+
display: flex !important; // stylelint-disable-line declaration-no-important
|
|
190
|
+
flex-basis: auto;
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
.navbar-toggler {
|
|
194
|
+
display: none;
|
|
195
|
+
}
|
|
196
|
+
}
|
|
197
|
+
}
|
|
198
|
+
}
|
|
199
|
+
}
|
|
200
|
+
// scss-docs-end navbar-expand-loop
|
|
201
|
+
|
|
202
|
+
|
|
203
|
+
// Navbar themes
|
|
204
|
+
//
|
|
205
|
+
// Styles for switching between navbars with light or dark background.
|
|
206
|
+
|
|
207
|
+
// Dark links against a light background
|
|
208
|
+
.navbar-light {
|
|
209
|
+
.navbar-brand {
|
|
210
|
+
color: $navbar-light-brand-color;
|
|
211
|
+
|
|
212
|
+
&:hover,
|
|
213
|
+
&:focus {
|
|
214
|
+
color: $navbar-light-brand-hover-color;
|
|
215
|
+
}
|
|
216
|
+
}
|
|
217
|
+
|
|
218
|
+
.navbar-nav {
|
|
219
|
+
.nav-link {
|
|
220
|
+
color: $navbar-light-color;
|
|
221
|
+
|
|
222
|
+
&:hover,
|
|
223
|
+
&:focus {
|
|
224
|
+
color: $navbar-light-hover-color;
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
&.disabled {
|
|
228
|
+
color: $navbar-light-disabled-color;
|
|
229
|
+
}
|
|
230
|
+
}
|
|
231
|
+
|
|
232
|
+
.show > .nav-link,
|
|
233
|
+
.nav-link.active {
|
|
234
|
+
color: $navbar-light-active-color;
|
|
235
|
+
}
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
.navbar-toggler {
|
|
239
|
+
color: $navbar-light-color;
|
|
240
|
+
border-color: $navbar-light-toggler-border-color;
|
|
241
|
+
}
|
|
242
|
+
|
|
243
|
+
.navbar-toggler-icon {
|
|
244
|
+
background-image: escape-svg($navbar-light-toggler-icon-bg);
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
.navbar-text {
|
|
248
|
+
color: $navbar-light-color;
|
|
249
|
+
|
|
250
|
+
a,
|
|
251
|
+
a:hover,
|
|
252
|
+
a:focus {
|
|
253
|
+
color: $navbar-light-active-color;
|
|
254
|
+
}
|
|
255
|
+
}
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
// White links against a dark background
|
|
259
|
+
.navbar-dark {
|
|
260
|
+
.navbar-brand {
|
|
261
|
+
color: $navbar-dark-brand-color;
|
|
262
|
+
|
|
263
|
+
&:hover,
|
|
264
|
+
&:focus {
|
|
265
|
+
color: $navbar-dark-brand-hover-color;
|
|
266
|
+
}
|
|
267
|
+
}
|
|
268
|
+
|
|
269
|
+
.navbar-nav {
|
|
270
|
+
.nav-link {
|
|
271
|
+
color: $navbar-dark-color;
|
|
272
|
+
|
|
273
|
+
&:hover,
|
|
274
|
+
&:focus {
|
|
275
|
+
color: $navbar-dark-hover-color;
|
|
276
|
+
}
|
|
277
|
+
|
|
278
|
+
&.disabled {
|
|
279
|
+
color: $navbar-dark-disabled-color;
|
|
280
|
+
}
|
|
281
|
+
}
|
|
282
|
+
|
|
283
|
+
.show > .nav-link,
|
|
284
|
+
.nav-link.active {
|
|
285
|
+
color: $navbar-dark-active-color;
|
|
286
|
+
}
|
|
287
|
+
}
|
|
288
|
+
|
|
289
|
+
.navbar-toggler {
|
|
290
|
+
color: $navbar-dark-color;
|
|
291
|
+
border-color: $navbar-dark-toggler-border-color;
|
|
292
|
+
}
|
|
293
|
+
|
|
294
|
+
.navbar-toggler-icon {
|
|
295
|
+
background-image: escape-svg($navbar-dark-toggler-icon-bg);
|
|
296
|
+
}
|
|
297
|
+
|
|
298
|
+
.navbar-text {
|
|
299
|
+
color: $navbar-dark-color;
|
|
300
|
+
a,
|
|
301
|
+
a:hover,
|
|
302
|
+
a:focus {
|
|
303
|
+
color: $navbar-dark-active-color;
|
|
304
|
+
}
|
|
305
|
+
}
|
|
306
|
+
}
|
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
.offcanvas {
|
|
2
|
+
position: fixed;
|
|
3
|
+
bottom: 0;
|
|
4
|
+
z-index: $zindex-offcanvas;
|
|
5
|
+
display: flex;
|
|
6
|
+
flex-direction: column;
|
|
7
|
+
max-width: 100%;
|
|
8
|
+
color: $offcanvas-color;
|
|
9
|
+
visibility: hidden;
|
|
10
|
+
background-color: $offcanvas-bg-color;
|
|
11
|
+
background-clip: padding-box;
|
|
12
|
+
outline: 0;
|
|
13
|
+
@include box-shadow($offcanvas-box-shadow);
|
|
14
|
+
@include transition(transform $offcanvas-transition-duration ease-in-out);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.offcanvas-header {
|
|
18
|
+
display: flex;
|
|
19
|
+
justify-content: space-between;
|
|
20
|
+
padding: $offcanvas-padding-y $offcanvas-padding-x;
|
|
21
|
+
|
|
22
|
+
.btn-close {
|
|
23
|
+
padding: ($offcanvas-padding-y / 2) ($offcanvas-padding-x / 2);
|
|
24
|
+
margin: ($offcanvas-padding-y / -2) ($offcanvas-padding-x / -2) ($offcanvas-padding-y / -2) auto;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.offcanvas-title {
|
|
29
|
+
margin-bottom: 0;
|
|
30
|
+
line-height: $offcanvas-title-line-height;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.offcanvas-body {
|
|
34
|
+
flex-grow: 1;
|
|
35
|
+
padding: $offcanvas-padding-y $offcanvas-padding-x;
|
|
36
|
+
overflow-y: auto;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.offcanvas-start {
|
|
40
|
+
top: 0;
|
|
41
|
+
left: 0;
|
|
42
|
+
width: $offcanvas-horizontal-width;
|
|
43
|
+
border-right: $offcanvas-border-width solid $offcanvas-border-color;
|
|
44
|
+
transform: translateX(-100%);
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.offcanvas-end {
|
|
48
|
+
top: 0;
|
|
49
|
+
right: 0;
|
|
50
|
+
width: $offcanvas-horizontal-width;
|
|
51
|
+
border-left: $offcanvas-border-width solid $offcanvas-border-color;
|
|
52
|
+
transform: translateX(100%);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.offcanvas-bottom {
|
|
56
|
+
right: 0;
|
|
57
|
+
left: 0;
|
|
58
|
+
height: $offcanvas-vertical-height;
|
|
59
|
+
max-height: 100%;
|
|
60
|
+
border-top: $offcanvas-border-width solid $offcanvas-border-color;
|
|
61
|
+
transform: translateY(100%);
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.offcanvas.show {
|
|
65
|
+
transform: none;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
.offcanvas-backdrop::before {
|
|
69
|
+
position: fixed;
|
|
70
|
+
top: 0;
|
|
71
|
+
left: 0;
|
|
72
|
+
z-index: $zindex-offcanvas - 1;
|
|
73
|
+
width: 100vw;
|
|
74
|
+
height: 100vh;
|
|
75
|
+
content: "";
|
|
76
|
+
background-color: $offcanvas-body-backdrop-color;
|
|
77
|
+
}
|