prenex/magcms
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[enh] yay, start to display text on picture

Browse Source
This commit is contained in:
Laurent Peuch 2015-12-05 01:40:15 +01:00
parent 182982b99a
commit 791921e586
2 changed files with 26 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
materialize/css/style-page.css
View File

@ -21,6 +21,25 @@ section {
min-height: 250px;
}
.full-picture > .picture-text {
position: relative;
top: 0px;
left: 0px;
z-index: 555;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: white;
background-color: rgba(0, 0, 0, .4);
}
.full-picture > .picture-text > .picture-text-colum {
display: flex;
}
.bordered-picture img {
height: 80%;
width: 80%;

7
templates/page-example.html
View File

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