diff --git a/assets/partials/_footer.scss b/assets/partials/_footer.scss
index 93a84de..5e7ef88 100644
--- a/assets/partials/_footer.scss
+++ b/assets/partials/_footer.scss
@@ -31,7 +31,7 @@ footer {
color: rgb(200, 200, 230);
&:hover {
text-decoration: none;
- border-bottom: 2px solid;
+ border-bottom: 1px solid;
}
}
}
diff --git a/assets/partials/_nav.scss b/assets/partials/_nav.scss
index ca6fbcd..1193832 100644
--- a/assets/partials/_nav.scss
+++ b/assets/partials/_nav.scss
@@ -19,8 +19,11 @@ nav {
}
}
}
- .website-nav {
- margin-left: auto;
+ .seperator {
+ display: block;
+ padding: 20px;
+ }
+ .website-mainmenu {
ul {
display: flex;
margin: 0;
@@ -37,6 +40,27 @@ nav {
background: rgb(50, 50, 75);
}
}
+ }
+ }
+ }
+ .website-externallinks {
+ margin-left: auto;
+ ul {
+ display: flex;
+ margin: 0;
+ padding: 0;
+ li {
+ list-style-type: none;
+ a {
+ color: rgb(245, 245, 255);
+ display: block;
+ text-decoration: none;
+ transition: background .2s;
+ padding: 20px 30px;
+ &:hover {
+ background: rgb(50, 50, 75);
+ }
+ }
.seperator {
display: block;
padding: 20px 10px;
@@ -46,12 +70,33 @@ nav {
}
}
}
-@media (max-width: 600px) {
+@media (max-width: 1140px) {
nav {
.container {
- max-width: none;
- .website-nav {
- padding: 0 20px;
+ margin: 0;
+ width: 100%;
+ }
+ }
+}
+@media (max-width: 800px) {
+ nav {
+ .container {
+ .website-externallinks {
+ ul {
+ li {
+ a {
+ color: rgb(215, 215, 225);
+ background: rgb(50, 50, 75);
+ &:hover {
+ background: rgb(40, 40, 60);
+ }
+ }
+ .seperator {
+ display: block;
+ padding: 20px 10px;
+ }
+ }
+ }
}
}
}
diff --git a/config.yaml b/config.yaml
index bd0b3bc..a19a434 100644
--- a/config.yaml
+++ b/config.yaml
@@ -16,7 +16,7 @@ menu:
title: projects
url: /projects
weight: 2
- links:
+ externallinks:
- identifier: mastodon
name: mastodon
title: mastodon
diff --git a/layouts/partials/nav.html b/layouts/partials/nav.html
index a450725..bdbc320 100644
--- a/layouts/partials/nav.html
+++ b/layouts/partials/nav.html
@@ -3,27 +3,29 @@
-