summaryrefslogtreecommitdiff
path: root/themes/hugo-coder/assets/scss/_navigation.scss
diff options
context:
space:
mode:
authorRyan Schanzenbacher <ryan@rschanz.org>2021-12-26 00:30:09 -0500
committerRyan Schanzenbacher <ryan@rschanz.org>2021-12-26 00:30:09 -0500
commit98a21b966410c127e74b16e7a2817882ee16560f (patch)
treeee646c86e3d3f0fa1cd952294d49feeeb700d60f /themes/hugo-coder/assets/scss/_navigation.scss
parente6eec31b71ab728f6610f4e764b2e206fb95f940 (diff)
convert theme from submodule to regular files
Diffstat (limited to 'themes/hugo-coder/assets/scss/_navigation.scss')
m---------themes/hugo-coder0
-rw-r--r--themes/hugo-coder/assets/scss/_navigation.scss143
2 files changed, 143 insertions, 0 deletions
diff --git a/themes/hugo-coder b/themes/hugo-coder
deleted file mode 160000
Subproject 55b2a150f990bc56364dba347bc9acc6aab07be
diff --git a/themes/hugo-coder/assets/scss/_navigation.scss b/themes/hugo-coder/assets/scss/_navigation.scss
new file mode 100644
index 0000000..cd55a60
--- /dev/null
+++ b/themes/hugo-coder/assets/scss/_navigation.scss
@@ -0,0 +1,143 @@
1.navigation {
2 height: 6rem;
3 width: 100%;
4
5 a,
6 span {
7 display: inline;
8 font-size: 1.7rem;
9 font-family: $font-family;
10 font-weight: 600;
11 color: $fg-color;
12 }
13
14 a {
15
16 &:hover,
17 &:focus {
18 color: $link-color;
19 }
20 }
21
22 .navigation-title {
23 letter-spacing: 0.1rem;
24 text-transform: uppercase;
25 }
26
27 .navigation-list {
28 float: right;
29 list-style: none;
30 margin-bottom: 0;
31 margin-top: 0;
32
33 @media only screen and (max-width: 768px) {
34 position: relative;
35 top: 2rem;
36 right: 0;
37 z-index: 5;
38 visibility: hidden;
39 opacity: 0;
40 padding: 0;
41 max-height: 0;
42 width: 100%;
43 background-color: $bg-color;
44 border-top: solid 2px $alt-bg-color;
45 border-bottom: solid 2px $alt-bg-color;
46 transition: opacity 0.25s, max-height 0.15s linear;
47 }
48
49 .navigation-item {
50 float: left;
51 margin: 0;
52 position: relative;
53
54 @media only screen and (max-width: 768px) {
55 float: none !important;
56 text-align: center;
57
58 a,
59 span {
60 line-height: 5rem;
61 }
62 }
63
64 a,
65 span {
66 margin-left: 1rem;
67 margin-right: 1rem;
68 }
69 }
70
71 .separator {
72 @media only screen and (max-width: 768px) {
73 display: none;
74 }
75 }
76
77 .menu-separator {
78 @media only screen and (max-width: 768px) {
79 border-top: 2px solid $fg-color;
80 margin: 0 8rem;
81
82 span {
83 display: none;
84 }
85 }
86 }
87 }
88
89 #dark-mode-toggle {
90 margin: 1.7rem 0;
91 font-size: 2.4rem;
92 line-height: inherit;
93 bottom: 2rem;
94 left: 2rem;
95 z-index: 100;
96 position: fixed;
97 }
98
99 #menu-toggle {
100 display: none;
101
102 @media only screen and (max-width: 768px) {
103 &:checked+label>i {
104 color: $alt-bg-color;
105 }
106
107 &:checked+label+ul {
108 visibility: visible;
109 opacity: 1;
110 max-height: 100rem;
111 }
112 }
113 }
114
115 .menu-button {
116 display: none;
117
118 @media only screen and (max-width: 768px) {
119 position: relative;
120 display: block;
121 font-size: 2.4rem;
122 font-weight: 400;
123 }
124
125 i {
126
127 &:hover,
128 &:focus {
129 color: $alt-fg-color;
130 }
131 }
132 }
133
134 i {
135 color: $fg-color;
136 cursor: pointer;
137
138 &:hover,
139 &:focus {
140 color: $link-color;
141 }
142 }
143}