andras/schmelczer-dev
1
0
Fork 0
Code Issues Pull requests 6 Projects Releases Packages Wiki Activity Actions

PC styles done

Browse source
This commit is contained in:
Schmelczer András 2019-12-28 20:51:43 +01:00
parent 98160edc72
commit 632a7703ff
49 changed files with 1545 additions and 1267 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/style/a.scss
View file

@ -13,13 +13,14 @@ a {
$border-shift: 10px;
transition: transform $slow-transition-time;
$dot-size: 4px;
&:before {
content: "";
display: block;
position: absolute;
width: 100%;
height: $line-width;
height: $dot-size;
bottom: 0;
z-index: 1;
background: linear-gradient(
@ -36,7 +37,7 @@ a {
display: block;
width: calc(100% + #{$border-shift});
z-index: 0;
border-bottom: $line-width dotted $accent-color;
border-bottom: $dot-size dotted $accent-color;
transition: transform $slow-transition-time;
}

63
src/style/fonts.scss
View file

@ -1,68 +1,59 @@
/* raleway-regular - latin_latin-ext */
/* lato-regular - latin */
@font-face {
font-family: "Raleway";
font-family: "Lato";
font-style: normal;
font-weight: 400;
src: url("../static/fonts/raleway/raleway-v14-latin_latin-ext-regular.eot"); /* IE9 Compat Modes */
src: local("Raleway"), local("Raleway-Regular"),
url("../static/fonts/raleway/raleway-v14-latin_latin-ext-regular.eot?#iefix")
src: url("../static/fonts/lato/lato-v16-latin-regular.eot"); /* IE9 Compat Modes */
src: local("Lato Regular"), local("Lato-Regular"),
url("../static/fonts/lato/lato-v16-latin-regular.eot?#iefix")
format("embedded-opentype"),
/* IE6-IE8 */
url("../static/fonts/raleway/raleway-v14-latin_latin-ext-regular.woff2")
/* IE6-IE8 */ url("../static/fonts/lato/lato-v16-latin-regular.woff2")
format("woff2"),
/* Super Modern Browsers */
url("../static/fonts/raleway/raleway-v14-latin_latin-ext-regular.woff")
format("woff"),
/* Modern Browsers */
url("../static/fonts/raleway/raleway-v14-latin_latin-ext-regular.ttf")
url("../static/fonts/lato/lato-v16-latin-regular.woff") format("woff"),
/* Modern Browsers */ url("../static/fonts/lato/lato-v16-latin-regular.ttf")
format("truetype"),
/* Safari, Android, iOS */
url("../static/fonts/raleway/raleway-v14-latin_latin-ext-regular.svg#Raleway")
format("svg"); /* Legacy iOS */
url("../static/fonts/lato/lato-v16-latin-regular.svg#Lato") format("svg"); /* Legacy iOS */
}
/* open-sans-italic - latin-ext_latin */
/* lato-italic - latin */
@font-face {
font-family: "Open Sans";
font-family: "Lato";
font-style: italic;
font-weight: 400;
src: url("../static/fonts/open_sans_italic/open-sans-v17-latin-ext_latin-italic.eot"); /* IE9 Compat Modes */
src: local("Open Sans Italic"), local("OpenSans-Italic"),
url("../static/fonts/open_sans_italic/open-sans-v17-latin-ext_latin-italic.eot?#iefix")
src: url("../static/fonts/lato/lato-v16-latin-italic.eot"); /* IE9 Compat Modes */
src: local("Lato Italic"), local("Lato-Italic"),
url("../static/fonts/lato/lato-v16-latin-italic.eot?#iefix")
format("embedded-opentype"),
/* IE6-IE8 */
url("../static/fonts/open_sans_italic/open-sans-v17-latin-ext_latin-italic.woff2")
/* IE6-IE8 */ url("../static/fonts/lato/lato-v16-latin-italic.woff2")
format("woff2"),
/* Super Modern Browsers */
url("../static/fonts/open_sans_italic/open-sans-v17-latin-ext_latin-italic.woff")
format("woff"),
/* Modern Browsers */
url("../static/fonts/open_sans_italic/open-sans-v17-latin-ext_latin-italic.ttf")
url("../static/fonts/lato/lato-v16-latin-italic.woff") format("woff"),
/* Modern Browsers */ url("../static/fonts/lato/lato-v16-latin-italic.ttf")
format("truetype"),
/* Safari, Android, iOS */
url("../static/fonts/open_sans_italic/open-sans-v17-latin-ext_latin-italic.svg#OpenSans")
format("svg"); /* Legacy iOS */
url("../static/fonts/lato/lato-v16-latin-italic.svg#Lato") format("svg"); /* Legacy iOS */
}
/* open-sans-regular - latin_latin-ext */
/* montserrat-regular - latin */
@font-face {
font-family: "Open Sans";
font-family: "Montserrat";
font-style: normal;
font-weight: 400;
src: url("../static/fonts/open_sans/open-sans-v17-latin_latin-ext-regular.eot"); /* IE9 Compat Modes */
src: local("Open Sans Regular"), local("OpenSans-Regular"),
url("../static/fonts/open_sans/open-sans-v17-latin_latin-ext-regular.eot?#iefix")
src: url("../static/fonts/montserrat/montserrat-v14-latin-regular.eot"); /* IE9 Compat Modes */
src: local("Montserrat Regular"), local("Montserrat-Regular"),
url("../static/fonts/montserrat/montserrat-v14-latin-regular.eot?#iefix")
format("embedded-opentype"),
/* IE6-IE8 */
url("../static/fonts/open_sans/open-sans-v17-latin_latin-ext-regular.woff2")
url("../static/fonts/montserrat/montserrat-v14-latin-regular.woff2")
format("woff2"),
/* Super Modern Browsers */
url("../static/fonts/open_sans/open-sans-v17-latin_latin-ext-regular.woff")
url("../static/fonts/montserrat/montserrat-v14-latin-regular.woff")
format("woff"),
/* Modern Browsers */
url("../static/fonts/open_sans/open-sans-v17-latin_latin-ext-regular.ttf")
url("../static/fonts/montserrat/montserrat-v14-latin-regular.ttf")
format("truetype"),
/* Safari, Android, iOS */
url("../static/fonts/open_sans/open-sans-v17-latin_latin-ext-regular.svg#OpenSans")
url("../static/fonts/montserrat/montserrat-v14-latin-regular.svg#Montserrat")
format("svg"); /* Legacy iOS */
}

29
src/style/mixins.scss
View file

@ -6,12 +6,12 @@
justify-content: center;
}
@mixin card() {
%card {
text-align: center;
border-radius: $border-radius;
padding: $normal-margin;
background-color: $card-color;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.125);
box-shadow: $shadow;
z-index: 1;
@media (max-width: $breakpoint-width) {
& {
@ -24,6 +24,21 @@
}
}
@mixin card() {
@extend %card;
background-color: $card-color;
}
@mixin important-card() {
@extend %card;
background-color: $accent-color;
* {
color: white;
}
}
@mixin square($size) {
width: $size;
height: $size;
@ -36,19 +51,21 @@
@mixin title-font() {
font: 400 3.5rem "Montserrat", serif;
font-style: normal;
line-height: 1;
}
@mixin sub-title-font() {
font: 400 1.9rem "Montserrat", serif;
font: 400 2rem "Montserrat", serif;
font-style: normal;
}
@mixin main-font() {
font: 400 1.25rem "Lato", sans-serif;
line-height: 1.6;
text-align: justify;
}
@mixin insignificant-font() {
font: 400 1rem "Lato", sans-serif;
font: 400 1.1rem "Lato", sans-serif;
font-style: italic;
}

10
src/style/vars.scss
View file

@ -14,27 +14,27 @@ $scrollbar-color: #ffd6d6;
$fast-transition-time: 220ms;
$slow-transition-time: 350ms;
$line-width: var(--line-width);
$border-radius: 5px;
$line-width: 3px;
$border-radius: 25px;
$breakpoint-width: 900px;
$normal-margin: var(--normal-margin);
$small-margin: var(--small-margin);
$line-height: 2ch;
$line-height: 18px;
$shadow: 0 0 5px rgba(0, 0, 0, 0.125);
$blur-radius: 9px;
$icon-size: var(--icon-size);
$body-width: var(--body-width);
:root {
--line-width: 3px;
--normal-margin: 45px;
--small-margin: 25px;
--icon-size: 35px;
--body-width: 765px;
@media (max-width: $breakpoint-width) {
--line-width: 2px;
--normal-margin: 35px;
--small-margin: 15px;
--icon-size: 20px;