Ajout d'une CSS print
This commit is contained in:
parent
82cac0dc35
commit
151e1d20f5
3
404.html
3
404.html
|
@ -23,7 +23,8 @@
|
|||
<!-- Favicon -->
|
||||
<link rel="icon" href="images/favicon.svg">
|
||||
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="stylesheet" href="includes/style.css" media="screen">
|
||||
<link rel="stylesheet" href="includes/print.css" media="print">
|
||||
|
||||
<!-- Matomo -->
|
||||
<script type="text/javascript">
|
||||
|
|
224
includes/print.css
Normal file
224
includes/print.css
Normal file
|
@ -0,0 +1,224 @@
|
|||
/**
|
||||
Généralités
|
||||
*/
|
||||
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
src: local("Monserrat Regular"),
|
||||
url('../fonts/Montserrat/montserrat-regular-webfont.woff2') format('woff2'),
|
||||
url('../fonts/Montserrat/montserrat-regular-webfont.woff') format('woff');
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
src: local("Monserrat SemiBold"),
|
||||
url('../fonts/Montserrat/montserrat-semibold-webfont.woff2') format('woff2'),
|
||||
url('../fonts/Montserrat/montserrat-semibold-webfont.woff') format('woff');
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
:root {
|
||||
--blue: #008dc6;
|
||||
--citrus: #90ca28;
|
||||
--dark-grey: #5b5b5b;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-size: 16pt;
|
||||
font-family: "Montserrat", sans-serif;
|
||||
position: relative;
|
||||
line-height: 1.3;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-variant: small-caps;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.featured {
|
||||
color: var(--citrus);
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
/***
|
||||
** éléments à masquer
|
||||
***/
|
||||
|
||||
.toggle,
|
||||
section.content nav,
|
||||
.toggle-accordion-content,
|
||||
.accordion-close,
|
||||
.project-buttons,
|
||||
.mentions nav,
|
||||
.err404 .half.blue {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/**
|
||||
Accueil / Fond
|
||||
*/
|
||||
|
||||
header .half {
|
||||
position: relative;
|
||||
height: 110pt;
|
||||
}
|
||||
|
||||
header .half p {
|
||||
position: absolute;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
header p.slogan {
|
||||
bottom: 5em;
|
||||
width: 100vw;
|
||||
height: 1em;
|
||||
margin: auto;
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
}
|
||||
header .name {
|
||||
width: 5.5em;
|
||||
/*! padding-left: 5px; */
|
||||
text-transform: uppercase;
|
||||
font-size: 3.2em;
|
||||
font-weight: 600;
|
||||
line-height: 0.7em;
|
||||
left: calc(50vw - 2.75em);
|
||||
}
|
||||
|
||||
header .name span.mar {
|
||||
letter-spacing: -2px;
|
||||
}
|
||||
|
||||
header .name span.cha {
|
||||
letter-spacing: -0.09em;
|
||||
}
|
||||
|
||||
header .name span.ha {
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
|
||||
header .white .name {
|
||||
bottom: -0.06em;
|
||||
}
|
||||
|
||||
header .blue .name {
|
||||
top: .055em;
|
||||
}
|
||||
|
||||
header .name span.light {
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
header .white {
|
||||
margin: 0;
|
||||
color: var(--blue);
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
header .blue {
|
||||
color: white;
|
||||
background-color: var(--blue);
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Contenu
|
||||
**/
|
||||
|
||||
.resume {
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
/* LISTES FUNKY */
|
||||
|
||||
section .content .historique,
|
||||
section .content .picto-list {
|
||||
list-style: none;
|
||||
position: relative;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
section .content .historique li {
|
||||
position: relative;
|
||||
padding-left: 2.5em;
|
||||
margin-bottom: 0.6em;
|
||||
}
|
||||
|
||||
section .content .historique span.date {
|
||||
position: absolute;
|
||||
width: 2.3em;
|
||||
height: 1em;
|
||||
font-size: 0.8em;
|
||||
left: 0;
|
||||
top: 3px;
|
||||
color: var(--blue);
|
||||
}
|
||||
|
||||
section .content .picto-list li {
|
||||
position: relative;
|
||||
padding-left: 2.3em;
|
||||
margin-bottom: 0.8em;
|
||||
}
|
||||
|
||||
section .content .picto-list svg {
|
||||
position: absolute;
|
||||
width: 2.3em;
|
||||
height: 2em;
|
||||
font-size: 0.7em;
|
||||
left: 0;
|
||||
top: 3px;
|
||||
color: var(--citrus);
|
||||
}
|
||||
|
||||
section .content .historique span.detail {
|
||||
font-style: italic;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
/* --- */
|
||||
|
||||
|
||||
/* ICONES CONTACT */
|
||||
|
||||
.contact {
|
||||
padding-left : 1.5em;
|
||||
}
|
||||
|
||||
.contact .button {
|
||||
display: block;
|
||||
position: relative;
|
||||
margin-top: -1.1em;
|
||||
margin-left: -1.5em;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
.contact .button svg {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
color: var(--blue);
|
||||
}
|
||||
|
||||
/* --- */
|
||||
|
||||
|
||||
/* 404 */
|
||||
|
||||
|
||||
.err404 .half.white .err404 {
|
||||
font-size: 5em;
|
||||
}
|
|
@ -1,12 +1,11 @@
|
|||
/**
|
||||
Généralités
|
||||
*/
|
||||
/* polices à mettre en font-face une fois largeurs déterminées*/
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
src: local("Monserrat Regular"),
|
||||
url('fonts/Montserrat/montserrat-regular-webfont.woff2') format('woff2'),
|
||||
url('fonts/Montserrat/montserrat-regular-webfont.woff') format('woff');
|
||||
url('../fonts/Montserrat/montserrat-regular-webfont.woff2') format('woff2'),
|
||||
url('../fonts/Montserrat/montserrat-regular-webfont.woff') format('woff');
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
@ -14,8 +13,8 @@ Généralités
|
|||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
src: local("Monserrat SemiBold"),
|
||||
url('fonts/Montserrat/montserrat-semibold-webfont.woff2') format('woff2'),
|
||||
url('fonts/Montserrat/montserrat-semibold-webfont.woff') format('woff');
|
||||
url('../fonts/Montserrat/montserrat-semibold-webfont.woff2') format('woff2'),
|
||||
url('../fonts/Montserrat/montserrat-semibold-webfont.woff') format('woff');
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
}
|
|
@ -23,7 +23,8 @@
|
|||
<!-- Favicon -->
|
||||
<link rel="icon" href="images/favicon.svg">
|
||||
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="stylesheet" href="includes/style.css" media="screen">
|
||||
<link rel="stylesheet" href="includes/print.css" media="print">
|
||||
|
||||
<!-- Matomo -->
|
||||
<script type="text/javascript">
|
||||
|
|
|
@ -23,7 +23,8 @@
|
|||
<!-- Favicon -->
|
||||
<link rel="icon" href="images/favicon.svg">
|
||||
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="stylesheet" href="includes/style.css" media="screen">
|
||||
<link rel="stylesheet" href="includes/print.css" media="print">
|
||||
|
||||
<!-- Matomo -->
|
||||
<script type="text/javascript">
|
||||
|
|
Loading…
Reference in a new issue