Pug: Tweaks to components

This commit is contained in:
2018-09-06 12:59:48 +02:00
parent 5a36888f61
commit 982047fc3b

View File

@@ -1,13 +1,28 @@
// {#
// Header of landing pages. title or text can be skipped: // Header of landing pages. title or text can be skipped:
// +jumbotron("{{ page_title }}", null, "{{ page_header_image }}") // +jumbotron("{{ page_title }}", null, "{{ page_header_image }}")
// Any extra attributes added (in a separate group) will be passed as is: // Any extra attributes added (in a separate group) will be passed as is:
// +jumbotron("{{ page_title }}", null, "{{ page_header_image }}")(data-node-id='{{ node._id }}') // +jumbotron("{{ page_title }}", null, "{{ page_header_image }}")(data-node-id='{{ node._id }}')
mixin jumbotron(title, text, image) // #}
.jumbotron.jumbotron-overlay.text-white.mb-1(style='background-image: url(' + image + ');')&attributes(attributes) mixin jumbotron(title, text, image, url)
if url
a.jumbotron.jumbotron-overlay.text-white(
style='background-image: url(' + image + ');',
href=url)&attributes(attributes)
.container .container
.row .row
.col-md-8 .col-md-9
if title
.display-4.text-uppercase.font-weight-bold
=title
if text
.lead
=text
else
.jumbotron.jumbotron-overlay.text-white(style='background-image: url(' + image + ');')&attributes(attributes)
.container
.row
.col-md-9
if title if title
.display-4.text-uppercase.font-weight-bold .display-4.text-uppercase.font-weight-bold
=title =title
@@ -15,12 +30,12 @@ mixin jumbotron(title, text, image)
.lead .lead
=text =text
// Secondary navigation. // {# Secondary navigation.
// e.g. Workshops, Courses. // e.g. Workshops, Courses. #}
mixin nav-secondary(title) mixin nav-secondary(title)
ul.nav.nav-secondary.justify-content-center.mb-5 ul.nav.nav-secondary&attributes(attributes)
if title if title
li.nav-item.font-weight-bold li.font-weight-bold.px-2
=title =title
if block if block
@@ -33,7 +48,7 @@ mixin nav-secondary-link()
a.nav-link&attributes(attributes) a.nav-link&attributes(attributes)
block block
// Takes as argument the number of columns to use in this deck. 1-6 // {# Takes as argument the number of columns to use in this deck. 1-6 #}
mixin card-deck(columns) mixin card-deck(columns)
.card-deck.card-padless(class='card-' + columns + '-columns') .card-deck.card-padless(class='card-' + columns + '-columns')
if block if block
@@ -41,9 +56,11 @@ mixin card-deck(columns)
else else
p No cards defined. p No cards defined.
// {#
// Passes all attributes to the card. // Passes all attributes to the card.
// You can do fun stuff in a loop even like: // You can do fun stuff in a loop even like:
// +card(data-url="{{ url_for('projects.view', project_url=project.url) }}", tabindex='{{ loop.index }}') // +card(data-url="{{ url_for('projects.view', project_url=project.url) }}", tabindex='{{ loop.index }}')
// #}
mixin card() mixin card()
.card.card-fade.cursor-pointer.mb-4.js-project-go&attributes(attributes) .card.card-fade.cursor-pointer.mb-4.js-project-go&attributes(attributes)
if block if block