style headers and footer
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
This commit is contained in:
parent
4dd047f891
commit
b988805ea5
|
@ -2,4 +2,5 @@
|
||||||
font-family: Orbitron, sans-serif;
|
font-family: Orbitron, sans-serif;
|
||||||
font-weight: 900;
|
font-weight: 900;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
|
color: $primary-1;
|
||||||
}
|
}
|
||||||
|
|
|
@ -68,8 +68,6 @@
|
||||||
|
|
||||||
* {
|
* {
|
||||||
font-family: Montserrat, sans-serif;
|
font-family: Montserrat, sans-serif;
|
||||||
color: $text-color;
|
|
||||||
|
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
@ -77,45 +75,12 @@
|
||||||
|
|
||||||
body {
|
body {
|
||||||
background: $background;
|
background: $background;
|
||||||
|
color: $text-color;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
header {
|
|
||||||
}
|
|
||||||
|
|
||||||
main {
|
|
||||||
width: 100%;
|
|
||||||
max-width: $large;
|
|
||||||
margin: 0 auto;
|
|
||||||
|
|
||||||
flex-grow: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
footer {
|
|
||||||
border-top: 1px solid #666;
|
|
||||||
font-size: 0.9em;
|
|
||||||
color: $text-darker;
|
|
||||||
|
|
||||||
width: 100%;
|
|
||||||
max-width: $large;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding: 0.5em;
|
|
||||||
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
@media screen and (min-width: $small) {
|
|
||||||
flex-direction: row;
|
|
||||||
|
|
||||||
& > :first-child {
|
|
||||||
margin-left: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6, p, ul {
|
h1, h2, h3, h4, h5, h6, p, ul {
|
||||||
margin-top: 0.5em;
|
margin-top: 0.5em;
|
||||||
padding: 0 0.5rem;
|
padding: 0 0.5rem;
|
||||||
|
@ -129,8 +94,22 @@ h1, h2, h3, h4, h5, h6 {
|
||||||
@include heading;
|
@include heading;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1, footer {
|
||||||
border-bottom: 2px $text-color solid;
|
padding-bottom: 0.2em;
|
||||||
|
background: repeat-x center bottom / 250px 4px;
|
||||||
|
background-image: linear-gradient(
|
||||||
|
to right,
|
||||||
|
$primary-3 0%, $primary-3 10%,
|
||||||
|
$primary-1 10%, $primary-1 20%,
|
||||||
|
$primary-2 20%, $primary-2 30%,
|
||||||
|
$primary-3 30%, $primary-3 40%,
|
||||||
|
$primary-2 40%, $primary-2 50%,
|
||||||
|
$primary-3 50%, $primary-3 60%,
|
||||||
|
$primary-1 60%, $primary-1 70%,
|
||||||
|
$primary-3 70%, $primary-3 80%,
|
||||||
|
$primary-1 80%, $primary-1 90%,
|
||||||
|
$primary-2 90%, $primary-2 100%
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
a:not(.nav-logo) {
|
a:not(.nav-logo) {
|
||||||
|
@ -157,6 +136,36 @@ a:not(.nav-logo) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
width: 100%;
|
||||||
|
max-width: $large;
|
||||||
|
margin: 0 auto;
|
||||||
|
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
background-position: right top;
|
||||||
|
font-size: 0.9em;
|
||||||
|
color: $text-darker;
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
max-width: $large;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0.5em;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
@media screen and (min-width: $small) {
|
||||||
|
flex-direction: row;
|
||||||
|
|
||||||
|
& > :first-child {
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
figure {
|
figure {
|
||||||
margin: 1rem 0;
|
margin: 1rem 0;
|
||||||
|
|
Loading…
Reference in New Issue