improved card header styling

This commit is contained in:
Bachir Soussi Chiadmi 2019-06-12 13:21:06 +02:00
parent 7acac41863
commit 5d57f0e32a
3 changed files with 24 additions and 9 deletions

File diff suppressed because one or more lines are too long

View File

@ -241,22 +241,36 @@ article.node--type-frontpage{
.card{
position: relative;
width:210px; height:295px;
box-shadow: 0 0 5px rgba(0,0,0,0.2);
// focused
// box-shadow: 0 0 7px rgba(0,0,0,0.9);
header{
position: absolute;
bottom:0;
z-index:10;
color: #fff;
background-color: rgba(0,0,0,0.5);
color: #000;
background-color: rgba(255,255,255,0.8);
padding: 0.3em 0.3em;
box-sizing:border-box;
width:100%;
h1, h4{ margin:0; padding:0; }
h1{
font-size: 1.5em;
font-size: 1.3em;
font-weight: 700;
line-height: 0.8;
margin-bottom: 0.2em;
}
h4{
font-size: 1em;
font-weight: normal;
font-size: 0.882em;
font-weight: 300;
line-height: 1;
// margin-bottom: 0.1em;
}
span.ref{
font-size: 0.693em;
font-weight: 300;
line-height: 1;
}
}
section.images{
position: relative;

View File

@ -3,6 +3,7 @@
<header>
<h1>{{ item.title }}</h1>
<h4>{{ item.description }}</h4>
<span class="ref">{{ item.reference }}</span>
</header>
<section class="images" v-switcher>
<figure