bachir
/
materio-d9
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
web/themes/custom/materiotheme/assets/dist/main.js vendored
View File

File diff suppressed because one or more lines are too long

26
web/themes/custom/materiotheme/assets/styles/main.scss
View File

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

1
web/themes/custom/materiotheme/vuejs/components/Content/Card.vue
View File

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