rodude123/my-portfolio
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

commented css file

Browse Source
This commit is contained in:
Rohit Pai 2021-07-31 16:39:53 +01:00
parent e7c045f9e2
commit 1321a56547
1 changed files with 20 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/css/main.css
View File

@ -25,6 +25,14 @@ html {
scroll-behavior: smooth; scroll-behavior: smooth;
} }
body {
font-family: Noto Sans KR, sans-serif;
font-style: normal;
font-weight: 500;
font-size: 1.125rem;
line-height: 1.625rem;
}
a:visited { a:visited {
color: inherit; color: inherit;
} }
@ -90,15 +98,7 @@ a.btn:active, form input[type="submit"]:active {
text-shadow: 0 6px 4px var(--mutedBlack); text-shadow: 0 6px 4px var(--mutedBlack);
} }
/*** Standard Styles ****/ /*** Navigation Styles **/
body {
font-family: Noto Sans KR, sans-serif;
font-style: normal;
font-weight: 500;
font-size: 1.125rem;
line-height: 1.625rem;
}
header { header {
background: #6A6A6A url("../imgs/hero.jpg") no-repeat bottom; background: #6A6A6A url("../imgs/hero.jpg") no-repeat bottom;
@ -201,7 +201,11 @@ div h1 span {
} }
} }
/**** Media Queries *****/
@media screen and (max-width: 75em) { @media screen and (max-width: 75em) {
/*** Navigation styles **/
nav { nav {
display: block; display: block;
height: 50px; height: 50px;
@ -277,6 +281,8 @@ div h1 span {
transition: .25s ease-in; transition: .25s ease-in;
} }
/** burger not clicked **/
nav #nav-check:not(:checked) ~ ul{ nav #nav-check:not(:checked) ~ ul{
height: auto; height: auto;
max-height: 0; max-height: 0;
@ -306,10 +312,12 @@ div h1 span {
transform-origin: left center; transform-origin: left center;
} }
nav .nav-btn label:hover, nav #nav-check:checked ~ .nav-btn label { nav .nav-btn label:hover, nav #nav-check:checked ~ .nav-btn label {
background-color: rgba(-1, 0, 0, 0.3); background-color: rgba(-1, 0, 0, 0.3);
} }
/**** burger clicked ****/
nav #nav-check:checked ~ ul{ nav #nav-check:checked ~ ul{
max-height: 50vh; max-height: 50vh;
overflow-y: hidden; overflow-y: hidden;
@ -361,6 +369,8 @@ div h1 span {
} }
@media screen and (max-width: 31em) { @media screen and (max-width: 31em) {
/** not to squish name **/
header div h1{ header div h1{
width: min-content; width: min-content;
} }