css tweaks
This commit is contained in:
parent
d924cb47a7
commit
8c6a2bdb07
2 changed files with 19 additions and 9 deletions
|
@ -1,6 +1,7 @@
|
||||||
<component name="InspectionProjectProfileManager">
|
<component name="InspectionProjectProfileManager">
|
||||||
<profile version="1.0">
|
<profile version="1.0">
|
||||||
<option name="myName" value="Project Default" />
|
<option name="myName" value="Project Default" />
|
||||||
|
<inspection_tool class="GrazieInspection" enabled="false" level="TYPO" enabled_by_default="false" />
|
||||||
<inspection_tool class="PyAugmentAssignmentInspection" enabled="true" level="WEAK WARNING" enabled_by_default="true" />
|
<inspection_tool class="PyAugmentAssignmentInspection" enabled="true" level="WEAK WARNING" enabled_by_default="true" />
|
||||||
<inspection_tool class="PyComparisonWithNoneInspection" enabled="true" level="WARNING" enabled_by_default="true" />
|
<inspection_tool class="PyComparisonWithNoneInspection" enabled="true" level="WARNING" enabled_by_default="true" />
|
||||||
<inspection_tool class="PyCompatibilityInspection" enabled="true" level="WARNING" enabled_by_default="true">
|
<inspection_tool class="PyCompatibilityInspection" enabled="true" level="WARNING" enabled_by_default="true">
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
body {
|
body {
|
||||||
font-family: sans-serif;
|
font-family: "Noto Sans", sans-serif;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: max(325px, 15%) auto;
|
grid-template-columns: max(325px, 15%) auto;
|
||||||
|
@ -82,7 +82,7 @@ header {
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
transition: 0.2s all;
|
transition: 0.2s all;
|
||||||
}
|
}
|
||||||
header::after {
|
header::after { /* the background image behind the sidebar */
|
||||||
/* will use webp with jpeg fallback when
|
/* will use webp with jpeg fallback when
|
||||||
https://developer.mozilla.org/en-US/docs/Web/CSS/image()#browser_compatibility becomes a thing, until then, it's jpeg
|
https://developer.mozilla.org/en-US/docs/Web/CSS/image()#browser_compatibility becomes a thing, until then, it's jpeg
|
||||||
only for now :c */
|
only for now :c */
|
||||||
|
@ -98,10 +98,10 @@ header::after {
|
||||||
/* image("/assets/img/background.webp", "/assets/img/background.jpeg") no-repeat bottom center/cover, */
|
/* image("/assets/img/background.webp", "/assets/img/background.jpeg") no-repeat bottom center/cover, */
|
||||||
url("/assets/img/background.jpeg") no-repeat bottom center/cover,
|
url("/assets/img/background.jpeg") no-repeat bottom center/cover,
|
||||||
#333;
|
#333;
|
||||||
filter: blur(5px) saturate(75%);
|
filter: blur(3px) saturate(75%);
|
||||||
content: "";
|
content: "";
|
||||||
}
|
}
|
||||||
#hamburger {
|
#hamburger { /* hamburger menu button, should only display on mobile devices. see @media section at bottom of file */
|
||||||
display: none;
|
display: none;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 10px;
|
top: 10px;
|
||||||
|
@ -118,14 +118,14 @@ header::after {
|
||||||
#hb-icon {
|
#hb-icon {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background: linear-gradient( to bottom, mediumpurple, mediumpurple 10%, #fafafa 10%, #fafafa 45%, mediumpurple 45%, mediumpurple 55%, #fafafa 55%, #fafafa 90%, mediumpurple 90%, mediumpurple 100% );
|
background: linear-gradient(to bottom, mediumpurple, mediumpurple 10%, #fafafa 10%, #fafafa 45%, mediumpurple 45%, mediumpurple 55%, #fafafa 55%, #fafafa 90%, mediumpurple 90%, mediumpurple 100%);
|
||||||
}
|
}
|
||||||
|
|
||||||
nav a {
|
nav a {
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
nav a {
|
nav a {
|
||||||
padding: 10px 0;
|
padding: 10px 40px;
|
||||||
display: block;
|
display: block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -145,10 +145,12 @@ nav a::before {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
transition: 0.2s all;
|
transition: 0.2s all;
|
||||||
}
|
}
|
||||||
nav a:hover,
|
nav a:hover {
|
||||||
nav a.current {
|
|
||||||
background: #00000044;
|
background: #00000044;
|
||||||
}
|
}
|
||||||
|
nav a.current:not(:hover) {
|
||||||
|
background: #9370db44;
|
||||||
|
}
|
||||||
nav a:hover::before,
|
nav a:hover::before,
|
||||||
nav a.current::before {
|
nav a.current::before {
|
||||||
left: 0;
|
left: 0;
|
||||||
|
@ -185,8 +187,15 @@ nav a.current::before {
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* smaller screen tweaks */
|
||||||
|
@media only screen and (max-device-width : 840px) {
|
||||||
|
body {
|
||||||
|
grid-template-columns: max(225px, 15%) auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/* mobile tweaks */
|
/* mobile tweaks */
|
||||||
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
|
@media only screen and (max-device-width : 480px) {
|
||||||
main {
|
main {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
|
|
Loading…
Reference in a new issue