diff --git a/color-test.html b/color-test.html index c4619ef..fa34574 100644 --- a/color-test.html +++ b/color-test.html @@ -15,7 +15,6 @@ - diff --git a/css/clear-typography.css b/css/clear-typography.css deleted file mode 100644 index 324673d..0000000 --- a/css/clear-typography.css +++ /dev/null @@ -1,257 +0,0 @@ -/* ------------------ FONT LOADING ------------------- */ -@font-face { - font-family: 'OpenSans'; - src: url("../fonts/OpenSans-Light-webfont.eot"); - src: url("../fonts/OpenSans-Light-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Light-webfont.woff2") format("woff2"), url("../fonts/OpenSans-Light-webfont.woff") format("woff"), url("../fonts/OpenSans-Light-webfont.ttf") format("truetype"), url("../fonts/OpenSans-Light-webfont.svg#open_sansbold") format("svg"); - font-weight: 300; - font-style: normal; } - -@font-face { - font-family: 'OpenSans'; - src: url("../fonts/OpenSans-LightItalic-webfont.eot"); - src: url("../fonts/OpenSans-LightItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-LightItalic-webfont.woff2") format("woff2"), url("../fonts/OpenSans-LightItalic-webfont.woff") format("woff"), url("../fonts/OpenSans-LightItalic-webfont.ttf") format("truetype"), url("../fonts/OpenSans-LightItalic-webfont.svg#open_sansbold") format("svg"); - font-weight: 300; - font-style: italic; } - -@font-face { - font-family: 'OpenSans'; - src: url("../fonts/OpenSans-Regular-webfont.eot"); - src: url("../fonts/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Regular-webfont.woff2") format("woff2"), url("../fonts/OpenSans-Regular-webfont.woff") format("woff"), url("../fonts/OpenSans-Regular-webfont.ttf") format("truetype"), url("../fonts/OpenSans-Regular-webfont.svg#open_sansbold") format("svg"); - font-weight: 400; - font-style: normal; } - -@font-face { - font-family: 'OpenSans'; - src: url("../fonts/OpenSans-Italic-webfont.eot"); - src: url("../fonts/OpenSans-Italic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Italic-webfont.woff2") format("woff2"), url("../fonts/OpenSans-Italic-webfont.woff") format("woff"), url("../fonts/OpenSans-Italic-webfont.ttf") format("truetype"), url("../fonts/OpenSans-Italic-webfont.svg#open_sansbold") format("svg"); - font-weight: 400; - font-style: italic; } - -@font-face { - font-family: 'OpenSans'; - src: url("../fonts/OpenSans-Semibold-webfont.eot"); - src: url("../fonts/OpenSans-Semibold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Semibold-webfont.woff2") format("woff2"), url("../fonts/OpenSans-Semibold-webfont.woff") format("woff"), url("../fonts/OpenSans-Semibold-webfont.ttf") format("truetype"), url("../fonts/OpenSans-Semibold-webfont.svg#open_sansbold") format("svg"); - font-weight: 600; - font-style: normal; } - -@font-face { - font-family: 'OpenSans'; - src: url("../fonts/OpenSans-SemiboldItalic-webfont.eot"); - src: url("../fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-SemiboldItalic-webfont.woff2") format("woff2"), url("../fonts/OpenSans-SemiboldItalic-webfont.woff") format("woff"), url("../fonts/OpenSans-SemiboldItalic-webfont.ttf") format("truetype"), url("../fonts/OpenSans-SemiboldItalic-webfont.svg#open_sansbold") format("svg"); - font-weight: 600; - font-style: italic; } - -@font-face { - font-family: 'OpenSans'; - src: url("../fonts/OpenSans-Bold-webfont.eot"); - src: url("../fonts/OpenSans-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Bold-webfont.woff2") format("woff2"), url("../fonts/OpenSans-Bold-webfont.woff") format("woff"), url("../fonts/OpenSans-Bold-webfont.ttf") format("truetype"), url("../fonts/OpenSans-Bold-webfont.svg#open_sansbold") format("svg"); - font-weight: 700; - font-style: normal; } - -@font-face { - font-family: 'OpenSans'; - src: url("../fonts/OpenSans-BoldItalic-webfont.eot"); - src: url("../fonts/OpenSans-BoldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-BoldItalic-webfont.woff2") format("woff2"), url("../fonts/OpenSans-BoldItalic-webfont.woff") format("woff"), url("../fonts/OpenSans-BoldItalic-webfont.ttf") format("truetype"), url("../fonts/OpenSans-BoldItalic-webfont.svg#open_sansbold") format("svg"); - font-weight: 700; - font-style: italic; } - -@font-face { - font-family: 'OpenSans'; - src: url("../fonts/OpenSans-ExtraBold-webfont.eot"); - src: url("../fonts/OpenSans-ExtraBold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-ExtraBold-webfont.woff2") format("woff2"), url("../fonts/OpenSans-ExtraBold-webfont.woff") format("woff"), url("../fonts/OpenSans-ExtraBold-webfont.ttf") format("truetype"), url("../fonts/OpenSans-ExtraBold-webfont.svg#open_sansbold") format("svg"); - font-weight: 800; - font-style: normal; } - -@font-face { - font-family: 'OpenSans'; - src: url("../fonts/OpenSans-ExtraBoldItalic-webfont.eot"); - src: url("../fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-ExtraBoldItalic-webfont.woff2") format("woff2"), url("../fonts/OpenSans-ExtraBoldItalic-webfont.woff") format("woff"), url("../fonts/OpenSans-ExtraBoldItalic-webfont.ttf") format("truetype"), url("../fonts/OpenSans-ExtraBoldItalic-webfont.svg#open_sansbold") format("svg"); - font-weight: 800; - font-style: italic; } - -/* ------------------ GLOBAL STYLE ------------------- */ -body { - font-family: OpenSans, sans-serif; - text-align: left; - font-size: 4mm; - line-height: 1.5em; - color: #444; - font-weight: 400; } - -.night-mode { - color: #BBB; } - -strong { - font-weight: 600; } - -em { - font-style: italic; } - -a { - color: #2484c1; - text-decoration: none; } - -p { - padding: 0; - padding-bottom: 1.5em; - margin: 0; } - p:last-child { - padding-bottom: 0; } - -ul { - padding: 0; - padding-bottom: 1.5em; - margin: 0; } - ul ul { - padding-bottom: 0; } - ul li { - margin-left: 1.5em; } - -ol { - padding: 0; - padding-bottom: 1.5em; - margin: 0; } - ol ol { - padding-bottom: 0; } - ol li { - margin-left: 1.5em; } - -::selection { - background: #2484c1; - color: #fff; } - -::-moz-selection { - background: #2484c1; - color: #fff; } - -/* ------------------ WRAPPERS ------------------- */ -.text-wrapper { - font-size: calc(2.5mm + 1vw); - margin: auto; - line-height: 1.5em; } - .text-wrapper.debug { - background-image: -webkit-linear-gradient(transparent 95%, rgba(159, 96, 96, 0.5) 95%); - background-image: -moz-linear-gradient(transparent 95%, rgba(159, 96, 96, 0.5) 95%); - background-image: -ms-linear-gradient(transparent 95%, rgba(159, 96, 96, 0.5) 95%); - background-image: -o-linear-gradient(transparent 95%, rgba(159, 96, 96, 0.5) 95%); - background-image: linear-gradient(transparent 95%, rgba(159, 96, 96, 0.5) 95%); - background-position: 50% 0; - background-size: 1.5em 1.5em; } - -@media screen and (min-width: 640px) { - .text-wrapper.size-640 { - max-width: 640px; - font-size: calc(2.5mm + 6.4px); } } - -@media screen and (min-width: 800px) { - .text-wrapper.size-800 { - font-size: calc(2.5mm + 8.0px); - max-width: 800px; } } - -@media screen and (min-width: 920px) { - .text-wrapper.size-920 { - font-size: calc(2.5mm + 9.2px); - max-width: 800px; } } - -@media screen and (min-width: 1200px) { - .text-wrapper.size-1200 { - font-size: calc(2.5mm + 12px); - max-width: 800px; } } - -/* ------------------ TITLES ------------------- */ -h1, h2, h3, h4, h5, h6, h7 { - text-align: left; - font-size: 1em; - line-height: 1.5em; - padding: 0; - margin: 0; - font-weight: 400; } - -h1 { - font-size: 2.33333em; - line-height: 1em; - padding: 0.33333em 0 0.6em 0; - font-weight: 700; } - -h2 { - font-size: 2em; - line-height: 1.5em; - padding: 0.33333em 0 0.4em 0; - font-weight: 700; } - -h3 { - font-size: 1.5em; - line-height: 1em; - padding: 0em 0 1em 0; - font-weight: 700; } - -h4 { - font-size: 1.5em; - line-height: 1em; - padding: 0em 0 1em 0; - font-weight: 600; } - -h5 { - font-size: 1.33333em; - line-height: 1em; - padding: 0.1em 0 1.13333em 0; - font-weight: 600; } - -h6 { - font-size: 1.1em; - line-height: 1.4em; - padding: 0.1em 0 1.2em 0; - font-weight: 600; } - -/* ------------------ HR ------------------- */ -hr { - border-top: 0px; - border-left: 0px; - border-right: 0px; - border-bottom: 1px; - border-color: rgba(1, 1, 1, 0.15); - border-style: solid; - margin: 1.5em; } - -/* ------------------ QUOTE ------------------- */ -blockquote { - border-width: 0 0 0 0.2em; - border-style: solid; - border-radius: 3px; - margin: -0.75em -0.2em 0.75em -0.2em; - padding: 0.75em 1em 0.75em 1em; - max-width: 100%; - border-color: rgba(1, 1, 1, 0.15); } - .night-mode blockquote { - border-color: rgba(255, 255, 255, 0.15); } - -pre { - border-width: 0 0 0 0.2em; - border-style: solid; - border-radius: 3px; - margin: -0.75em -0.2em 0.75em -0.2em; - padding: 0.75em 1em 0.75em 1em; - max-width: 100%; - border-color: rgba(1, 1, 1, 0.2); - background-color: #EEE; - overflow-x: scroll; } - .night-mode pre { - background-color: #222; - border-color: rgba(255, 255, 255, 0.2); } - -/* ------------------ SPECIAL STYLING ------------------- */ -mark { - border-radius: 0.2em; - padding: 0 0.2em 0 0.2em; - background-color: rgba(255, 255, 0, 0.33); - color: inherit; } - -.night-mode mark { - background-color: rgba(128, 128, 0, 0.66); } - -/* ------------------ SPECIAL STYLING ------------------- */ -.time { - font-style: italic; - text-align: right; - width: 100%; - display: block; } diff --git a/css/style.css b/css/style.css index 10a8ea4..0718842 100644 --- a/css/style.css +++ b/css/style.css @@ -161,6 +161,395 @@ blockquote, pre { color: #859900; } +/* + * 2 - Typography ( _typography.scss ) + * + * This part of the (s)css handle everything related to the typography + * like paragraphs, blockquote, etc. + * +*/ +/* 2.1 - Font Face */ +/* 2.1.1 - OpenSans */ +@font-face { + font-family: "OpenSans"; + src: url("fonts/OpenSans-Light-webfont.eot"); + src: url("fonts/OpenSans-Light-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-Light-webfont.woff2") format("woff2"), url("fonts/OpenSans-Light-webfont.woff") format("woff"), url("fonts/OpenSans-Light-webfont.ttf") format("truetype"), url("fonts/OpenSans-Light-webfont.svg#open_sansbold") format("svg"); + font-weight: 300; + font-style: normal; +} +@font-face { + font-family: "OpenSans"; + src: url("fonts/OpenSans-LightItalic-webfont.eot"); + src: url("fonts/OpenSans-LightItalic-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-LightItalic-webfont.woff2") format("woff2"), url("fonts/OpenSans-LightItalic-webfont.woff") format("woff"), url("fonts/OpenSans-LightItalic-webfont.ttf") format("truetype"), url("fonts/OpenSans-LightItalic-webfont.svg#open_sansbold") format("svg"); + font-weight: 300; + font-style: italic; +} +@font-face { + font-family: "OpenSans"; + src: url("fonts/OpenSans-Regular-webfont.eot"); + src: url("fonts/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-Regular-webfont.woff2") format("woff2"), url("fonts/OpenSans-Regular-webfont.woff") format("woff"), url("fonts/OpenSans-Regular-webfont.ttf") format("truetype"), url("fonts/OpenSans-Regular-webfont.svg#open_sansbold") format("svg"); + font-weight: 400; + font-style: normal; +} +@font-face { + font-family: "OpenSans"; + src: url("fonts/OpenSans-Italic-webfont.eot"); + src: url("fonts/OpenSans-Italic-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-Italic-webfont.woff2") format("woff2"), url("fonts/OpenSans-Italic-webfont.woff") format("woff"), url("fonts/OpenSans-Italic-webfont.ttf") format("truetype"), url("fonts/OpenSans-Italic-webfont.svg#open_sansbold") format("svg"); + font-weight: 400; + font-style: italic; +} +@font-face { + font-family: "OpenSans"; + src: url("fonts/OpenSans-Semibold-webfont.eot"); + src: url("fonts/OpenSans-Semibold-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-Semibold-webfont.woff2") format("woff2"), url("fonts/OpenSans-Semibold-webfont.woff") format("woff"), url("fonts/OpenSans-Semibold-webfont.ttf") format("truetype"), url("fonts/OpenSans-Semibold-webfont.svg#open_sansbold") format("svg"); + font-weight: 600; + font-style: normal; +} +@font-face { + font-family: "OpenSans"; + src: url("fonts/OpenSans-SemiboldItalic-webfont.eot"); + src: url("fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-SemiboldItalic-webfont.woff2") format("woff2"), url("fonts/OpenSans-SemiboldItalic-webfont.woff") format("woff"), url("fonts/OpenSans-SemiboldItalic-webfont.ttf") format("truetype"), url("fonts/OpenSans-SemiboldItalic-webfont.svg#open_sansbold") format("svg"); + font-weight: 600; + font-style: italic; +} +@font-face { + font-family: "OpenSans"; + src: url("fonts/OpenSans-Bold-webfont.eot"); + src: url("fonts/OpenSans-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-Bold-webfont.woff2") format("woff2"), url("fonts/OpenSans-Bold-webfont.woff") format("woff"), url("fonts/OpenSans-Bold-webfont.ttf") format("truetype"), url("fonts/OpenSans-Bold-webfont.svg#open_sansbold") format("svg"); + font-weight: 700; + font-style: normal; +} +@font-face { + font-family: "OpenSans"; + src: url("fonts/OpenSans-BoldItalic-webfont.eot"); + src: url("fonts/OpenSans-BoldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-BoldItalic-webfont.woff2") format("woff2"), url("fonts/OpenSans-BoldItalic-webfont.woff") format("woff"), url("fonts/OpenSans-BoldItalic-webfont.ttf") format("truetype"), url("fonts/OpenSans-BoldItalic-webfont.svg#open_sansbold") format("svg"); + font-weight: 700; + font-style: italic; +} +@font-face { + font-family: "OpenSans"; + src: url("fonts/OpenSans-ExtraBold-webfont.eot"); + src: url("fonts/OpenSans-ExtraBold-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-ExtraBold-webfont.woff2") format("woff2"), url("fonts/OpenSans-ExtraBold-webfont.woff") format("woff"), url("fonts/OpenSans-ExtraBold-webfont.ttf") format("truetype"), url("fonts/OpenSans-ExtraBold-webfont.svg#open_sansbold") format("svg"); + font-weight: 800; + font-style: normal; +} +@font-face { + font-family: "OpenSans"; + src: url("fonts/OpenSans-ExtraBoldItalic-webfont.eot"); + src: url("fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/OpenSans-ExtraBoldItalic-webfont.woff2") format("woff2"), url("fonts/OpenSans-ExtraBoldItalic-webfont.woff") format("woff"), url("fonts/OpenSans-ExtraBoldItalic-webfont.ttf") format("truetype"), url("fonts/OpenSans-ExtraBoldItalic-webfont.svg#open_sansbold") format("svg"); + font-weight: 800; + font-style: italic; +} +/* 2.2 - Global Typography */ +body { + font-family: OpenSans, sans-serif; + text-align: left; + font-size: 4.5mm; + line-height: 1.5em; + color: #073642; + font-weight: 400; +} + +.night-mode { + color: #eee8d5; +} + +strong { + font-weight: 600; +} + +em { + font-style: italic; +} + +a { + color: #268bd2; + text-decoration: none; +} +a:hover, a:active { + color: #268bd2; +} + +p { + padding: 0; + padding-bottom: 1.5em; + margin: 0; +} +p:last-child { + padding-bottom: 0; +} + +ul { + padding: 0; + padding-bottom: 1.5em; + margin: 0; +} +ul ul { + padding-bottom: 0; +} +ul li { + margin-left: 1.5em; +} + +ol { + padding: 0; + padding-bottom: 1.5em; + margin: 0; +} +ol ol { + padding-bottom: 0; +} +ol li { + margin-left: 1.5em; +} + +::selection { + background: #268bd2; + color: #fdf6e3; +} + +::-moz-selection { + background: #268bd2; + color: #fdf6e3; +} + +/* 2.2 - Text Wrapper */ +.article-content { + font-size: calc(4mm + 0.4vw); + line-height: 1.5em; + padding: 1em; + font-weight: 300; +} +.article-content p, .article-content em, .article-content p em { + font-weight: 300; +} +.article-content img { + max-width: 100%; + height: auto; +} +.article-content .article-thumbnail { + padding-bottom: 1em; + text-align: center; +} +.article-content .article-thumbnail img { + max-width: 100%; + height: auto; +} +.article-content .article-excerpt { + padding: 0.5em 0.5em 0.5em 0.5em; + font-style: italic; + font-size: calc(3.5mm + 0.4vw); +} +.article-content .article-author { + margin: 0; + padding: 0; +} +.article-content .article-author .card-meta { + margin: 0; +} +.article-content .bypass-flex-fontsize { + font-size: 4mm; + line-height: 1.5em; +} + +/* 2.3 - Titles */ +h1, h2, h3, h4, h5, h6, h7 { + font-family: OpenSans; + text-align: left; + font-size: 1em; + line-height: 1.5em; + padding: 0; + margin: 0; + font-weight: 400; +} +h1.page-title, h2.page-title, h3.page-title, h4.page-title, h5.page-title, h6.page-title, h7.page-title { + font-family: OpenSans; + color: #6c71c4; + font-weight: 300; + margin-bottom: 0.5em; + padding: 0; +} +h1.page-title i, h2.page-title i, h3.page-title i, h4.page-title i, h5.page-title i, h6.page-title i, h7.page-title i { + font-size: 0.55em; + position: relative; + top: -0.175em; +} +h1.page-title-flex, h2.page-title-flex, h3.page-title-flex, h4.page-title-flex, h5.page-title-flex, h6.page-title-flex, h7.page-title-flex { + display: flex; + flex-direction: row; + justify-content: space-between; +} +h1.page-title-flex > span, h1.page-title-flex > i, h1.page-title-flex > a, h2.page-title-flex > span, h2.page-title-flex > i, h2.page-title-flex > a, h3.page-title-flex > span, h3.page-title-flex > i, h3.page-title-flex > a, h4.page-title-flex > span, h4.page-title-flex > i, h4.page-title-flex > a, h5.page-title-flex > span, h5.page-title-flex > i, h5.page-title-flex > a, h6.page-title-flex > span, h6.page-title-flex > i, h6.page-title-flex > a, h7.page-title-flex > span, h7.page-title-flex > i, h7.page-title-flex > a { + display: block; +} +h1.page-title-flex > a, h2.page-title-flex > a, h3.page-title-flex > a, h4.page-title-flex > a, h5.page-title-flex > a, h6.page-title-flex > a, h7.page-title-flex > a { + color: #6c71c4; +} +h1.page-title-flex > a:hover, h1.page-title-flex > a:focus, h1.page-title-flex > a:active, h2.page-title-flex > a:hover, h2.page-title-flex > a:focus, h2.page-title-flex > a:active, h3.page-title-flex > a:hover, h3.page-title-flex > a:focus, h3.page-title-flex > a:active, h4.page-title-flex > a:hover, h4.page-title-flex > a:focus, h4.page-title-flex > a:active, h5.page-title-flex > a:hover, h5.page-title-flex > a:focus, h5.page-title-flex > a:active, h6.page-title-flex > a:hover, h6.page-title-flex > a:focus, h6.page-title-flex > a:active, h7.page-title-flex > a:hover, h7.page-title-flex > a:focus, h7.page-title-flex > a:active { + color: #484fb5; +} + +h1 { + font-size: 3em; + line-height: 1em; + padding: 0.5em 0 0.6em 0; + font-weight: 200; +} + +h2 { + font-size: 2em; + line-height: 1.5em; + padding: 0.333333em 0 0.4em 0; + font-weight: 700; +} + +h3 { + font-size: 1.5em; + line-height: 1em; + padding: 0em 0 1em 0; + font-weight: 700; +} + +h4 { + font-size: 1.5em; + line-height: 1em; + padding: 0em 0 1em 0; + font-weight: 600; +} + +h5 { + font-size: 1.333333em; + line-height: 1em; + padding: 0.1em 0 1.133333em 0; + font-weight: 600; +} + +h6 { + font-size: 1.1em; + line-height: 1.4em; + padding: 0.1em 0 1.2em 0; + font-weight: 600; +} + +/* 2.4 - hr */ +hr { + border-top: 0px; + border-left: 0px; + border-right: 0px; + border-bottom: 1px; + border-color: rgba(1, 1, 1, 0.15); + border-style: solid; + margin: 1.5em; +} + +/* 2.5 - Wells and quotes */ +blockquote, .quote, .well { + border-width: 0 0 0 0em; + border-style: none; + border-radius: 0px; + margin: -0.75em -0.2em 0.75em -0.2em; + padding: 0.75em 1em 0.75em 1em; + max-width: 100%; + background-color: #eee8d5; + font-style: italic; + color: #073642; +} + +pre, .pre, .well-pre { + border-width: 0 0 0 0em; + border-style: none; + border-radius: 0px; + margin: -0.75em -0.2em 0.75em -0.2em; + padding: 0.75em 1em 0.75em 1em; + max-width: 100%; + background-color: #eee8d5; + font-style: italic; + color: #073642; +} + +code { + background: transparent; + color: #dc322f; +} + +/* 2.6 - Special styling */ +mark { + border-radius: 0.2em; + padding: 0 0.2em 0 0.2em; + background-color: #ffd44f; + color: inherit; +} + +.night-mode mark { + background-color: #6c71c4; +} + +.time { + font-style: italic; + text-align: right; + width: 100%; + display: block; +} + +/* 2.6.1 - Colored texts */ +.text-blue { + color: #268bd2; +} +.text-violet { + color: #d33682; +} +.text-purple { + color: #6c71c4; +} +.text-red { + color: #dc322f; +} +.text-orange { + color: #cb4b16; +} +.text-green { + color: #859900; +} +.text-skyblue { + color: #2aa198; +} +.text-dark { + color: #002b36; +} +.text-light { + color: #fdf6e3; +} +.text-turquoise { + color: #2aa198; +} +.text-yellow { + color: #b58900; +} +.text-brown { + color: #b58900; +} +.text-grey { + color: #586e75; +} +.text-primary { + color: #6c71c4; +} +.text-secondary { + color: #268bd2; +} +.text-warning { + color: #cb4b16; +} +.text-danger { + color: #dc322f; +} +.text-info { + color: #2aa198; +} +.text-success { + color: #859900; +} + /* * 1. Cards and containers * All elements that are supposed to contain other stuff diff --git a/css/style.css.map b/css/style.css.map index cd2b552..fb4c346 100644 --- a/css/style.css.map +++ b/css/style.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../scss/_palette.scss","../scss/_global.scss","../scss/_cards.scss","../scss/_definitions.scss","../scss/_commons.scss","../scss/_buttons.scss"],"names":[],"mappings":"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","file":"style.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../scss/_palette.scss","../scss/_typography.scss","../scss/_font-face.scss","../scss/_global.scss","../scss/_cards.scss","../scss/_definitions.scss","../scss/_commons.scss","../scss/_buttons.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAkDA;EACI,OA9CS;;;AAiDb;EAdI;EACA,OA5BU;;;AA4Cd;EAjBI;EACA,OA5BU;;;AAgDd;EACI;;;AAGJ;EACI,cA3DW;;;AAgEf;AAGI;EAlCA;EACA,OA5BU;;AA8DV;EAnCA;EACA,OA5BU;;AA+DV;EApCA;EACA,OA5BU;;AAgEV;EArCA;EACA,OA5BU;;AAiEV;EAtCA;EACA,OA5BU;;AAkEV;EAvCA;EACA,OA5BU;;AAmEV;EAxCA;EACA,OA5BU;;AAoEV;EAzCA;EACA,OA5BU;;AAqEV;EA1CA;EACA,OA7BS;;AAuET;EA3CA;EACA,OA5BU;;AAuEV;EA5CA;EACA,OA5BU;;AAwEV;EA7CA;EACA,OA5BU;;AAyEV;EA9CA;EACA,OA5BU;;AA2EV;EAhDA;EACA,OA5BU;;AA4EV;EAjDA;EACA,OA5BU;;AA6EV;EAlDA;EACA,OA5BU;;AA8EV;EAnDA;EACA,OA5BU;;AA+EV;EApDA;EACA,OA5BU;;AAgFV;EArDA;EACA,OA5BU;;;AAmFZ;AAGE;EAtDA,OAxCS;;AA+FT;EAvDA,OAvCW;;AA+FX;EAxDA,OAtCW;;AA+FX;EAzDA,OArCQ;;AA+FR;EA1DA,OApCW;;AA+FX;EA3DA,OAnCU;;AA+FV;EA5DA,OAlCY;;AA+FZ;EA7DA,OAjCS;;AA+FT;EA9DA,OAhCU;;AA+FV;EA/DA,OA/Bc;;AA+Fd;EAhEA,OA9BW;;AA+FX;EAjEA,OA7BU;;AA+FV;EAlEA,OA5BS;;AAgGT;EApEA,OAtCW;;AA2GX;EArEA,OAxCS;;AA8GT;EAtEA,OApCW;;AA2GX;EAvEA,OArCQ;;AA6GR;EAxEA,OAlCY;;AA2GZ;EAzEA,OAnCU;;;ACVd;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA;AAKA;AAEA;EACI;EACA;EACA;EAKA;EACA;;AAGJ;EACI;EACA;EACA;EAKA;EACA;;AAGJ;EACI;EACA;EACA;EAKA;EACA;;AAGJ;EACI;EACA;EACA;EAKA;EACA;;AAGJ;EACI;EACA;EACA;EAKA;EACA;;AAGJ;EACI;EACA;EACA;EAKA;EACA;;AAGJ;EACI;EACA;EACA;EAKA;EACA;;AAGJ;EACI;EACA;EACA;EAKA;EACA;;AAGJ;EACI;EACA;EACA;EAKA;EACA;;AAGJ;EACI;EACA;EACA;EAKA;EACA;;ADlHJ;AAQA;EACC,aCjBU;EDkBV;EACA;EACA;EACA,ODJa;ECKb;;;AAGD;EACE,ODRa;;;ACWf;EACC;;;AAGD;EACC;;;AAGD;EACE,ODnCW;ECoCX;;AACA;EACE,ODtCS;;;AC0Cb;EAlCE;EACA;EACA;;AAkCA;EACE;;;AAIJ;EAzCE;EACA;EACA;;AAyCA;EACE;;AAEF;EACE;;;AAIJ;EAnDE;EACA;EACA;;AAmDA;EACE;;AAEF;EACE;;;AAKJ;EAAc,YDtED;ECsE+B,OD9D9B;;;AC+Dd;EAAmB,YDvEN;ECuEoC,OD/DnC;;;ACiEd;AAEA;EACE;EACA;EACA;EACA;;AACA;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AACA;EACE;EACA;;AAIJ;EACE;EACA;EACA;;AAEF;EACE;EACA;;AACA;EACE;;AAIJ;EACE;EACA;;;AAIJ;AASA;EACE;EACA;EACD;EACA;EACA;EACA;EACA;;AAEA;EACG;EACA,ODvIW;ECwIX;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;AACA;EACE;;AAGF;EACE,OD3JO;;AC4JP;EACE;;;AAOV;EA9CC,WA+CgB;EA9ChB,aA8CqB;EA7CrB;EACA,aA4CwC;;;AAGzC;EAlDC,WAmDgB;EAlDhB,aAkDqB;EAjDrB;EACA,aAgD+C;;;AAGhD;EAtDC,WAuDgB;EAtDhB,aAsDuB;EArDvB;EACA,aAoDsC;;;AAGvC;EA1DC,WA2DgB;EA1DhB,aA0DuB;EAzDvB;EACA,aAwDsC;;;AAGvC;EA9DC,WA+DgB;EA9DhB,aA8D4B;EA7D5B;EACA,aA4DoD;;;AAGrD;EAlEC,WAmEgB;EAlEhB,aAkEuB;EAjEvB;EACA,aAgE4C;;;AAG7C;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;AAgBA;EAbI;EACH;EACA;EAEA;EACA;EAEG;EACA,kBDtMW;ECuMX;EACA,ODzMU;;;ACgNd;EAjBI;EACH;EACA;EAEA;EACA;EAEG;EACA,kBDtMW;ECuMX;EACA,ODzMU;;;ACoNd;EACI;EACA,ODjOQ;;;ACsOZ;AAEA;EACE;EACA;EAEA;EACA;;;AAGF;EACE,kBDlPa;;;ACqPf;EACC;EACA;EACA;EACA;;;AAGD;AAOE;EAJA,ODjQW;;ACsQX;EALA,ODhQa;;ACsQb;EANA,OD/Pa;;ACsQb;EAPA,OD9PU;;ACsQV;EARA,OD7Pa;;ACsQb;EATA,OD5PY;;ACsQZ;EAVA,OD3Pc;;ACsQd;EAXA,OD1PW;;ACsQX;EAZA,ODzPY;;ACsQZ;EAbA,ODxPgB;;ACsQhB;EAdA,ODvPa;;ACsQb;EAfA,ODtPY;;ACsQZ;EAhBA,ODrPW;;ACuQX;EAlBA,OD/Pa;;ACkRb;EAnBA,ODjQW;;ACqRX;EApBA,OD7Pa;;ACkRb;EArBA,OD9PU;;ACoRV;EAtBA,OD3Pc;;ACkRd;EAvBA,OD5PY;;;AGVd;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBA;EACI;;;AAIA;EAAU;;AACV;EAAQ;;AACR;EAAS;;;AAGX;AAEF;EACI;EACA;EACA;;AArBA;EACI;EACA;;;AAwBR;EACI;EACA,OH7BU;EG8BV;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA,OH3CU;;AG4CV;EACI,OH7CM;;AGLV;EACI;;;AAsDR;EACI;;;AAGJ;AAEA;EACI,kBHzDU;;;AG4Dd;EACI;EACA;;;AAGF;AAKF;EAGI,kBHnEU;;;AGsEd;EACI,OH7EU;EG8EV;;AA7EA;EACI;EACA;;;AA+ER;AAEA;EACI;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;;AACA;EACI,OHxFE;EGyFF,kBH/FE;EGgGF;EACA;EACA;EACA;EACA;;AACA;EACI,OHtGF;EGuGE,kBHjGF;;;AInBd;AAAA;AAAA;AAAA;AAAA;AAAA;AA4CA;EC9BE;EDFE,kBJQW;EIPd,YCbc;EDcX;EACA;EACA,SATU;;AAwCV;EACI;;AACA;EACI;;AAIR;EAlCA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA,OJnBM;EIoBN;EACA;;;AAyBR;EC7CE;EDFE,kBJQW;EIPd,YCbc;EDcX;EACA;EACA,SARY;;AAqDZ;EAzCA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA,OJnBM;EIoBN;EACA;;;AAgCR;AAGI;ECvDF;EDyDM;EACA;;AAGI;EACI;EACA,OJjEH;;AIqEG;EACI;;AAKZ;EACI;;;AAKZ;AAtDI;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA7BS;;AI2BT;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;AI0BV;EJCA;EACA,OA5BU;;;AI0GV;EJ/EA;EACA,OA5BU;;AI2GV;EJhFA;EACA,OA5BU;;AI4GV;EJjFA;EACA,OA5BU;;AI6GV;EJlFA;EACA,OA5BU;;AI8GV;EJnFA;EACA,OA5BU;;AI+GV;EJpFA;EACA,OA5BU;;AIgHV;EJrFA;EACA,OA5BU;;AIiHV;EJtFA;EACA,OA5BU;;AIkHV;EJvFA;EACA,OA7BS;;AIoHT;EJxFA;EACA,OA5BU;;AIoHV;EJzFA;EACA,OA5BU;;AIqHV;EJ1FA;EACA,OA5BU;;AIsHV;EJ3FA;EACA,OA5BU;;AIwHV;EJ7FA;EACA,OA5BU;;AIyHV;EJ9FA;EACA,OA5BU;;AI0HV;EJ/FA;EACA,OA5BU;;AI2HV;EJhGA;EACA,OA5BU;;AI4HV;EJjGA;EACA,OA5BU;;AI6HV;EJlGA;EACA,OA5BU;;;AMTd;ACJA;AAAA;AAAA;AAAA;AAAA;AAiFA;EAlDI,SAtBW;EAuBX;EACA;EACA;EACA;EFzBF;EAIA;EEDE;EACA;EACA;EAoEA;;AA3CA;EACI;;AAxBJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAqBJ;EACI;EACH;;AACG;EACC;EACG;;AAiCR;EF1EF;;;AE+EF;EA1DI,SArBW;EAsBX;EACA;EACA;EACA;EFzBF;EAIA;EEDE;EACA;EACA;;AAyBA;EACI;;AAxBJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAqBJ;EACI;EACH;;AACG;EACC;EACG;;;AA4CZ;EArCI,OP7CU;;AO8CV;EACI,kBAoCwB;;AA7BxB;EATJ,OAU2C;;AAT3C;EACI,kBAoCqC;;;AAO7C;EACI;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;;;AAGJ;AAEA;EA1GI;EACA;EACA;EA0GA;EACA;EACA;;AA1GA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAqGR;EACI;EACA;;AAEA;EACI;;AAGJ;EAvGA,SAtBW;EAuBX;EACA;EACA;EACA;EFzBF;EAIA;EEDE;EACA;EACA;EA2CA,OPvCU;EOsHN;;AAjGJ;EACI;;AAxBJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAqBJ;EACI;EACH;;AACG;EACC;EACG;;AAQR;EACI,kBPxCO;;AO+CP;EATJ,OAU2C;;AAT3C;EACI,kBA4E2C;;AAG3C;EACI;EACA;;AAGJ;EAtFJ,OP7CU;;AO8CV;EACI,kBPrDO;;AO4DP;EATJ,OAU2C;;AAT3C;EACI,kBPrDO;;;AOmJX;EAhGA,OP7CU;;AO8CV;EACI,kBPvDK;;AO8DL;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAiF/C;EAjGA,OP7CU;;AO8CV;EACI,kBPtDO;;AO6DP;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAkF/C;EAlGA,OP7CU;;AO8CV;EACI,kBPrDO;;AO4DP;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAmF/C;EAnGA,OP7CU;;AO8CV;EACI,kBPpDI;;AO2DJ;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAoF/C;EApGA,OP7CU;;AO8CV;EACI,kBPnDO;;AO0DP;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAqF/C;EArGA,OP7CU;;AO8CV;EACI,kBPlDM;;AOyDN;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAsF/C;EAtGA,OP7CU;;AO8CV;EACI,kBPjDQ;;AOwDR;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAuF/C;EAvGA,OP7CU;;AO8CV;EACI,kBPhDK;;AOuDL;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAwF/C;EAxGA,OP9CS;;AO+CT;EACI,kBPxCO;;AO+CP;EATJ,OAU2C;;AAT3C;EACI,kBAkB2C;;AAqF/C;EAzGA,OP7CU;;AO8CV;EACI,kBP9CU;;AOqDV;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AA0F/C;EA1GA,OP7CU;;AO8CV;EACI,kBP7CO;;AOoDP;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AA2F/C;EA3GA,OP7CU;;AO8CV;EACI,kBP5CM;;AOmDN;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AA4F/C;EA5GA,OP7CU;;AO8CV;EACI,kBP3CK;;AOkDL;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AA8F/C;EA9GA,OP7CU;;AO8CV;EACI,kBPrDO;;AO4DP;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AA+F/C;EA/GA,OP7CU;;AO8CV;EACI,kBPvDK;;AO8DL;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAgG/C;EAhHA,OP7CU;;AO8CV;EACI,kBPnDO;;AO0DP;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAiG/C;EAjHA,OP7CU;;AO8CV;EACI,kBPpDI;;AO2DJ;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAkG/C;EAlHA,OP7CU;;AO8CV;EACI,kBPjDQ;;AOwDR;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAmG/C;EAnHA,OP7CU;;AO8CV;EACI,kBPlDM;;AOyDN;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AAoG/C;EApHA,OP9CS;;AO+CT;EACI,kBAkH0B;;AA3G1B;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;;AAuGjD;AAGE;EA1HA,OP7CU;;AO8CV;EACI,kBAwH8B;;AAjH9B;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AA2G/C;EA3HA,OP7CU;;AO8CV;EACI,kBAyH6B;;AAlH7B;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AA4G/C;EA5HA,OP7CU;;AO8CV;EACI,kBA0HgC;;AAnHhC;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AA6G/C;EA7HA,OP7CU;;AO8CV;EACI,kBA2H8B;;AApH9B;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;AA8G/C;EA9HA,OP7CU;;AO8CV;EACI,kBA4H8B;;AArH9B;EATJ,OAU2C;;AAT3C;EACI,kBAc2C;;;ADlEnD;AAEA;EACE;;;AAGF;EACE;;;AAGF;AAEA;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAKF;EAEE;IACE;;;EAGF;IACE;;;EAGF;IACE;;;AAKJ;EDpCE;ECsCA;EACA;EACA;;;AAGF;EACE;;;AAGF;EAEE;EACA;EACA;EACD;EACC;EACA;EACA;EACA;EACD;EAGA;EACC;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,ON/Ga;EMgHb;EACA;EACC;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,ON7HY;;;AMgId;EACC,ONjIa;EMkIZ;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA","file":"style.css"} \ No newline at end of file diff --git a/index.html b/index.html index d195a0a..6768f93 100644 --- a/index.html +++ b/index.html @@ -15,7 +15,6 @@ - diff --git a/preview.html b/preview.html index 8979a8c..c0d8e1c 100644 --- a/preview.html +++ b/preview.html @@ -15,7 +15,6 @@ - diff --git a/scss/_font-face.scss b/scss/_font-face.scss new file mode 100644 index 0000000..fe511c6 --- /dev/null +++ b/scss/_font-face.scss @@ -0,0 +1,126 @@ +/* 2.1 - Font Face */ + +$basefont: OpenSans, sans-serif; +$titlefont: OpenSans, sans-serif; + +/* 2.1.1 - OpenSans */ + +@font-face { + font-family: 'OpenSans'; + src: url('fonts/OpenSans-Light-webfont.eot'); + src: url('fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'), + url('fonts/OpenSans-Light-webfont.woff2') format('woff2'), + url('fonts/OpenSans-Light-webfont.woff') format('woff'), + url('fonts/OpenSans-Light-webfont.ttf') format('truetype'), + url('fonts/OpenSans-Light-webfont.svg#open_sansbold') format('svg'); + font-weight: 300; + font-style: normal; +} + +@font-face { + font-family: 'OpenSans'; + src: url('fonts/OpenSans-LightItalic-webfont.eot'); + src: url('fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'), + url('fonts/OpenSans-LightItalic-webfont.woff2') format('woff2'), + url('fonts/OpenSans-LightItalic-webfont.woff') format('woff'), + url('fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'), + url('fonts/OpenSans-LightItalic-webfont.svg#open_sansbold') format('svg'); + font-weight: 300; + font-style: italic; +} + +@font-face { + font-family: 'OpenSans'; + src: url('fonts/OpenSans-Regular-webfont.eot'); + src: url('fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'), + url('fonts/OpenSans-Regular-webfont.woff2') format('woff2'), + url('fonts/OpenSans-Regular-webfont.woff') format('woff'), + url('fonts/OpenSans-Regular-webfont.ttf') format('truetype'), + url('fonts/OpenSans-Regular-webfont.svg#open_sansbold') format('svg'); + font-weight: 400; + font-style: normal; +} + +@font-face { + font-family: 'OpenSans'; + src: url('fonts/OpenSans-Italic-webfont.eot'); + src: url('fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'), + url('fonts/OpenSans-Italic-webfont.woff2') format('woff2'), + url('fonts/OpenSans-Italic-webfont.woff') format('woff'), + url('fonts/OpenSans-Italic-webfont.ttf') format('truetype'), + url('fonts/OpenSans-Italic-webfont.svg#open_sansbold') format('svg'); + font-weight: 400; + font-style: italic; +} + +@font-face { + font-family: 'OpenSans'; + src: url('fonts/OpenSans-Semibold-webfont.eot'); + src: url('fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'), + url('fonts/OpenSans-Semibold-webfont.woff2') format('woff2'), + url('fonts/OpenSans-Semibold-webfont.woff') format('woff'), + url('fonts/OpenSans-Semibold-webfont.ttf') format('truetype'), + url('fonts/OpenSans-Semibold-webfont.svg#open_sansbold') format('svg'); + font-weight: 600; + font-style: normal; +} + +@font-face { + font-family: 'OpenSans'; + src: url('fonts/OpenSans-SemiboldItalic-webfont.eot'); + src: url('fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'), + url('fonts/OpenSans-SemiboldItalic-webfont.woff2') format('woff2'), + url('fonts/OpenSans-SemiboldItalic-webfont.woff') format('woff'), + url('fonts/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'), + url('fonts/OpenSans-SemiboldItalic-webfont.svg#open_sansbold') format('svg'); + font-weight: 600; + font-style: italic; +} + +@font-face { + font-family: 'OpenSans'; + src: url('fonts/OpenSans-Bold-webfont.eot'); + src: url('fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'), + url('fonts/OpenSans-Bold-webfont.woff2') format('woff2'), + url('fonts/OpenSans-Bold-webfont.woff') format('woff'), + url('fonts/OpenSans-Bold-webfont.ttf') format('truetype'), + url('fonts/OpenSans-Bold-webfont.svg#open_sansbold') format('svg'); + font-weight: 700; + font-style: normal; +} + +@font-face { + font-family: 'OpenSans'; + src: url('fonts/OpenSans-BoldItalic-webfont.eot'); + src: url('fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'), + url('fonts/OpenSans-BoldItalic-webfont.woff2') format('woff2'), + url('fonts/OpenSans-BoldItalic-webfont.woff') format('woff'), + url('fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'), + url('fonts/OpenSans-BoldItalic-webfont.svg#open_sansbold') format('svg'); + font-weight: 700; + font-style: italic; +} + +@font-face { + font-family: 'OpenSans'; + src: url('fonts/OpenSans-ExtraBold-webfont.eot'); + src: url('fonts/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'), + url('fonts/OpenSans-ExtraBold-webfont.woff2') format('woff2'), + url('fonts/OpenSans-ExtraBold-webfont.woff') format('woff'), + url('fonts/OpenSans-ExtraBold-webfont.ttf') format('truetype'), + url('fonts/OpenSans-ExtraBold-webfont.svg#open_sansbold') format('svg'); + font-weight: 800; + font-style: normal; +} + +@font-face { + font-family: 'OpenSans'; + src: url('fonts/OpenSans-ExtraBoldItalic-webfont.eot'); + src: url('fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'), + url('fonts/OpenSans-ExtraBoldItalic-webfont.woff2') format('woff2'), + url('fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'), + url('fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'), + url('fonts/OpenSans-ExtraBoldItalic-webfont.svg#open_sansbold') format('svg'); + font-weight: 800; + font-style: italic; +} \ No newline at end of file diff --git a/scss/_palette.scss b/scss/_palette.scss index 783ca73..64f32c6 100644 --- a/scss/_palette.scss +++ b/scss/_palette.scss @@ -31,6 +31,7 @@ $color-link: $color-blue; $color-selection: $color-blue; $color-mark: $color-yellow; +$color-font: $color-dark2; $color-warning: $color-orange; $color-danger: $color-red; $color-info: $color-skyblue; diff --git a/scss/_typography.scss b/scss/_typography.scss new file mode 100644 index 0000000..9eda6f0 --- /dev/null +++ b/scss/_typography.scss @@ -0,0 +1,287 @@ +/* + * 2 - Typography ( _typography.scss ) + * + * This part of the (s)css handle everything related to the typography + * like paragraphs, blockquote, etc. + * +*/ + +@import 'font-face'; + +/* 2.2 - Global Typography */ + +@mixin paragraph() { + padding:0; + padding-bottom:1.5em; + margin: 0; +} + +body { + font-family: $basefont; + text-align: left; + font-size: 4.5mm; + line-height: 1.5em; + color: $color-font; + font-weight: 400; +} + +.night-mode { + color: $color-light2; +} + +strong { + font-weight: 600; +} + +em { + font-style: italic; +} + +a { + color: $color-link; + text-decoration:none; + &:hover, &:active { + color: $color-link; + } +} + +p { + @include paragraph(); + &:last-child { + padding-bottom:0; + } +} + +ul { + @include paragraph(); + ul { + padding-bottom:0; + } + li { + margin-left:1.5em; + } +} + +ol { + @include paragraph(); + ol { + padding-bottom:0; + } + li { + margin-left:1.5em; + } +} + + +::selection { background: $color-selection; color: $color-light; } +::-moz-selection { background: $color-selection; color: $color-light; } + +/* 2.2 - Text Wrapper */ + +.article-content { + font-size: calc(4mm + 0.4vw); + line-height: 1.5em; + padding: 1em; + font-weight:300; + p, em, p em { + font-weight:300; + } + + img { + max-width: 100%; + height: auto; + } + + .article-thumbnail { + padding-bottom: 1em; + text-align: center; + img { + max-width: 100%; + height: auto; + + } + } + .article-excerpt { + padding: 0.5em 0.5em 0.5em 0.5em; + font-style: italic; + font-size: calc(3.5mm + 0.4vw); + } + .article-author { + margin:0; + padding:0; + .card-meta { + margin:0; + } + } + + .bypass-flex-fontsize { + font-size: 4mm; + line-height: 1.5em; + } +} + +/* 2.3 - Titles */ + +@mixin title($size, $height, $top, $bottom, $weight) { + font-size: $size; + line-height: $height; + padding: $top 0 $bottom 0; + font-weight: $weight; +} + +h1, h2, h3, h4, h5, h6, h7 { + font-family: OpenSans; + text-align: left; + font-size: 1em; + line-height: 1.5em; + padding:0; + margin:0; + font-weight:400; + + &.page-title { + font-family: OpenSans; + color: $color-primary; + font-weight: 300; + margin-bottom: 0.5em; + padding: 0; + + i { + font-size: 0.55em; + position: relative; + top: -0.175em; + } + + &-flex { + display: flex; + flex-direction: row; + justify-content: space-between; + & > span, & > i, & > a { + display: block; + } + + & > a { + color: $color-primary; + &:hover, &:focus, &:active { + color: darken($color-primary, 10%); + } + } + } + } +} + +h1 { + @include title(3em, 1em, 0.5em, 0.6em, 200); +} + +h2 { + @include title(2em, 1.5em, 0.333333em, 0.4em, 700); +} + +h3 { + @include title(1.5em, 1em, 0em, 1em, 700); +} + +h4 { + @include title(1.5em, 1em, 0em, 1em, 600); +} + +h5 { + @include title(1.333333em, 1em, 0.1em, 1.133333em, 600); +} + +h6 { + @include title(1.1em, 1.4em, 0.1em, 1.2em, 600); +} + +/* 2.4 - hr */ + +hr { + border-top: 0px; + border-left: 0px; + border-right: 0px; + border-bottom: 1px; + border-color: rgba(1,1,1,0.15); + border-style: solid; + margin: 1.5em; +} + +/* 2.5 - Wells and quotes */ + +@mixin well() { + border-width: 0 0 0 0em; + border-style: none; + border-radius: 0px; + + margin: -0.75em -0.2em 0.75em -0.2em; + padding: 0.75em 1em 0.75em 1em; + + max-width: 100%; + background-color: $color-light2; + font-style: italic; + color: $color-dark2; +} + +blockquote, .quote, .well { + @include well(); +} + +pre, .pre, .well-pre { + @include well(); +} + +code { + background:transparent; + color: $color-red; +} + + + +/* 2.6 - Special styling */ + +mark { + border-radius: 0.2em; + padding:0 0.2em 0 0.2em; + + background-color: lighten($color-mark, 30%); + color: inherit; +} + +.night-mode mark { + background-color: $color-primary; +} + +.time { + font-style: italic; + text-align: right; + width: 100%; + display: block; +} + +/* 2.6.1 - Colored texts */ + +@mixin text-color($text-color) { + color: $text-color; +} + +.text { + &-blue { @include text-color($color-blue); } + &-violet { @include text-color($color-violet); } + &-purple { @include text-color($color-purple); } + &-red { @include text-color($color-red); } + &-orange { @include text-color($color-orange); } + &-green { @include text-color($color-green); } + &-skyblue { @include text-color($color-skyblue); } + &-dark { @include text-color($color-dark); } + &-light { @include text-color($color-light); } + &-turquoise { @include text-color($color-turquoise); } + &-yellow { @include text-color($color-yellow); } + &-brown { @include text-color($color-brown); } + &-grey { @include text-color($color-grey); } + + &-primary { @include text-color($color-primary); } + &-secondary { @include text-color($color-secondary); } + &-warning { @include text-color($color-warning); } + &-danger { @include text-color($color-danger); } + &-info { @include text-color($color-info); } + &-success { @include text-color($color-success); } +} diff --git a/scss/style.scss b/scss/style.scss index 4624e7e..5eb833f 100644 --- a/scss/style.scss +++ b/scss/style.scss @@ -2,4 +2,6 @@ @import 'definitions'; +@import 'typography'; + @import 'commons'; \ No newline at end of file