UNPKG

4.63 kBCSSView Raw
1/**
2 * 1. Breadcrumbs are placed in the top-left corner and need to be bumped over
3 * a bit.
4 */
5.localBreadcrumbs {
6 display: flex;
7 align-items: center;
8 height: 100%;
9 padding-left: 10px;
10 /* 1 */ }
11
12.localBreadcrumb + .localBreadcrumb {
13 margin-left: 6px; }
14 .localBreadcrumb + .localBreadcrumb:before {
15 content: '/';
16 user-select: none;
17 margin-right: 4px;
18 color: #5a5a5a; }
19
20.localBreadcrumb:last-child .localBreadcrumb__link {
21 pointer-events: none;
22 color: #2d2d2d; }
23
24.localBreadcrumb__link {
25 font-size: 14px;
26 color: #5a5a5a;
27 text-decoration: none; }
28 .localBreadcrumb__link:hover {
29 text-decoration: underline; }
30
31.localBreadcrumb__emphasis {
32 font-weight: 700; }
33
34.localDropdown {
35 padding: 10px 10px 14px;
36 background-color: #f6f6f6;
37 line-height: 20px; }
38
39.localDropdownPanels {
40 display: flex; }
41
42.localDropdownPanel {
43 flex: 1 1 0%; }
44
45.localDropdownPanel--left {
46 margin-right: 30px; }
47
48.localDropdownPanel--right {
49 margin-left: 30px; }
50
51.localDropdownTitle {
52 margin-bottom: 12px;
53 font-size: 18px;
54 color: #000000; }
55
56.localDropdownSection {
57 margin-bottom: 16px; }
58 .localDropdownSection:last-child {
59 margin-bottom: 0; }
60
61.localDropdownHeader {
62 display: flex;
63 align-items: center;
64 justify-content: space-between;
65 margin-bottom: 6px; }
66
67.localDropdownHeader__label {
68 font-size: 14px;
69 font-weight: 700;
70 color: #000000; }
71
72.localDropdownHeader__actions {
73 display: flex; }
74
75.localDropdownHeader__action {
76 color: #328CAA;
77 font-size: 12px;
78 text-decoration: none; }
79 .localDropdownHeader__action + .localDropdownHeader__action {
80 margin-left: 10px; }
81 .localDropdownHeader__action:hover, .localDropdownHeader__action:active {
82 color: #105A73; }
83
84.localDropdownInput {
85 display: block;
86 width: 100%;
87 margin-bottom: 12px;
88 padding: 5px 15px;
89 font-size: 14px;
90 color: #2d2d2d;
91 border: 2px solid #ffffff;
92 border-radius: 4px; }
93
94.localDropdownFormNote {
95 font-size: 14px;
96 color: #5A5A5A; }
97
98.localDropdownWarning {
99 margin-bottom: 16px;
100 padding: 6px 10px;
101 font-size: 14px;
102 color: #2D2D2D;
103 background-color: #e4e4e4; }
104
105.localDropdownHelpText {
106 margin-bottom: 16px;
107 font-size: 14px;
108 color: #2D2D2D; }
109
110.localMenu {
111 display: flex;
112 align-items: center;
113 height: 100%; }
114
115.localMenuItem {
116 display: flex;
117 align-items: center;
118 height: 100%;
119 padding: 0 10px;
120 font-size: 14px;
121 background-color: transparent;
122 color: #5a5a5a;
123 border: 0;
124 cursor: pointer; }
125 .localMenuItem:hover {
126 background-color: rgba(0, 0, 0, 0.1);
127 color: #000000; }
128 .localMenuItem.localMenuItem-isSelected {
129 background-color: #f6f6f6; }
130 .localMenuItem.localMenuItem-isDisabled {
131 opacity: 0.5;
132 cursor: default;
133 pointer-events: none; }
134
135.localMenuItem__icon {
136 margin-right: 5px;
137 margin-bottom: -1px; }
138
139/**
140 * 1. Match height of logo in side bar, but allow it to expand to accommodate
141 * dropdown.
142 */
143.localNav {
144 display: flex;
145 flex-direction: column;
146 justify-content: space-between;
147 min-height: 70px;
148 /* 1 */
149 background-color: #e4e4e4; }
150
151.localNavRow {
152 display: flex;
153 align-items: center;
154 justify-content: space-between;
155 height: 32px; }
156
157.localNavRow__section {
158 height: 100%; }
159
160.localNavRow--secondary {
161 height: 38px;
162 padding: 0 10px; }
163
164.localSearch {
165 display: flex;
166 width: 100%;
167 height: 30px; }
168
169.localSearchInput {
170 flex: 1 1 100%;
171 padding: 5px 15px;
172 font-size: 14px;
173 color: #2d2d2d;
174 border: 2px solid #ffffff;
175 border-bottom-left-radius: 4px;
176 border-top-left-radius: 4px;
177 border-bottom-right-radius: 0;
178 border-top-right-radius: 0; }
179 .localSearchInput.localSearchInput-isInvalid {
180 border-color: #e74C3c; }
181
182.localSearchButton {
183 width: 43px;
184 height: 30px;
185 font-size: 14px;
186 background-color: #9c9c9c;
187 color: #ffffff;
188 border: 0;
189 border-bottom-left-radius: 0;
190 border-top-left-radius: 0;
191 border-bottom-right-radius: 4px;
192 border-top-right-radius: 4px; }
193
194.localTabs {
195 display: flex;
196 align-items: center;
197 height: 100%; }
198
199/**
200 * 1. Make sure the bottom border is flush with the bottom of the LocalNav.
201 */
202.localTab {
203 padding: 5px 0 6px 0;
204 font-size: 18px;
205 line-height: 22px;
206 /* 1 */
207 color: #5a5a5a;
208 border-bottom: 2px solid transparent;
209 text-decoration: none; }
210 .localTab:hover, .localTab:active {
211 color: #2d2d2d; }
212 .localTab.localTab-isSelected {
213 color: #2d2d2d;
214 border-bottom-color: #2d2d2d; }
215 .localTab + .localTab {
216 margin-left: 15px; }
217
218.localTitle {
219 display: flex;
220 align-items: center;
221 height: 100%;
222 padding-left: 10px;
223 font-size: 14px;
224 font-weight: bold; }