Commit 03c91947 authored by sarah's avatar sarah
Browse files

home page more organic

parent fb371ff7
......@@ -29,11 +29,14 @@
<figure class="live-pict ref">
<img src="pict/Screenshot_20200330_092828.png" />
<figcaption><p>Extrait de <span class="extract-title">Pirou-Plage</span>, Agnès Varda</p><span class="date">— 02.03.2020, posted from Pauline's phone</span></figcaption>
<figcaption><p>Extrait de <span class="extract-title">Pirou-Plage</span>, Agnès Varda</p></figcaption>
<span class="date">— 02.03.2020, posted from Pauline's phone</span>
</figure>
<div class="project">
<h2>Caberdouche</h2>
<div class="project-cover"></div>
<figure class="projects-pict">
<img src="pict/caberdouche/Caberdouche_10.jpg" />
<figcaption><p>Aménagement intérieur, scénographie, muséographie du Centre d’Interprétation de la Maison Losseau</p></figcaption>
......@@ -77,7 +80,7 @@
</figure>
<figure class="live-quotes"><p>«&nbsp;Les compétences des deux associées sont complémentaires. Valentin prends davantage en charge les questions techniques et constructives, et Pauline les questions relatives à la communication et l’administration. Nous restons cependant attentifs à ne pas nous enfermer dans des attributions “confortables” ou caricaturales vis à vis de nos compétences et restons très attachés à la figure de l'“architecte généraliste”.&nbsp;»</p><figcaption><p>Valentin Bollaert</p> <span class="date">— 02.03.2020, posted from Pauline's phone</span></figcaption></figure>
<figure class="live-pict text-ref"><p>«&nbsp;Les compétences des deux associées sont complémentaires. Valentin prends davantage en charge les questions techniques et constructives, et Pauline les questions relatives à la communication et l’administration. Nous restons cependant attentifs à ne pas nous enfermer dans des attributions “confortables” ou caricaturales vis à vis de nos compétences et restons très attachés à la figure de l'“architecte généraliste”.&nbsp;»</p><figcaption><p>Valentin Bollaert</p> <span class="date">— 02.03.2020, posted from Pauline's phone</span></figcaption></figure>
<figure class="live-pict projects-pict">
<img src="pict/IMG_20170612_093324.jpg" />
......
......@@ -103,7 +103,7 @@ main {
.grid--container {
display: grid;
/* outline: 1px dotted cyan; */
grid-template-columns: 1fr 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
column-gap: 14pt;
row-gap: 14pt;
grid-auto-flow: row;
......@@ -118,9 +118,12 @@ img {
width: 100%;
}
.live-pict.ref {
background: #d4ddd8;;
background: #d4ddd8;
padding: 70px;
color: black;
grid-column-end: span 3;
grid-column-start: 4;
}
/*.live-pict.ref:hover {
background: black;
......@@ -133,31 +136,62 @@ img {
.projects-plan img{
max-width: 650px;
}*/
.live-pict {
grid-column-end: span 2;
}
.live-quotes {
background-image: linear-gradient(141deg, #ff9955, white);
padding: 40px;
height: max-content;
grid-column-end: span 2;
}
.live-quotes > p {
font-family: 'Spectral';
font-weight: 600;
font-size: 1.8em;
line-height: 1.05em;
font-size: 2.7em;
line-height: 1em;
}
.live-pict.text-ref {
background: #d4ddd8;
padding: 40px;
height: max-content;
grid-column-end: span 2;
}
.live-pict.text-ref > p {
font-family: 'Spectral';
font-weight: 500;
font-size: 1.3em;
line-height: 1.05em;
}
.project {
position: relative;
border: 4px dashed;
grid-column-start: 2;
grid-column-start: span 6;
max-height: 300px;
overflow: hidden;
width: 100%;
}
.project h2 {
position: absolute;
z-index: 100;
font-size: 3em;
padding: 30px;
font-family: Spectral;
color: #d4ddd8;
display: inline-block;
margin: auto;
text-align: center;
width: 100%;
}
.project-cover {
width: 100%;
height: 100%;
background-color: black;
}
.projects-pict, .project {
align-self: center;
.projects-pict {
grid-column-start: span 2;
}
.projects-pict figcaption p {
display: none;
......
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