mirror of
https://github.com/MathiasDPX/blog.git
synced 2025-05-09 23:23:09 +00:00
better split base.css / typography.css
This commit is contained in:
parent
a3f3421760
commit
8dfe4dce9f
2 changed files with 50 additions and 47 deletions
|
@ -1,6 +1,5 @@
|
||||||
@import url("typography.css");
|
@import url("typography.css");
|
||||||
|
|
||||||
|
|
||||||
/* Reset */
|
/* Reset */
|
||||||
* {
|
* {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
@ -52,6 +51,13 @@ header h1 {
|
||||||
background-color: #03396C;
|
background-color: #03396C;
|
||||||
padding: 5px 3em 5px 0;
|
padding: 5px 3em 5px 0;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
|
min-width: 100%;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#navbar a + a::before {
|
||||||
|
content: "// ";
|
||||||
|
padding: 0 0.1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Main Content */
|
/* Main Content */
|
||||||
|
@ -60,25 +66,67 @@ header h1 {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#main details div {
|
||||||
|
padding-left: 1em;
|
||||||
|
line-height: 115%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#main details:open {
|
||||||
|
padding-bottom: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#main details summary {
|
||||||
|
cursor: pointer;
|
||||||
|
padding-bottom: 0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
/* Footer */
|
/* Footer */
|
||||||
#footer {
|
#footer {
|
||||||
margin-top: auto;
|
margin-top: auto;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
#footer-title {
|
#footer-title {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
min-width: 100%;
|
||||||
background-color: #03396C;
|
background-color: #03396C;
|
||||||
|
color: #ffffff;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 0.5em 0;
|
padding: 0.5em 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#footer p {
|
||||||
|
padding-top: 0.5em;
|
||||||
|
padding-bottom: 0.5em;
|
||||||
|
line-height: 1.25;
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
margin-bottom: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Links */
|
||||||
|
a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: #005B96;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Media Queries */
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
html, body {
|
html, body {
|
||||||
min-height: 100dvh;
|
min-height: 100dvh;
|
||||||
}
|
}
|
||||||
|
|
||||||
#wrap {
|
#wrap {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: none;
|
max-width: none;
|
||||||
}
|
}
|
||||||
footer p{
|
|
||||||
|
footer p {
|
||||||
margin-bottom: 0.25em;
|
margin-bottom: 0.25em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -47,40 +47,13 @@ time {
|
||||||
font-size: 75%;
|
font-size: 75%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#main details div {
|
|
||||||
padding-left: 1em;
|
|
||||||
line-height: 115%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#main details:open {
|
|
||||||
padding-bottom: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#main details summary {
|
#main details summary {
|
||||||
cursor: pointer;
|
|
||||||
font-family: "Montserrat", sans-serif;
|
font-family: "Montserrat", sans-serif;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
padding-bottom: 0.25em;
|
|
||||||
}
|
|
||||||
|
|
||||||
hr {
|
|
||||||
margin-bottom: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Links */
|
|
||||||
a:hover {
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
text-decoration: none;
|
|
||||||
color: #005B96;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Navigation */
|
/* Navigation */
|
||||||
#navbar {
|
#navbar {
|
||||||
min-width: 100%;
|
|
||||||
color: #ffffff;
|
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
font-family: "Montserrat", sans-serif;
|
font-family: "Montserrat", sans-serif;
|
||||||
}
|
}
|
||||||
|
@ -89,25 +62,7 @@ a {
|
||||||
color: inherit;
|
color: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
#navbar a + a::before {
|
|
||||||
content: "// ";
|
|
||||||
padding: 0 0.1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Footer */
|
/* Footer */
|
||||||
#footer-title {
|
#footer-title {
|
||||||
padding: 5px 0;
|
|
||||||
min-width: 100%;
|
|
||||||
color: #ffffff;
|
|
||||||
font-family: "Montserrat", sans-serif;
|
font-family: "Montserrat", sans-serif;
|
||||||
}
|
|
||||||
|
|
||||||
#footer {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#footer p {
|
|
||||||
padding-top: 0.5em;
|
|
||||||
padding-bottom: 0.5em;
|
|
||||||
line-height: 1.25;
|
|
||||||
}
|
}
|
Loading…
Add table
Add a link
Reference in a new issue