phundrak/langue-phundrak-com
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Activity

more maintainable SCSS code

Browse Source
This commit is contained in:
Lucien Cartier-Tilet 2020-05-02 19:23:37 +02:00
parent b012489340
commit 0ad05ea1c4
Signed by: phundrak
GPG Key ID: BD7789E705CB8DCA
1 changed files with 11 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
web/style/style.scss
View File

@ -15,6 +15,10 @@
src: url("../fonts/HelveticaNeue.ttf");
}
/* Variables *****************************************************************/
$switch-title-size: "only screen and (max-width: 600px)";
// Themes /////////////////////////////////////////////////////////////////////
$dark: rgba( 52, 73, 94, 1);
@ -283,6 +287,9 @@ header {
.title {
font-size: 5em;
margin: 0;
@media #{$switch-title-size} {
font-size: 3em;
}
}
.subtitle {
@ -431,7 +438,7 @@ h1, h2, h3, h4, h5, h6 {
h2 {
font-size: 2.5em;
@media only screen and (max-width: 600px) {
@media #{$switch-title-size} {
font-size: 1.75em;
}
}
@ -439,7 +446,7 @@ h2 {
h3 {
font-size: 2em;
@media only screen and (max-width: 600px) {
@media #{$switch-title-size} {
font-size: 1.5em;
}
}
@ -447,7 +454,7 @@ h3 {
h4 {
font-size: 1.5em;
@media only screen and (max-width: 600px) {
@media #{$switch-title-size} {
font-size: 1.3em;
}
}
@ -455,7 +462,7 @@ h4 {
h5 {
font-size: 1.25em;
@media only screen and (max-width: 600px) {
@media #{$switch-title-size} {
font-size: 1.2em;
}
}