[enh] stylish full picture titles

This commit is contained in:
Laurent Peuch 2015-12-08 05:35:58 +01:00
parent 791921e586
commit 8e83ee237c
2 changed files with 27 additions and 3 deletions

View File

@ -40,6 +40,30 @@ section {
display: flex; display: flex;
} }
.full-picture h1 {
text-transform: uppercase;
font-size: 5.5vw;
letter-spacing: 4px;
font-family: sans-serif;
margin-left: 10%;
margin-right: 10%;
margin-bottom: 1px;
}
.full-picture h2 {
font-weight: normal;
font-style: italic;
font-size: 2.2vw;
font-family: serif;
margin-top: 1px;
}
.full-picture .datetime {
text-transform: uppercase;
font-family: serif;
letter-spacing: 2px;
}
.bordered-picture img { .bordered-picture img {
height: 80%; height: 80%;
width: 80%; width: 80%;

View File

@ -13,9 +13,9 @@
<section class="full-picture" style="background: transparent url('./1.png') no-repeat scroll center top / cover;"> <section class="full-picture" style="background: transparent url('./1.png') no-repeat scroll center top / cover;">
<div class="picture-text"> <div class="picture-text">
<div class="picture-text-column"> <div class="picture-text-column">
<h2>Some title on the picture</h2> <h1>Some title on the picture</h1>
<h3>Some subtitle</h3> <h2>Some subtitle</h2>
<div class="gallery-datetime">3 march 2015</div> <div class="datetime">march 3th 2015</div>
</div> </div>
</div> </div>
</section> </section>