|
1 | 1 | .navbar-toggler {
|
2 |
| - position: absolute; |
3 |
| - top: 0.5rem; |
4 |
| - right: 1rem; |
5 |
| - width: 3.5rem; |
6 |
| - height: 2.5rem; |
7 |
| - color: white; |
8 |
| - background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") |
9 |
| - no-repeat center/1.75rem rgba(255, 255, 255, 0.1); |
10 |
| - border: 1px solid rgba(255, 255, 255, 0.1); |
11 |
| - cursor: pointer; |
12 |
| - appearance: none; |
| 2 | + position: absolute; |
| 3 | + top: 0.5rem; |
| 4 | + right: 1rem; |
| 5 | + width: 3.5rem; |
| 6 | + height: 2.5rem; |
| 7 | + color: white; |
| 8 | + background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") |
| 9 | + no-repeat center/1.75rem rgba(255, 255, 255, 0.1); |
| 10 | + border: 1px solid rgba(255, 255, 255, 0.1); |
| 11 | + cursor: pointer; |
| 12 | + appearance: none; |
13 | 13 | }
|
14 | 14 |
|
15 | 15 | .navbar-toggler:checked {
|
16 |
| - background-color: rgba(255, 255, 255, 0.5); |
| 16 | + background-color: rgba(255, 255, 255, 0.5); |
17 | 17 | }
|
18 | 18 |
|
19 | 19 | .top-row {
|
20 |
| - height: 3.5rem; |
21 |
| - background-color: rgba(0, 0, 0, 0.4); |
| 20 | + height: 3.5rem; |
| 21 | + background-color: rgba(0, 0, 0, 0.4); |
22 | 22 | }
|
23 | 23 |
|
24 | 24 | .navbar-brand {
|
25 |
| - font-size: 1.1rem; |
| 25 | + font-size: 1.1rem; |
26 | 26 | }
|
27 | 27 |
|
28 | 28 | .bi {
|
29 |
| - position: relative; |
30 |
| - top: -1px; |
31 |
| - display: inline-block; |
32 |
| - width: 1.25rem; |
33 |
| - height: 1.25rem; |
34 |
| - margin-right: 0.75rem; |
35 |
| - background-size: cover; |
| 29 | + position: relative; |
| 30 | + top: -1px; |
| 31 | + display: inline-block; |
| 32 | + width: 1.25rem; |
| 33 | + height: 1.25rem; |
| 34 | + margin-right: 0.75rem; |
| 35 | + background-size: cover; |
36 | 36 | }
|
37 | 37 |
|
38 | 38 | .bi-house-door-fill-nav-menu {
|
39 |
| - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E"); |
| 39 | + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E"); |
40 | 40 | }
|
41 | 41 |
|
42 | 42 | .bi-plus-square-fill-nav-menu {
|
43 |
| - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E"); |
| 43 | + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E"); |
44 | 44 | }
|
45 | 45 |
|
46 | 46 | .bi-list-nested-nav-menu {
|
47 |
| - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E"); |
| 47 | + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E"); |
48 | 48 | }
|
49 | 49 |
|
50 | 50 | .nav-item {
|
51 |
| - padding-bottom: 0.5rem; |
52 |
| - font-size: 0.9rem; |
| 51 | + padding-bottom: 0.5rem; |
| 52 | + font-size: 0.9rem; |
53 | 53 | }
|
54 | 54 |
|
55 | 55 | .nav-item:first-of-type {
|
56 |
| - padding-top: 1rem; |
| 56 | + padding-top: 1rem; |
57 | 57 | }
|
58 | 58 |
|
59 | 59 | .nav-item:last-of-type {
|
60 |
| - padding-bottom: 1rem; |
| 60 | + padding-bottom: 1rem; |
61 | 61 | }
|
62 | 62 |
|
63 | 63 | .nav-item ::deep .nav-link {
|
64 |
| - display: flex; |
65 |
| - align-items: center; |
66 |
| - width: 100%; |
67 |
| - height: 3rem; |
68 |
| - color: #d7d7d7; |
69 |
| - line-height: 3rem; |
70 |
| - background: none; |
71 |
| - border: none; |
72 |
| - border-radius: 4px; |
| 64 | + display: flex; |
| 65 | + align-items: center; |
| 66 | + width: 100%; |
| 67 | + height: 3rem; |
| 68 | + color: #d7d7d7; |
| 69 | + line-height: 3rem; |
| 70 | + background: none; |
| 71 | + border: none; |
| 72 | + border-radius: 4px; |
73 | 73 | }
|
74 | 74 |
|
75 | 75 | .nav-item ::deep a.active {
|
76 |
| - color: white; |
77 |
| - background-color: rgba(255, 255, 255, 0.37); |
| 76 | + color: white; |
| 77 | + background-color: rgba(255, 255, 255, 0.37); |
78 | 78 | }
|
79 | 79 |
|
80 | 80 | .nav-item ::deep .nav-link:hover {
|
81 |
| - color: white; |
82 |
| - background-color: rgba(255, 255, 255, 0.1); |
| 81 | + color: white; |
| 82 | + background-color: rgba(255, 255, 255, 0.1); |
83 | 83 | }
|
84 | 84 |
|
85 | 85 | .nav-scrollable {
|
86 |
| - display: none; |
| 86 | + display: none; |
87 | 87 | }
|
88 | 88 |
|
89 | 89 | .navbar-toggler:checked ~ .nav-scrollable {
|
90 |
| - display: block; |
| 90 | + display: block; |
91 | 91 | }
|
92 | 92 |
|
93 | 93 | @media (min-width: 641px) {
|
94 |
| - .navbar-toggler { |
95 |
| - display: none; |
96 |
| - } |
97 |
| - |
98 |
| - .nav-scrollable { |
99 |
| - /* Never collapse the sidebar for wide screens */ |
100 |
| - display: block; |
101 |
| - |
102 |
| - /* Allow sidebar to scroll for tall menus */ |
103 |
| - height: calc(100vh - 3.5rem); |
104 |
| - overflow-y: auto; |
105 |
| - } |
| 94 | + .navbar-toggler { |
| 95 | + display: none; |
| 96 | + } |
| 97 | + |
| 98 | + .nav-scrollable { |
| 99 | + /* Never collapse the sidebar for wide screens */ |
| 100 | + display: block; |
| 101 | + |
| 102 | + /* Allow sidebar to scroll for tall menus */ |
| 103 | + height: calc(100vh - 3.5rem); |
| 104 | + overflow-y: auto; |
| 105 | + } |
106 | 106 | }
|
0 commit comments