Commit fc1696ef authored by ludi's avatar ludi

styles interview - start

parent b7e8fb5a
......@@ -15,9 +15,11 @@ body {
font-family: "Century Schoolbook", serif;
font-size: 9pt;
line-height: 12pt;
letter-spacing: .025em;
}
.bloc {
color:yellow;
}
h1,
h2,
......@@ -36,6 +38,17 @@ p + p { text-indent: 6pt; }
em { font-style: italic; }
.exergue {
font-family: "Erbar condensed";
font-weight: bold;
font-size: 20pt;
line-height: 6pt * 3;
margin-top: 6pt;
margin-bottom: 6pt;
}
/*
* Styles enquêtes
* -----------------
......@@ -60,15 +73,40 @@ em { font-style: italic; }
font-family: "Bagnard";
font-size: 15pt;
line-height: 6pt * 3;
-webkit-region-break-after: always;
}
.enquete .exergue {
font-family: "Erbar condensed";
font-weight: bold;
font-size: 20pt;
.enquete figure {
border:3px solid red;
display: block;
margin-top: 6pt;
margin-bottom: 6pt;
}
/*
* Styles interview
* -----------------
*/
.interview b {
font-family: "Century Schoolbook";
font-style: italic;
}
.interview h1 {
font-family: "Century Schoolbook";
font-size: 45pt;
line-height: 6pt * 6;
}
.interview .chapeau {
font-family: "Century Schoolbook";
font-size: 14pt;
line-height: 6pt * 3;
-webkit-region-break-after: always;
}
/*
* Styles rubriques
* -----------------
......
......@@ -12,7 +12,7 @@
</head>
<body>
<!-- PAGES -->
<div id="pages">
<div id="page 1">
<div class="paper">
<div class="page grid">
<div class="header"></div>
......@@ -20,9 +20,8 @@
<div class="body">
<div class="bloc x1 y0 w8 h2 flow-utopie"></div>
<div class="bloc x1 y2 w8 h3 flow-utopie"></div>
<div class="bloc x1 y5 w4 h3" style="background: url(sample-content/img/0026.jpg) no-repeat center center; background-size: contain" /></div>
<div class="bloc x1 y8 w4 h2 flow-utopie"></div>
<div class="bloc x5 y5 w4 h5 flow-utopie"></div>
<div class="bloc x1 y5 w4 h4 flow-utopie"></div>
<div class="bloc x5 y5 w4 h4 flow-utopie"></div>
</div>
<div class="footer"></div>
......@@ -30,7 +29,7 @@
</div>
</div>
<div id="pages">
<div id="page 2">
<div class="paper">
<div class="page grid">
<div class="header"></div>
......@@ -45,7 +44,7 @@
</div>
</div>
<div id="pages">
<div id="page 3">
<div class="paper">
<div class="page grid">
<div class="header"></div>
......@@ -60,7 +59,7 @@
</div>
</div>
<div id="pages">
<div id="page 4>
<div class="paper">
<div class="page grid">
<div class="header"></div>
......@@ -75,7 +74,7 @@
</div>
</div>
<div id="pages">
<div id="page 5">
<div class="paper">
<div class="page grid">
<div class="header"></div>
......@@ -89,7 +88,7 @@
</div>
</div>
</div>
<div id="pages">
<div id="page 6>
<div class="paper">
<div class="page grid">
<div class="header"></div>
......
......@@ -4,7 +4,9 @@ De l’utopie numéri-que au choc social
Quarante-cinq ans après les premiers pas de l’homme sur la Lune, la course technologique emprunte une voie singulière : en janvier dernier, un réfrigérateur connecté à Internet envoyait inopinément des rafales de courriels indésirables... Au-delà de son folklore, la numérisation de la vie quotidienne engendre un modèle économique qui contraste avec les promesses mirifiques de la Silicon Valley.
{: .chapeau}
<!-- 0026.jpg : image en entrée sur la première colonne -->
<figure>
<img src="../img/0026.jpg" alt="0026.jpg">
</figure>
Dans la «&nbsp;salle de bains connectée&nbsp;», la brosse à dents interactive lancée cette année par la société Oral-B (filiale du groupe Procter & Gamble) tient assurément la vedette : elle interagit — sans fil — avec notre téléphone portable tandis que, sur l’écran, une application traque seconde par seconde la progression du brossage et indique les recoins de notre cavité buccale qui mériteraient davantage d’attention. Avons-nous brossé avec suffisamment de vigueur, passé le fil dentaire, gratté la langue, rincé le tout ?
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment