Adding font
This commit is contained in:
parent
2b600b8ba7
commit
759b943e95
18 changed files with 147 additions and 21 deletions
6
.gitattributes
vendored
Normal file
6
.gitattributes
vendored
Normal file
|
@ -0,0 +1,6 @@
|
||||||
|
**.png filter=lfs diff=lfs merge=lfs -text
|
||||||
|
**.jpg filter=lfs diff=lfs merge=lfs -text
|
||||||
|
**.jpeg filter=lfs diff=lfs merge=lfs -text
|
||||||
|
**.ttf filter=lfs diff=lfs merge=lfs -text
|
||||||
|
**.woff filter=lfs diff=lfs merge=lfs -text
|
||||||
|
**.ico filter=lfs diff=lfs merge=lfs -text
|
BIN
assets/favicon.ico
(Stored with Git LFS)
Normal file
BIN
assets/favicon.ico
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
assets/fonts/lato_italic_400.ttf
(Stored with Git LFS)
Normal file
BIN
assets/fonts/lato_italic_400.ttf
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
assets/fonts/lato_italic_700.ttf
(Stored with Git LFS)
Normal file
BIN
assets/fonts/lato_italic_700.ttf
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
assets/fonts/lato_italic_900.ttf
(Stored with Git LFS)
Normal file
BIN
assets/fonts/lato_italic_900.ttf
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
assets/fonts/lato_normal_400.ttf
(Stored with Git LFS)
Normal file
BIN
assets/fonts/lato_normal_400.ttf
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
assets/fonts/lato_normal_700.ttf
(Stored with Git LFS)
Normal file
BIN
assets/fonts/lato_normal_700.ttf
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
assets/fonts/lato_normal_900.ttf
(Stored with Git LFS)
Normal file
BIN
assets/fonts/lato_normal_900.ttf
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
assets/fonts/mochiypoppone.ttf
(Stored with Git LFS)
Normal file
BIN
assets/fonts/mochiypoppone.ttf
(Stored with Git LFS)
Normal file
Binary file not shown.
52
assets/scss/_fonts.scss
Normal file
52
assets/scss/_fonts.scss
Normal file
|
@ -0,0 +1,52 @@
|
||||||
|
|
||||||
|
// 'Mochiy Pop P One' font
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Mochiy Pop P One';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
src: url(/fonts/mochiypoppone.ttf) format('truetype');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Lato font
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Lato';
|
||||||
|
font-style: italic;
|
||||||
|
font-weight: 400;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/fonts/lato_italic_400.ttf) format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Lato';
|
||||||
|
font-style: italic;
|
||||||
|
font-weight: 700;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/fonts/lato_italic_700.ttf) format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Lato';
|
||||||
|
font-style: italic;
|
||||||
|
font-weight: 900;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/fonts/lato_italic_900.ttf) format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Lato';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/fonts/lato_normal_400.ttf) format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Lato';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 700;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/fonts/lato_normal_700.ttf) format('truetype');
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Lato';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 900;
|
||||||
|
font-display: swap;
|
||||||
|
src: url(/fonts/lato_normal_900.ttf) format('truetype');
|
||||||
|
}
|
|
@ -1,6 +1,14 @@
|
||||||
footer {
|
footer {
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
background: $background_accent_1;
|
background: $background_accent_2;
|
||||||
padding: 20px 30px;
|
padding: 20px 30px;
|
||||||
box-shadow: 5px 5px 5px 10px $background_accent_1;
|
font-size: $font_size_default;
|
||||||
|
color: $font_default;
|
||||||
|
text-align: center;
|
||||||
|
a {
|
||||||
|
color: $font_accent_4;
|
||||||
|
}
|
||||||
|
a:hover {
|
||||||
|
color: $font_accent_3;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,21 +1,13 @@
|
||||||
body {
|
body {
|
||||||
font-family: 'Verdana', sans-serif;
|
font-family: 'Lato', sans-serif;
|
||||||
margin: 25px 25px 50px 25px;
|
margin: 25px 25px 50px 25px;
|
||||||
background: $background_accent_2;
|
background: $background_accent_2;
|
||||||
color: $font_default;
|
a {
|
||||||
}
|
|
||||||
|
|
||||||
h1, h2 {
|
|
||||||
color: $font_accent_3;
|
|
||||||
text-shadow: 0px 0px 1px black;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: $font_accent_2;
|
color: $font_accent_2;
|
||||||
}
|
}
|
||||||
|
a:hover {
|
||||||
a:hover {
|
|
||||||
color: $font_accent_3;
|
color: $font_accent_3;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.left {
|
.left {
|
||||||
|
|
|
@ -1,16 +1,18 @@
|
||||||
header {
|
header {
|
||||||
margin: 0 auto;
|
margin: -25px -25px 0px -25px;
|
||||||
background: $background_accent_1;
|
background: $background_accent_1;
|
||||||
padding: 20px 30px;
|
padding: 20px 30px;
|
||||||
box-shadow: 5px 5px 5px 10px $background_accent_1;
|
box-shadow: 5px 5px 5px 10px $background_accent_1;
|
||||||
h1, h1 a, h1 a:hover, h1 a:link {
|
h1 a, h1 a:hover, h1 a:link {
|
||||||
|
font-family: 'Mochiy Pop P One', sans-serif;
|
||||||
color: $font_accent_1;
|
color: $font_accent_1;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-weight: normal;
|
font-weight: bold;
|
||||||
font-size: 42px;
|
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
font-size: $font_size_h1;
|
||||||
}
|
}
|
||||||
nav ul {
|
nav ul {
|
||||||
|
font-size: $font_size_default;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
|
@ -2,4 +2,23 @@ div.page {
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 20px 30px;
|
padding: 20px 30px;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
|
p, a{
|
||||||
|
color: $font_default;
|
||||||
|
font-size: $font_size_default;
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
color: $font_accent_4;
|
||||||
|
font-size: $font_size_code;
|
||||||
|
}
|
||||||
|
h1 {
|
||||||
|
color: $font_accent_3;
|
||||||
|
font-size: $font_size_h1;
|
||||||
|
text-shadow: 0px 0px 1px black;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
color: $font_accent_3;
|
||||||
|
font-size: $font_size_h2;
|
||||||
|
text-shadow: 0px 0px 1px black;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -14,4 +14,19 @@ div.start {
|
||||||
max-height: 7dh;
|
max-height: 7dh;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
p, a{
|
||||||
|
color: $font_default;
|
||||||
|
font-size: $font_size_default;
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
color: $font_accent_4;
|
||||||
|
font-size: $font_size_code;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
color: $font_accent_3;
|
||||||
|
font-size: $font_size_h2;
|
||||||
|
text-shadow: 0px 0px 1px black;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,4 +4,10 @@ $background_accent_2: black;
|
||||||
$font_accent_1: red;
|
$font_accent_1: red;
|
||||||
$font_accent_2: maroon;
|
$font_accent_2: maroon;
|
||||||
$font_accent_3: orangered;
|
$font_accent_3: orangered;
|
||||||
|
$font_accent_4: rgb(247, 196, 24 );
|
||||||
$font_default: white;
|
$font_default: white;
|
||||||
|
|
||||||
|
$font_size_default: 1.5em;
|
||||||
|
$font_size_code: 1.7em;
|
||||||
|
$font_size_h1: 3em;
|
||||||
|
$font_size_h2: 2.3em;
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
@import "_variables";
|
@import "_variables";
|
||||||
|
@import "_fonts";
|
||||||
|
|
||||||
@import "_page.scss";
|
@import "_page.scss";
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
@import "_variables";
|
@import "_variables";
|
||||||
|
@import "_fonts";
|
||||||
|
|
||||||
@import "_start";
|
@import "_start";
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue