fontsface
This commit is contained in:
File diff suppressed because one or more lines are too long
@@ -30,7 +30,7 @@ a {
|
||||
color: black; }
|
||||
|
||||
b, strong, label, th {
|
||||
font-weight: 600; }
|
||||
font-weight: 700; }
|
||||
|
||||
#container {
|
||||
min-height: 100%;
|
||||
@@ -79,6 +79,11 @@ b, strong, label, th {
|
||||
height: 5rem;
|
||||
background-color: white;
|
||||
box-shadow: 0 0.05rem 1rem rgba(0, 0, 0, 0.15); }
|
||||
#header #logo img {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-flow: row;
|
||||
max-height: 5rem; }
|
||||
#header.scrolled {
|
||||
height: 3rem;
|
||||
background-color: rgba(255, 255, 255, 0.9) !important;
|
||||
@@ -107,7 +112,7 @@ b, strong, label, th {
|
||||
#header #logo h3 a {
|
||||
color: #000; }
|
||||
#header #navbar {
|
||||
font-size: 0.9rem;
|
||||
font-size: 1.4rem;
|
||||
/* Child Indicator */ }
|
||||
#header #navbar .has-children > a > span {
|
||||
display: inline-block;
|
||||
@@ -147,7 +152,7 @@ b, strong, label, th {
|
||||
/* Dropdown CSS */
|
||||
/* Active on Hover */ }
|
||||
#header #navbar ul.navigation li a {
|
||||
font-family: "Sarabun ExtraBold", sans-serif;
|
||||
font-family: "Sarabun", sans-serif;
|
||||
display: inline-block;
|
||||
padding: 0.3rem 0.8rem;
|
||||
-webkit-backface-visibility: hidden; }
|
||||
@@ -295,19 +300,19 @@ b, strong, label, th {
|
||||
color: #fff; }
|
||||
|
||||
html, body, button, input, select, textarea, .pure-g, .pure-g [class*="pure-u"] {
|
||||
font-family: "Sarabun Regular", sans-serif; }
|
||||
font-family: "Sarabun", sans-serif; }
|
||||
|
||||
h1 {
|
||||
font-family: "Sarabun ExtraBold", sans-serif;
|
||||
font-weight: 400;
|
||||
font-family: "Sarabun", sans-serif;
|
||||
font-weight: 800;
|
||||
text-rendering: optimizeLegibility;
|
||||
letter-spacing: -0px; }
|
||||
|
||||
h2, h3, h5, h6 {
|
||||
font-family: "Sarabun Light", sans-serif; }
|
||||
font-family: "Sarabun", sans-serif; }
|
||||
|
||||
h1 {
|
||||
font-size: 3.2rem; }
|
||||
font-size: 3rem; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
h1 {
|
||||
font-size: 2.5rem;
|
||||
@@ -316,29 +321,29 @@ h1 {
|
||||
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
h2 {
|
||||
font-size: 2.1rem; } }
|
||||
font-size: 1.9rem; } }
|
||||
|
||||
@media only all and (max-width: 47.938em) {
|
||||
h2 {
|
||||
font-size: 2rem; } }
|
||||
font-size: 1.8rem; } }
|
||||
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
h3 {
|
||||
font-size: 1.7rem; } }
|
||||
font-size: 1.6rem; } }
|
||||
|
||||
@media only all and (max-width: 47.938em) {
|
||||
h3 {
|
||||
font-size: 1.6rem; } }
|
||||
font-size: 1.5rem; } }
|
||||
|
||||
h4 {
|
||||
font-family: "Sarabun Regular", sans-serif;
|
||||
font-weight: bold; }
|
||||
font-family: "Sarabun", sans-serif;
|
||||
font-weight: 800; }
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
h4 {
|
||||
font-size: 1.35rem; } }
|
||||
font-size: 1.25rem; } }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
h4 {
|
||||
font-size: 1.25rem; } }
|
||||
font-size: 1.15rem; } }
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
@@ -350,12 +355,26 @@ h2 {
|
||||
h3 {
|
||||
letter-spacing: -0px; }
|
||||
|
||||
h1 + h2 {
|
||||
margin: -2rem 0 2rem 0;
|
||||
font-size: 2rem;
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
font-family: "Sarabun", sans-serif;
|
||||
font-weight: 300; }
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
h1 + h2 {
|
||||
font-size: 1.6rem; } }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
h1 + h2 {
|
||||
font-size: 1.5rem; } }
|
||||
|
||||
h2 + h3 {
|
||||
margin: 0.5rem 0 2rem 0;
|
||||
font-size: 2rem;
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
font-family: "Sarabun Light", sans-serif;
|
||||
font-family: "Sarabun", sans-serif;
|
||||
font-weight: 300; }
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
h2 + h3 {
|
||||
@@ -365,7 +384,7 @@ h2 + h3 {
|
||||
font-size: 1.5rem; } }
|
||||
|
||||
p {
|
||||
font-size: 19px; }
|
||||
font-size: 1rem; }
|
||||
|
||||
blockquote {
|
||||
border-left: 10px solid #F0F2F4; }
|
||||
@@ -464,7 +483,7 @@ hr {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
font-size: 0.7rem;
|
||||
font-family: "Sarabun ExtraBold", sans-serif;
|
||||
font-family: "Sarabun", sans-serif;
|
||||
margin-right: 0.75rem; }
|
||||
|
||||
fieldset {
|
||||
@@ -529,14 +548,14 @@ td {
|
||||
box-shadow: 0 1px 0 #f32b24; }
|
||||
|
||||
.bullets {
|
||||
margin: 1.7rem 0;
|
||||
margin-left: -0.85rem;
|
||||
margin-right: -0.85rem;
|
||||
margin: 1.7em 0;
|
||||
margin-left: -0.85em;
|
||||
margin-right: -0.85em;
|
||||
overflow: auto; }
|
||||
|
||||
.bullet {
|
||||
float: left;
|
||||
padding: 0 0.85rem; }
|
||||
padding: 0 0.85em; }
|
||||
|
||||
.two-column-bullet {
|
||||
width: 50%; }
|
||||
@@ -668,7 +687,7 @@ td {
|
||||
.list-item .list-blog-date span {
|
||||
display: block;
|
||||
font-size: 1.75rem;
|
||||
font-weight: 600;
|
||||
font-weight: 700;
|
||||
line-height: 110%; }
|
||||
.list-item .list-blog-date em {
|
||||
display: block;
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
#header #navbar ul.navigation li a {
|
||||
font-family: "Sarabun Regular", sans-serif;
|
||||
font-size: 25px;
|
||||
font-family: "Sarabun", sans-serif;
|
||||
font-weight: 400;
|
||||
text-transform: uppercase;
|
||||
font-size: 1rem;
|
||||
display: inline-block;
|
||||
padding: 0.3rem 0.8rem;
|
||||
-webkit-backface-visibility: hidden;
|
||||
@@ -11,7 +12,7 @@
|
||||
|
||||
#header.scrolled #navbar ul.navigation li a {
|
||||
color: black !important;
|
||||
font-size: 20px;
|
||||
font-size: 0.95rem;
|
||||
|
||||
transition:0.6s ease-in-out;
|
||||
|
||||
@@ -167,7 +168,8 @@ h2 {
|
||||
padding-top: 3rem;
|
||||
padding-left: 15%;
|
||||
padding-right: 15%;
|
||||
font-family: "Sarabun ExtraBold";
|
||||
font-family: "Sarabun";
|
||||
font-weight: 800;
|
||||
font-size: 1rem;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
@@ -3,118 +3,96 @@
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabunbold';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-bold-webfont.woff2') format('woff2'),
|
||||
url('sarabun-bold-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabunbold_italic';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-bolditalic-webfont.woff2') format('woff2'),
|
||||
url('sarabun-bolditalic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_extraboldregular';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-extrabold-webfont.woff2') format('woff2'),
|
||||
url('sarabun-extrabold-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-weight: 800;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_extrabolditalic';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-extrabolditalic-webfont.woff2') format('woff2'),
|
||||
url('sarabun-extrabolditalic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_extralightregular';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-extralight-webfont.woff2') format('woff2'),
|
||||
url('sarabun-extralight-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-weight: 200;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_extralightitalic';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-extralightitalic-webfont.woff2') format('woff2'),
|
||||
url('sarabun-extralightitalic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
font-weight: 200;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabunitalic';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-italic-webfont.woff2') format('woff2'),
|
||||
url('sarabun-italic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_lightregular';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-light-webfont.woff2') format('woff2'),
|
||||
url('sarabun-light-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_lightitalic';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-lightitalic-webfont.woff2') format('woff2'),
|
||||
url('sarabun-lightitalic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_mediumregular';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-medium-webfont.woff2') format('woff2'),
|
||||
url('sarabun-medium-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-weight: 500;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
@@ -123,11 +101,11 @@
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_mediumitalic';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-mediumitalic-webfont.woff2') format('woff2'),
|
||||
url('sarabun-mediumitalic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
|
||||
@@ -135,57 +113,49 @@
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabunregular';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-regular-webfont.woff2') format('woff2'),
|
||||
url('sarabun-regular-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_semiboldregular';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-semibold-webfont.woff2') format('woff2'),
|
||||
url('sarabun-semibold-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_semibolditalic';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-semibolditalic-webfont.woff2') format('woff2'),
|
||||
url('sarabun-semibolditalic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_thinregular';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-thin-webfont.woff2') format('woff2'),
|
||||
url('sarabun-thin-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-weight: 100;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'sarabun_thinitalic';
|
||||
font-family: 'Sarabun';
|
||||
src: url('sarabun-thinitalic-webfont.woff2') format('woff2'),
|
||||
url('sarabun-thinitalic-webfont.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-weight: 100;
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
|
||||
@@ -3,12 +3,12 @@ $core-font-size: 1rem !default;
|
||||
$core-line-height: 1.7 !default;
|
||||
|
||||
// Heading Sizes
|
||||
$h1-font-size: $core-font-size + 2.20 !default;
|
||||
$h2-font-size: $core-font-size + 1.50 !default;
|
||||
$h3-font-size: $core-font-size + 1.10 !default;
|
||||
$h4-font-size: $core-font-size + 0.75 !default;
|
||||
$h5-font-size: $core-font-size + 0.35 !default;
|
||||
$h6-font-size: $core-font-size - 0.15 !default;
|
||||
$h1-font-size: $core-font-size + 2.0 !default;
|
||||
$h2-font-size: $core-font-size + 1.30 !default;
|
||||
$h3-font-size: $core-font-size + 1.0 !default;
|
||||
$h4-font-size: $core-font-size + 0.65 !default;
|
||||
$h5-font-size: $core-font-size + 0.25 !default;
|
||||
$h6-font-size: $core-font-size - 0.10 !default;
|
||||
|
||||
// Spacing
|
||||
$leading-margin: $core-line-height * 1rem !default;
|
||||
$leading-margin: $core-line-height * 1em !default;
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
// Font Family
|
||||
$font-family-default: "Sarabun Regular", sans-serif;
|
||||
$font-family-header: "Sarabun ExtraBold", sans-serif;
|
||||
$font-family-chapeau: "Sarabun Light", sans-serif;
|
||||
$font-family-default: "Sarabun", sans-serif;
|
||||
$font-family-header: "Sarabun", sans-serif;
|
||||
$font-family-chapeau: "Sarabun", sans-serif;
|
||||
$font-family-mono: "Inconsolata", monospace;
|
||||
$font-family-serif: "Georgia", "Times", "Times New Roman", serif;
|
||||
|
||||
|
||||
@@ -4,9 +4,14 @@ $footer-height: 6rem;
|
||||
$border-radius: 3px;
|
||||
|
||||
// Font Weights
|
||||
$font-weight-bold: 600;
|
||||
$font-weight-extrabold: 800;
|
||||
$font-weight-bold: 700;
|
||||
$font-weight-semibold: 600;
|
||||
$font-weight-medium: 500;
|
||||
$font-weight-regular: 400;
|
||||
$font-weight-light:300;
|
||||
$font-weight-extralight:200;
|
||||
$font-weight-thin:100;
|
||||
|
||||
// Global Paddings
|
||||
$padding-horiz: 7rem;
|
||||
|
||||
@@ -11,6 +11,12 @@ $dropdown-color: #f6f6f6;
|
||||
background-color: white;
|
||||
box-shadow: 0 0.05rem 1rem rgba(0,0,0, 0.15);
|
||||
|
||||
#logo img {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-flow: row;
|
||||
max-height: $header-height;
|
||||
}
|
||||
|
||||
// scroll based changes
|
||||
&.scrolled {
|
||||
@@ -24,6 +30,8 @@ $dropdown-color: #f6f6f6;
|
||||
font-size: 1.6rem !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#logo a, #navbar span {
|
||||
color: $black !important;
|
||||
}
|
||||
@@ -68,7 +76,7 @@ $dropdown-color: #f6f6f6;
|
||||
}
|
||||
|
||||
#navbar {
|
||||
font-size: $core-font-size - 0.1rem;
|
||||
font-size: $core-font-size + 0.4rem;
|
||||
|
||||
/* Child Indicator */
|
||||
.has-children {
|
||||
|
||||
@@ -7,7 +7,7 @@ html, body, button, input, select, textarea, .pure-g, .pure-g [class *= "pure-u"
|
||||
// Headings
|
||||
h1 {
|
||||
font-family: $font-family-header;
|
||||
font-weight: 400;
|
||||
font-weight: 800;
|
||||
text-rendering: optimizeLegibility;
|
||||
letter-spacing: -0px;
|
||||
}
|
||||
@@ -47,7 +47,7 @@ h3 {
|
||||
|
||||
h4 {
|
||||
font-family: $font-family-default;
|
||||
font-weight: bold;
|
||||
font-weight: 800;
|
||||
@include breakpoint(tablet-range) {
|
||||
font-size: $h4-font-size - .40;
|
||||
}
|
||||
@@ -70,20 +70,20 @@ h3 {
|
||||
letter-spacing: -0px;
|
||||
}
|
||||
|
||||
// h1 + h2 {
|
||||
// margin: -2rem 0 2rem 0;
|
||||
// font-size: 2rem;
|
||||
// @include breakpoint(tablet-range) {
|
||||
// font-size: 1.6rem;
|
||||
// }
|
||||
// @include breakpoint(mobile-only) {
|
||||
// font-size: 1.5rem;
|
||||
// }
|
||||
// line-height: 1;
|
||||
// text-align: center;
|
||||
// font-family: $font-family-default;
|
||||
// font-weight: 300;
|
||||
// }
|
||||
h1 + h2 {
|
||||
margin: -2rem 0 2rem 0;
|
||||
font-size: 2rem;
|
||||
@include breakpoint(tablet-range) {
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
@include breakpoint(mobile-only) {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
font-family: $font-family-default;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
h2 + h3 {
|
||||
margin: 0.5rem 0 2rem 0;
|
||||
@@ -101,7 +101,7 @@ h2 + h3 {
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 19px;
|
||||
font-size: $core-font-size;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -27,6 +27,9 @@
|
||||
{% endblock %}
|
||||
|
||||
{% block header_navigation %}
|
||||
|
||||
|
||||
|
||||
{% if show_onpage_menu %}
|
||||
<ul class="navigation">
|
||||
{% for module in page.collection() %}
|
||||
@@ -45,7 +48,7 @@
|
||||
{% else %}
|
||||
{{ parent() }}
|
||||
{% endif %}
|
||||
{{ dump(header)}}
|
||||
|
||||
{% endblock %}
|
||||
|
||||
|
||||
|
||||
@@ -51,10 +51,9 @@
|
||||
|
||||
<div id="logo">
|
||||
|
||||
{% for logo in page.header.content %}
|
||||
<img src='{{ page.media[logo.media_order].url|e }}' alt="{{ config.site.title }}" />
|
||||
|
||||
{% endfor %}
|
||||
<img src="/user/pages/01.home/Republique-francaise-logo.svg" alt="logo France">
|
||||
<img src="user/pages/01.home/EPAU_logo_EPAU_vecto-seul.svg" alt="logo EPAU">
|
||||
|
||||
|
||||
{# marche pas
|
||||
{% for image in page.header.media_order %}
|
||||
|
||||
Reference in New Issue
Block a user