stream_timer/assets/styles/components/_header.scss at e1e608eb7fccee15b2b6c1ccec4dcf452023c878 · AlexWayfer/stream_timer · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
$header-logo-height: 66px;
$header-vertical-padding: 15px;
$mobile-header-logo-height: 42px;

> header {
	--header-top-padding: 0.4em;

	background-color: $accent-background-color;
	padding: var(--header-top-padding) 0 calc(var(--header-top-padding) + 0.2em);
	z-index: 7;

	&,
	a {
		color: black;
	}

	> .container {
		display: flex;
		align-items: center;

		a[href="/"] {
			display: flex;
			align-items: center;
			margin-right: 1em;

			> img {
				height: 36px;
				margin-right: 0.5em;
			}

			> h1 {
				margin: 0;

				@media screen and (max-width: 800px) {
					display: none;
				}
			}
		}

		nav {
			font-size: 1.2em;
			margin-top: 0.25em;

			> a {
				display: inline-block;
				padding: 0.8em;

				&.selected {
					font-weight: bold;
				}

				@media screen and (max-width: 600px) {
					padding: 0.4em;
				}
			}
		}

		button.theme-toggle {
			margin-left: auto;
			margin-right: 0;
			font-size: 1.6em;
			padding: 0 0.2em;
			background: transparent;
			border: none;
		}
	}
}