Servir les polices de sitecof en local

Le nouveau site du COF réintroduisait des fontes hostées chez Google.
On s'en débarasse en utilisant des webfontes locales.
This commit is contained in:
Guillaume Bertholon 2020-03-28 13:59:07 +01:00
parent 494cd5ddc1
commit fe2f8aaa5a
13 changed files with 127 additions and 88 deletions

View file

@ -2,8 +2,7 @@
* In this file you should write your main styles. (or centralize your imports)
* Import this file using the following HTML or equivalent:
* <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
@import url("https://fonts.googleapis.com/css?family=Carter+One|Source+Sans+Pro:300,300i,700");
/* line 5, ../../../../../../../../../../var/lib/gems/2.3.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
/* line 5, ../../../../../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
@ -25,141 +24,141 @@ time, mark, audio, video {
vertical-align: baseline;
}
/* line 22, ../../../../../../../../../../var/lib/gems/2.3.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
/* line 22, ../../../../../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
html {
line-height: 1;
}
/* line 24, ../../../../../../../../../../var/lib/gems/2.3.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
/* line 24, ../../../../../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
ol, ul {
list-style: none;
}
/* line 26, ../../../../../../../../../../var/lib/gems/2.3.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
/* line 26, ../../../../../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
table {
border-collapse: collapse;
border-spacing: 0;
}
/* line 28, ../../../../../../../../../../var/lib/gems/2.3.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
/* line 28, ../../../../../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
caption, th, td {
text-align: left;
font-weight: normal;
vertical-align: middle;
}
/* line 30, ../../../../../../../../../../var/lib/gems/2.3.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
/* line 30, ../../../../../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
q, blockquote {
quotes: none;
}
/* line 103, ../../../../../../../../../../var/lib/gems/2.3.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
/* line 103, ../../../../../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
q:before, q:after, blockquote:before, blockquote:after {
content: "";
content: none;
}
/* line 32, ../../../../../../../../../../var/lib/gems/2.3.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
/* line 32, ../../../../../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
a img {
border: none;
}
/* line 116, ../../../../../../../../../../var/lib/gems/2.3.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
/* line 116, ../../../../../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
display: block;
}
/* line 12, ../sass/screen.scss */
/* line 10, ../sass/screen.scss */
*, *:after, *:before {
box-sizing: border-box;
}
/* line 16, ../sass/screen.scss */
/* line 14, ../sass/screen.scss */
body {
background: #fefefe;
font: 17px "Source Sans Pro", "sans-serif";
}
/* line 21, ../sass/screen.scss */
/* line 19, ../sass/screen.scss */
header {
background: #5B0012;
}
/* line 25, ../sass/screen.scss */
/* line 23, ../sass/screen.scss */
h1, h2 {
font-family: "Carter One", "serif";
color: #90001C;
}
/* line 30, ../sass/screen.scss */
/* line 28, ../sass/screen.scss */
h1 {
font-size: 2.3em;
}
/* line 34, ../sass/screen.scss */
/* line 32, ../sass/screen.scss */
h2 {
font-size: 1.6em;
}
/* line 38, ../sass/screen.scss */
/* line 36, ../sass/screen.scss */
a {
color: #CC9500;
text-decoration: none;
font-weight: bold;
}
/* line 44, ../sass/screen.scss */
/* line 42, ../sass/screen.scss */
h2 a {
font-weight: inherit;
color: inherit;
}
/* line 50, ../sass/screen.scss */
/* line 48, ../sass/screen.scss */
header a {
color: #fefefe;
}
/* line 53, ../sass/screen.scss */
/* line 51, ../sass/screen.scss */
header section {
display: flex;
width: 100%;
justify-content: space-between;
align-items: stretch;
}
/* line 59, ../sass/screen.scss */
/* line 57, ../sass/screen.scss */
header section.bottom-menu {
justify-content: space-around;
text-align: center;
background: #90001C;
}
/* line 65, ../sass/screen.scss */
/* line 63, ../sass/screen.scss */
header h1 {
padding: 0 15px;
}
/* line 69, ../sass/screen.scss */
/* line 67, ../sass/screen.scss */
header nav ul {
display: inline-flex;
}
/* line 71, ../sass/screen.scss */
/* line 69, ../sass/screen.scss */
header nav ul li {
display: inline-block;
}
/* line 73, ../sass/screen.scss */
/* line 71, ../sass/screen.scss */
header nav ul li > * {
display: block;
padding: 10px 15px;
font-weight: bold;
}
/* line 78, ../sass/screen.scss */
/* line 76, ../sass/screen.scss */
header nav ul li > *:hover {
background: #280008;
}
/* line 84, ../sass/screen.scss */
/* line 82, ../sass/screen.scss */
header nav .lang-select {
display: inline-block;
height: 100%;
vertical-align: top;
position: relative;
}
/* line 90, ../sass/screen.scss */
/* line 88, ../sass/screen.scss */
header nav .lang-select:before {
content: "";
color: #fff;
@ -171,12 +170,12 @@ header nav .lang-select:before {
margin: 10px 0;
padding-left: 10px;
}
/* line 102, ../sass/screen.scss */
/* line 100, ../sass/screen.scss */
header nav .lang-select a {
padding: 10px 20px;
display: block;
}
/* line 106, ../sass/screen.scss */
/* line 104, ../sass/screen.scss */
header nav .lang-select a img {
display: block;
width: auto;
@ -184,34 +183,34 @@ header nav .lang-select a img {
vertical-align: middle;
}
/* line 117, ../sass/screen.scss */
/* line 115, ../sass/screen.scss */
article {
line-height: 1.4;
}
/* line 119, ../sass/screen.scss */
/* line 117, ../sass/screen.scss */
article p, article ul {
margin: 0.4em 0;
}
/* line 122, ../sass/screen.scss */
/* line 120, ../sass/screen.scss */
article ul {
padding-left: 20px;
}
/* line 124, ../sass/screen.scss */
/* line 122, ../sass/screen.scss */
article ul li {
list-style: outside;
}
/* line 128, ../sass/screen.scss */
/* line 126, ../sass/screen.scss */
article:last-child {
margin-bottom: 30px;
}
/* line 133, ../sass/screen.scss */
/* line 131, ../sass/screen.scss */
.container {
max-width: 1000px;
margin: 0 auto;
position: relative;
}
/* line 138, ../sass/screen.scss */
/* line 136, ../sass/screen.scss */
.container .aside-wrap {
position: absolute;
top: 30px;
@ -219,7 +218,7 @@ article:last-child {
width: 25%;
left: 6px;
}
/* line 145, ../sass/screen.scss */
/* line 143, ../sass/screen.scss */
.container .aside-wrap .aside {
color: #222;
position: fixed;
@ -230,33 +229,33 @@ article:last-child {
padding: 15px;
box-shadow: -4px 4px 1px rgba(153, 118, 0, 0.3);
}
/* line 155, ../sass/screen.scss */
/* line 153, ../sass/screen.scss */
.container .aside-wrap .aside h2 {
color: #fff;
}
/* line 159, ../sass/screen.scss */
/* line 157, ../sass/screen.scss */
.container .aside-wrap .aside .calendar {
margin: 0 auto;
display: block;
}
/* line 164, ../sass/screen.scss */
/* line 162, ../sass/screen.scss */
.container .aside-wrap .aside a {
color: #997000;
}
/* line 170, ../sass/screen.scss */
/* line 168, ../sass/screen.scss */
.container .content {
max-width: 900px;
margin-left: auto;
margin-right: 6px;
}
/* line 175, ../sass/screen.scss */
/* line 173, ../sass/screen.scss */
.container .content .intro {
border-bottom: 3px solid #7f7f7f;
margin: 20px 0;
margin-top: 5px;
padding: 15px 5px;
}
/* line 184, ../sass/screen.scss */
/* line 182, ../sass/screen.scss */
.container .content section article {
background: #fff;
padding: 20px 30px;
@ -264,31 +263,31 @@ article:last-child {
border: 1px solid rgba(153, 118, 0, 0.1);
border-radius: 2px;
}
/* line 190, ../sass/screen.scss */
/* line 188, ../sass/screen.scss */
.container .content section article a {
color: #CC9500;
}
/* line 195, ../sass/screen.scss */
/* line 193, ../sass/screen.scss */
.container .content section article + h2 {
margin-top: 15px;
}
/* line 199, ../sass/screen.scss */
/* line 197, ../sass/screen.scss */
.container .content section article + article {
margin-top: 25px;
}
/* line 203, ../sass/screen.scss */
/* line 201, ../sass/screen.scss */
.container .content section .image {
margin: 15px 0;
text-align: center;
padding: 20px;
}
/* line 208, ../sass/screen.scss */
/* line 206, ../sass/screen.scss */
.container .content section .image img {
max-width: 100%;
height: auto;
box-shadow: -7px 7px 1px rgba(153, 118, 0, 0.2);
}
/* line 216, ../sass/screen.scss */
/* line 214, ../sass/screen.scss */
.container .content section.directory article.entry {
width: 80%;
max-width: 600px;
@ -296,7 +295,7 @@ article:last-child {
position: relative;
margin-left: 6%;
}
/* line 223, ../sass/screen.scss */
/* line 221, ../sass/screen.scss */
.container .content section.directory article.entry .entry-image {
display: block;
float: right;
@ -311,31 +310,31 @@ article:last-child {
margin-bottom: 10px;
transform: translateX(10px);
}
/* line 237, ../sass/screen.scss */
/* line 235, ../sass/screen.scss */
.container .content section.directory article.entry .entry-image img {
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
}
/* line 245, ../sass/screen.scss */
/* line 243, ../sass/screen.scss */
.container .content section.directory article.entry ul.links {
margin-top: 10px;
border-top: 1px solid #90001C;
padding-top: 10px;
}
/* line 253, ../sass/screen.scss */
/* line 251, ../sass/screen.scss */
.container .content section.actuhome {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
align-items: top;
}
/* line 259, ../sass/screen.scss */
/* line 257, ../sass/screen.scss */
.container .content section.actuhome article + article {
margin: 0;
}
/* line 263, ../sass/screen.scss */
/* line 261, ../sass/screen.scss */
.container .content section.actuhome article.actu {
position: relative;
background: none;
@ -345,7 +344,7 @@ article:last-child {
min-width: 300px;
flex: 1;
}
/* line 272, ../sass/screen.scss */
/* line 270, ../sass/screen.scss */
.container .content section.actuhome article.actu .actu-header {
position: relative;
box-shadow: -4px 5px 1px rgba(153, 118, 0, 0.3);
@ -359,7 +358,7 @@ article:last-child {
background-position: center center;
background-repeat: no-repeat;
}
/* line 285, ../sass/screen.scss */
/* line 283, ../sass/screen.scss */
.container .content section.actuhome article.actu .actu-header h2 {
position: absolute;
width: 100%;
@ -369,11 +368,11 @@ article:last-child {
text-shadow: 0 0 5px rgba(153, 118, 0, 0.8);
background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
}
/* line 293, ../sass/screen.scss */
/* line 291, ../sass/screen.scss */
.container .content section.actuhome article.actu .actu-header h2 a {
color: #fff;
}
/* line 299, ../sass/screen.scss */
/* line 297, ../sass/screen.scss */
.container .content section.actuhome article.actu .actu-misc {
background: white;
box-shadow: -2px 2px 1px rgba(153, 118, 0, 0.2);
@ -383,17 +382,17 @@ article:last-child {
padding: 15px;
padding-top: 5px;
}
/* line 308, ../sass/screen.scss */
/* line 306, ../sass/screen.scss */
.container .content section.actuhome article.actu .actu-misc .actu-minical {
display: block;
}
/* line 311, ../sass/screen.scss */
/* line 309, ../sass/screen.scss */
.container .content section.actuhome article.actu .actu-misc .actu-dates {
display: block;
text-align: right;
font-size: 0.9em;
}
/* line 318, ../sass/screen.scss */
/* line 316, ../sass/screen.scss */
.container .content section.actuhome article.actu .actu-overlay {
display: block;
background: none;
@ -405,81 +404,81 @@ article:last-child {
z-index: 5;
opacity: 0;
}
/* line 334, ../sass/screen.scss */
/* line 332, ../sass/screen.scss */
.container .content section.actulist article.actu {
display: flex;
width: 100%;
padding: 0;
}
/* line 339, ../sass/screen.scss */
/* line 337, ../sass/screen.scss */
.container .content section.actulist article.actu .actu-image {
width: 30%;
max-width: 200px;
background-size: cover;
background-position: center center;
}
/* line 345, ../sass/screen.scss */
/* line 343, ../sass/screen.scss */
.container .content section.actulist article.actu .actu-infos {
padding: 15px;
flex: 1;
}
/* line 349, ../sass/screen.scss */
/* line 347, ../sass/screen.scss */
.container .content section.actulist article.actu .actu-infos .actu-dates {
font-weight: bold;
font-size: 0.9em;
}
/* line 359, ../sass/screen.scss */
/* line 357, ../sass/screen.scss */
.container .aside-wrap + .content {
max-width: 70%;
}
/* line 364, ../sass/screen.scss */
/* line 362, ../sass/screen.scss */
.calendar {
color: rgba(0, 0, 0, 0.8);
width: 200px;
}
/* line 368, ../sass/screen.scss */
/* line 366, ../sass/screen.scss */
.calendar td, .calendar th {
text-align: center;
vertical-align: middle;
border: 2px solid transparent;
padding: 1px;
}
/* line 375, ../sass/screen.scss */
/* line 373, ../sass/screen.scss */
.calendar th {
font-weight: bold;
}
/* line 379, ../sass/screen.scss */
/* line 377, ../sass/screen.scss */
.calendar td {
font-size: 0.8em;
width: 28px;
height: 28px;
}
/* line 384, ../sass/screen.scss */
/* line 382, ../sass/screen.scss */
.calendar td.out {
opacity: 0.3;
}
/* line 387, ../sass/screen.scss */
/* line 385, ../sass/screen.scss */
.calendar td.today {
border-bottom-color: #000;
}
/* line 390, ../sass/screen.scss */
/* line 388, ../sass/screen.scss */
.calendar td:nth-child(7), .calendar td:nth-child(6) {
background: rgba(0, 0, 0, 0.2);
}
/* line 393, ../sass/screen.scss */
/* line 391, ../sass/screen.scss */
.calendar td.hasevent {
position: relative;
font-weight: bold;
color: #90001C;
font-size: 1em;
}
/* line 399, ../sass/screen.scss */
/* line 397, ../sass/screen.scss */
.calendar td.hasevent > a {
padding: 3px;
color: #90001C !important;
}
/* line 404, ../sass/screen.scss */
/* line 402, ../sass/screen.scss */
.calendar td.hasevent ul.cal-events {
text-align: left;
display: none;
@ -492,11 +491,11 @@ article:last-child {
padding: 5px;
background-color: #90001C;
}
/* line 417, ../sass/screen.scss */
/* line 415, ../sass/screen.scss */
.calendar td.hasevent ul.cal-events .datename {
display: none;
}
/* line 420, ../sass/screen.scss */
/* line 418, ../sass/screen.scss */
.calendar td.hasevent ul.cal-events:before {
top: -12px;
left: 38px;
@ -505,33 +504,33 @@ article:last-child {
border: 6px solid transparent;
border-bottom-color: #90001C;
}
/* line 428, ../sass/screen.scss */
/* line 426, ../sass/screen.scss */
.calendar td.hasevent ul.cal-events a {
color: #fff;
}
/* line 433, ../sass/screen.scss */
/* line 431, ../sass/screen.scss */
.calendar td.hasevent > a:hover {
background-color: #90001C;
color: #fff !important;
}
/* line 437, ../sass/screen.scss */
/* line 435, ../sass/screen.scss */
.calendar td.hasevent > a:hover + ul.cal-events {
display: block;
}
/* line 445, ../sass/screen.scss */
/* line 443, ../sass/screen.scss */
#calendar-wrap .details {
border-top: 1px solid #90001C;
margin-top: 15px;
padding-top: 10px;
}
/* line 450, ../sass/screen.scss */
/* line 448, ../sass/screen.scss */
#calendar-wrap .details li.datename {
font-weight: bold;
font-size: 1.1em;
margin-bottom: 5px;
}
/* line 451, ../sass/screen.scss */
/* line 449, ../sass/screen.scss */
#calendar-wrap .details li.datename:after {
content: " :";
}

View file

@ -3,8 +3,6 @@
* Import this file using the following HTML or equivalent:
* <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
@import url('https://fonts.googleapis.com/css?family=Carter+One|Source+Sans+Pro:300,300i,700');
@import "compass/reset";
@import "_colors";

View file

@ -5,6 +5,8 @@
<head>
<meta charset="utf-8">
<title>{% block title %}Association des élèves de l'ENS Ulm{% endblock %}</title>
<link rel="stylesheet" type="text/css" href="{% static "fonts/CarterOne/carterOne.css" %}"/>
<link rel="stylesheet" type="text/css" href="{% static "fonts/SourceSansPro/sourceSansPro.css" %}"/>
<link rel="stylesheet" type="text/css" href="{% static "cofcms/css/screen.css" %}"/>
{% block extra_head %}{% endblock %}
</head>

View file

@ -0,0 +1,10 @@
/* carter-one-regular - latin */
@font-face {
font-family: 'Carter One';
font-style: normal;
font-weight: 400;
src: local('Carter One'), local('CarterOne'),
url('./fonts/carter-one-v11-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('./fonts/carter-one-v11-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

View file

@ -0,0 +1,30 @@
/* source-sans-pro-300 - latin */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 300;
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
url('./fonts/source-sans-pro-v13-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('./fonts/source-sans-pro-v13-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* source-sans-pro-300italic - latin */
@font-face {
font-family: 'Source Sans Pro';
font-style: italic;
font-weight: 300;
src: local('Source Sans Pro Light Italic'), local('SourceSansPro-LightItalic'),
url('./fonts/source-sans-pro-v13-latin-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('./fonts/source-sans-pro-v13-latin-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* source-sans-pro-700 - latin */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 700;
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'),
url('./fonts/source-sans-pro-v13-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
url('./fonts/source-sans-pro-v13-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}