Websites
/
lektor-website
mirror of https://github.com/lektor/lektor-website.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Improved rendering of banners and simplified model

This commit is contained in:
Armin Ronacher 2015-12-26 10:52:00 +01:00
parent e1fb298946
commit d9e7456c45
6 changed files with 24 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
assets/static/styles.css
View File

File diff suppressed because one or more lines are too long

2
content/contents.lr
View File

@ -9,8 +9,6 @@ image: header.jpg
---- ----
height: 500 height: 500
---- ----
class: dark
----
contents: contents:
<div class="container lektor-intro"> <div class="container lektor-intro">

4
content/docs/guides/sitemap/contents.lr
View File

@ -23,6 +23,10 @@ _model: none
This instructs Lektor to use the template `sitemap.xml` for this page. We This instructs Lektor to use the template `sitemap.xml` for this page. We
also give it the empty `none` model for good measure. also give it the empty `none` model for good measure.
!!! Starting with Lektor 2.0 you can also add `_discoverable: no` as field
into the file to hide it from `.children`. This is useful for such special
pages which should be excluded from navigation or automatic link generation.
## Template File ## Template File
The template loaded will be `templates/sitemap.xml`. In this file we just The template loaded will be `templates/sitemap.xml`. In this file we just

13
flowblocks/banner.ini
View File

@ -6,23 +6,16 @@ button_label = [[flag]]
label = Image label = Image
type = select type = select
source = record.attachments.images source = record.attachments.images
width = 2/4 width = 3/4
[fields.height] [fields.height]
label = Height label = Height
type = select type = select
choices = half, full, 500, 300 choices = 500, 300
choice_labels = Half, Full, 500px, 300px choice_labels = 500px, 300px
default = 300 default = 300
width = 1/4 width = 1/4
[fields.class]
label = Class
type = select
choices = dark
choice_labels = Dark
width = 1/4
[fields.contents] [fields.contents]
label = Contents label = Contents
type = html type = html

7
templates/blocks/banner.html
View File

@ -1,8 +1,5 @@
{% set image = record.attachments.get(this.image) %} {% set image = record.attachments.get(this.image) %}
<div class="banner{% if this.class %} banner-{{ this.class }}{% endif %}" style="background-image: url({{ image|url <div class="banner banner-{{ this.height }}" style="background-image: url({{ image|url
}}); height: {{ { }})">{% if this.contents %}
'full': image.height,
'half': image.height / 2,
}.get(this.height, this.height) }}px">{% if this.contents %}
{{ this.contents }} {{ this.contents }}
{% endif %}</div> {% endif %}</div>

18
webpack/scss/main.scss
View File

@ -103,7 +103,7 @@ div.slideshow {
height: auto; height: auto;
overflow: auto; overflow: auto;
background: lighten($gray, 55) url(../images/dark-curls.png); background: lighten($gray, 55) url(../images/dark-curls.png);
box-shadow: inset 0 0 10px darken($lektor-header-bg, 5); box-shadow: inset 0 0 10px fade-out(darken($lektor-header-bg, 5), 0.8);
color: white; color: white;
div.slideshow-inner { div.slideshow-inner {
@ -259,14 +259,24 @@ div.banner {
margin: 15px 0; margin: 15px 0;
background-size: cover; background-size: cover;
background-position: center center; background-position: center center;
background-color: $lektor-header-bg;
&:first-child { &:first-child {
margin-top: 0; margin-top: 0;
box-shadow: 0 4px 10px fade-out($gray, 0.8);
} }
&.banner-dark { &.banner-500 {
background-color: $lektor-header-bg; height: 500px;
@media (max-width: $screen-md-max) { height: 300px; }
@media (max-width: $screen-sm-max) { height: 200px; }
}
&.banner-300 {
height: 300px;
@media (max-width: $screen-md-max) { height: 200px; }
@media (max-width: $screen-sm-max) { height: 120px; }
} }
} }