make logo small, add heading, add font for heading

This commit is contained in:
Thefeli73 2020-02-17 23:42:06 +01:00
parent fa5c9a118d
commit 6d079445b7
5 changed files with 12 additions and 3 deletions

View File

@ -64,7 +64,8 @@
} }
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
font-weight: _font(weight); font-family: _font(family2);
font-weight: _font(weight2);
line-height: 1.5; line-height: 1.5;
margin: 0 0 (_size(element-margin) * 0.35) 0; margin: 0 0 (_size(element-margin) * 0.35) 0;
letter-spacing: _font(letter-spacing); letter-spacing: _font(letter-spacing);

View File

@ -5,7 +5,10 @@
top: 80px; top: 80px;
position: absolute; position: absolute;
> #logo > img {
height: 140pt;
width: auto;
}
/* /*
@include breakpoint('<=xlarge') { @include breakpoint('<=xlarge') {

View File

@ -21,8 +21,10 @@
// Font. // Font.
$font: ( $font: (
family: ('Maven Pro', sans-serif), family: ('Maven Pro', sans-serif),
family2: ('Russo One', sans-serif),
family-fixed: ('Courier New', monospace), family-fixed: ('Courier New', monospace),
weight: 300, weight: 300,
weight2: 400,
weight-bold: 400, weight-bold: 400,
letter-spacing: -0.0025em letter-spacing: -0.0025em
); );

View File

@ -6,6 +6,7 @@
@import 'libs/html-grid'; @import 'libs/html-grid';
@import url('https://fonts.googleapis.com/css?family=Maven+Pro:400,700,800,900&display=swap'); @import url('https://fonts.googleapis.com/css?family=Maven+Pro:400,700,800,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Russo+One&display=swap');
// Breakpoints. // Breakpoints.
@ -44,7 +45,7 @@
@import 'layout/header'; @import 'layout/header';
@import 'layout/nav'; @import 'layout/nav';
@import 'layout/footer'; @import 'layout/footer';
body { body {
background: #f2f2f2; background: #f2f2f2;
} }

View File

@ -81,6 +81,8 @@
<source srcset="/img/logo/logo@0.25x.png" type="image/png"> <source srcset="/img/logo/logo@0.25x.png" type="image/png">
<img src="/img/logo/logo@0.25x.png" alt="Schulze Studio logo"> <img src="/img/logo/logo@0.25x.png" alt="Schulze Studio logo">
</picture> </picture>
<h1>Schulze</h1>
<h1>Studio</h1>
</header> </header>
<div id="main"> <div id="main">