vrifox/website
vrifox/website
1
0
Fork 0
Code Issues 3 Pull requests Activity

separated main menu and external links more clearly

Browse source
This commit is contained in:
Vrifox 2020-09-30 20:37:20 +02:00
parent bfa8a24e8d
commit c8698d8c80
4 changed files with 71 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

2
assets/partials/_footer.scss
View file

@ -31,7 +31,7 @@ footer {
color: rgb(200, 200, 230);
&:hover {
text-decoration: none;
border-bottom: 2px solid;
border-bottom: 1px solid;
}
}
}

57
assets/partials/_nav.scss
View file

@ -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;
}
}
}
}
}
}