summaryrefslogtreecommitdiffstats
path: root/tpl
diff options
context:
space:
mode:
Diffstat (limited to 'tpl')
-rw-r--r--tpl/objects/card.pug11
-rw-r--r--tpl/objects/divider.pug2
-rw-r--r--tpl/views/card.pug3
-rw-r--r--tpl/views/divider.pug10
4 files changed, 24 insertions, 2 deletions
diff --git a/tpl/objects/card.pug b/tpl/objects/card.pug
index 2ab9bef..e0f6a15 100644
--- a/tpl/objects/card.pug
+++ b/tpl/objects/card.pug
@@ -26,7 +26,16 @@ mixin card-image
26 classes[attributes.class] = true; 26 classes[attributes.class] = true;
27 } 27 }
28 28
29 img(class=classes src=attributes.src style=attributes.style) 29 let imgClasses = {
30 'o-card__image-img': true,
31 'l-card-list__card-image': attributes.list
32 }
33
34 div(class=classes)
35 img(class=imgClasses src=attributes.src style=attributes.style)
36 if block
37 .o-card__image-overlay
38 block
30 39
31mixin card-body 40mixin card-body
32 .o-card__body(style=attributes.style) 41 .o-card__body(style=attributes.style)
diff --git a/tpl/objects/divider.pug b/tpl/objects/divider.pug
index 46425cd..ed4d27a 100644
--- a/tpl/objects/divider.pug
+++ b/tpl/objects/divider.pug
@@ -3,6 +3,8 @@ mixin divider(level)
3 let classes = { 3 let classes = {
4 'o-divider': true, 4 'o-divider': true,
5 'o-divider--labelled': !!block, 5 'o-divider--labelled': !!block,
6 'o-divider--vertical': !!attributes.vertical,
7 'o-divider--dot': !!attributes.dot,
6 ['o-divider--' + level]: true, 8 ['o-divider--' + level]: true,
7 ['o-divider--' + attributes.color]: !!attributes.color 9 ['o-divider--' + attributes.color]: !!attributes.color
8 } 10 }
diff --git a/tpl/views/card.pug b/tpl/views/card.pug
index 633cf01..61081a9 100644
--- a/tpl/views/card.pug
+++ b/tpl/views/card.pug
@@ -36,6 +36,7 @@ mixin view-card
36 36
37 +card(quiet=true href='#' class='l-card-list__card') 37 +card(quiet=true href='#' class='l-card-list__card')
38 +card-image(src='Drawing_Half.png' style={ 'aspect-ratio': '21 / 9' }) 38 +card-image(src='Drawing_Half.png' style={ 'aspect-ratio': '21 / 9' })
39 +badge= 'Drawings'
39 +card-body 40 +card-body
40 +card-title= 'XS Heading' 41 +card-title= 'XS Heading'
41 +card-content 42 +card-content
@@ -59,7 +60,7 @@ mixin view-card
59 div(class=classes) 60 div(class=classes)
60 each img, i in ['Drawing_Half.png', '0000 Cover@0.5x.webp', 'avatar.png', '01 Design Cody.png', 'avatar.png', 'Drawing_Half.png'] 61 each img, i in ['Drawing_Half.png', '0000 Cover@0.5x.webp', 'avatar.png', '01 Design Cody.png', 'avatar.png', 'Drawing_Half.png']
61 +card(quiet=quiet href='#' class='l-card-list__card') 62 +card(quiet=quiet href='#' class='l-card-list__card')
62 +card-image(src=img class='l-card-list__card-image') 63 +card-image(src=img list=true)
63 +card-body 64 +card-body
64 .l-media 65 .l-media
65 .l-media__block.l-media__block--main 66 .l-media__block.l-media__block--main
diff --git a/tpl/views/divider.pug b/tpl/views/divider.pug
index e2f2e01..ea08984 100644
--- a/tpl/views/divider.pug
+++ b/tpl/views/divider.pug
@@ -23,6 +23,16 @@ mixin view-divider
23 +divider('medium') 23 +divider('medium')
24 +divider('faint') 24 +divider('faint')
25 25
26 .c-box
27 .l-media(style="height: 1em")
28 +divider('strong')(vertical=true class="l-media__block")
29 +divider('medium')(vertical=true class="l-media__block")
30 +divider('faint')(vertical=true class="l-media__block")
31 .l-media(style="height: 1em")
32 +divider('strong')(dot=true class="l-media__block")
33 +divider('medium')(dot=true class="l-media__block")
34 +divider('faint')(dot=true class="l-media__block")
35
26 each theme in ['accent', 'negative'] 36 each theme in ['accent', 'negative']
27 .c-box 37 .c-box
28 +divider('strong')(color=theme)= 'Strong' 38 +divider('strong')(color=theme)= 'Strong'