1 .Box {
2 display: flex;
3 align-items: center;
4 }
5
6 .Box_1 {
7 display: flex;
8 }
9
10 .stickyHeader {
11 top: 0;
12 position: sticky;
13 }
14
15 /* mr: 4 = 24px */
16 .SiteTitle {
17 margin-right: 24px;
18 }
19
20 /* ml: 4 = 24px */
21 /* color: 'fg.default' in dark_dimmed = #E1E4E8 */
22 .Link {
23 display: block;
24 margin-left: 24px;
25 color: #e1e4e8;
26 }
27
28 /* px: [3, null, null, 4] = 16px base, 24px at lg */
29 /* bg: 'canvas.default' in dark_dimmed theme = #333333 */
30 .headerBox {
31 display: flex;
32 height: 56px;
33 padding-left: 16px;
34 padding-right: 16px;
35 align-items: center;
36 justify-content: space-between;
37 background-color: #333333;
38 border: 1px solid;
39 border-left-width: 0;
40 border-right-width: 0;
41 border-color: #444d56;
42 }
43
44 @media (min-width: 1012px) {
45 .headerBox {
46 padding-left: 24px;
47 padding-right: 24px;
48 }
49 }
50
51 /* ml: 4 = 24px */
52 .searchDesktop {
53 display: none;
54 margin-left: 24px;
55 }
56
57 @media (min-width: 1012px) {
58 .searchDesktop {
59 display: block;
60 }
61 }
62
63 .navDesktop {
64 display: none;
65 align-items: center;
66 }
67
68 @media (min-width: 1012px) {
69 .navDesktop {
70 display: flex;
71 }
72 }
73
74 .navMobile {
75 display: flex;
76 }
77
78 @media (min-width: 1012px) {
79 .navMobile {
80 display: none;
81 }
82 }