mirror
/
wagtail-bakerydemo
kopia lustrzana https://github.com/wagtail/bakerydemo
1
0
Forkuj 0
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność

Styling of feature-2 and feature-3 on homepage. Workson #58

pull/80/head
Edd Baldry 2017-03-01 22:21:35 +00:00
rodzic 5e3591aa98
commit c3060a8736
2 zmienionych plików z 44 dodań i 7 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

31
bakerydemo/static/css/main.css
Wyświetl plik

@ -1003,16 +1003,41 @@ span.outline {
padding: 40px 0 20px;
}
.homepage .feature-2 .feature-2-row {
display: flex;
}
.homepage .feature-2 h2,
.homepage .feature-3 h2 {
text-align: center;
margin-bottom: 20px;
}
.homepage .feature-2 img {
.homepage .feature-2 .feature-2-item {
display: flex;
flex-direction: column;
}
.homepage .feature-2 .feature-2-item figure {
margin-bottom: 0;
}
.homepage .feature-2 .feature-2-item img {
min-height: 210px;
}
.homepage .feature-2 .feature-2-item .feature-2-text {
background-color: #dfdfdf;
border-radius: 0 0 10px 10px;
padding: 0 20px;
flex: 1;
}
.homepage .feature-2 figure,
.homepage .feature-3 figure {
background-color: #eb7400;
margin: 0;
}
.homepage .feature-3 h3 {
color: #fff;
font-weight: 300;
@ -1024,6 +1049,10 @@ span.outline {
text-shadow: 0px 0px 30px rgba(0, 0, 0, 1);
z-index: 1;
}
.homepage .feature-2 li:hover img,
.homepage .feature-3 li:hover img {
opacity: 0.3;
}
/* No gutters */
.row.no-gutters {
margin-right: 0;

20
bakerydemo/templates/base/home_page.html
Wyświetl plik

@ -73,12 +73,18 @@
<div class="col-md-12 feature-2">
{% if page.featured_section_2 %}
<h2>{{ page.featured_section_2_title }}</h2>
<div class="featured-children row">
<div class="featured-children row feature-2-row">
{% for childpage in page.featured_section_2.specific.children|slice:"3" %}
<li class="col-md-4">
{% image childpage.image height-210 %}
<h3><a href="{{childpage.url}}">{{childpage.title}}</a></h3>
<p>{{ childpage.introduction|truncatewords:15 }}</p>
<li class="col-md-4 feature-2-item">
<a href="{{childpage.url}}">
<figure>
{% image childpage.image height-210 %}
</figure>
</a>
<div class="feature-2-text">
<h3><a href="{{childpage.url}}">{{childpage.title}}</a></h3>
<p>{{ childpage.introduction|truncatewords:15 }}</p>
</div>
</li>
{% endfor %}
</div>
@ -96,7 +102,9 @@
{% for childpage in page.featured_section_3.specific.children|slice:"6" %}
<li class="col-md-4">
<a href="{{childpage.url}}">
{% image childpage.image width-380 %}
<figure>
{% image childpage.image width-380 %}
</figure>
<h3>{{childpage.title}}</h3>
</a>
</li>