diff options
Diffstat (limited to 'tpl/index.pug')
-rw-r--r-- | tpl/index.pug | 47 |
1 files changed, 40 insertions, 7 deletions
diff --git a/tpl/index.pug b/tpl/index.pug index c63e9f1..47dbc55 100644 --- a/tpl/index.pug +++ b/tpl/index.pug | |||
@@ -2,13 +2,14 @@ | |||
2 | let loremIpsum = 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat' | 2 | let loremIpsum = 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat' |
3 | 3 | ||
4 | include layouts/container.pug | 4 | include layouts/container.pug |
5 | |||
5 | include objects/heading.pug | 6 | include objects/heading.pug |
6 | include objects/rule.pug | 7 | include objects/rule.pug |
8 | include objects/button.pug | ||
7 | 9 | ||
8 | mixin box | 10 | mixin box |
9 | .t-raised | 11 | +container(padX=true padY=true inPage=true theme="raised") |
10 | +container(padH=true padV=true inPage=true themed=true) | 12 | block |
11 | block | ||
12 | 13 | ||
13 | 14 | ||
14 | doctype html | 15 | doctype html |
@@ -17,11 +18,11 @@ html | |||
17 | meta(charset='utf-8') | 18 | meta(charset='utf-8') |
18 | meta(name='viewport' content='width=device-width, initial-scale=1') | 19 | meta(name='viewport' content='width=device-width, initial-scale=1') |
19 | title iro-design | 20 | title iro-design |
20 | link(rel="stylesheet", href="style.css") | 21 | link(rel="stylesheet" href="style.css") |
21 | script(src="script.js") | 22 | script(src="script.js") |
22 | 23 | ||
23 | body(class='t-lighter') | 24 | body(class='t-lighter') |
24 | +container(padH=true padV=true narrow=true) | 25 | +container(padX=true padY=true narrow=true) |
25 | 26 | ||
26 | +h1-heading(level='xl')= 'Heading' | 27 | +h1-heading(level='xl')= 'Heading' |
27 | +rule(level='medium') | 28 | +rule(level='medium') |
@@ -58,3 +59,35 @@ html | |||
58 | +rule(level='strong')= 'Strong' | 59 | +rule(level='strong')= 'Strong' |
59 | +rule(level='medium')= 'Medium' | 60 | +rule(level='medium')= 'Medium' |
60 | +rule(level='faint')= 'Faint' | 61 | +rule(level='faint')= 'Faint' |
62 | |||
63 | //----------------------------------------- | ||
64 | |||
65 | +h1-heading(level='xl')= 'Button' | ||
66 | +rule(level='medium') | ||
67 | |||
68 | +box | ||
69 | +a-button(variant='accent')= 'Button' | ||
70 | = ' ' | ||
71 | +a-button(variant='accent' disabled=true)= 'Button' | ||
72 | = ' ' | ||
73 | +a-button(variant='accent' outline=true)= 'Button' | ||
74 | = ' ' | ||
75 | +a-button(variant='accent' outline=true disabled=true)= 'Button' | ||
76 | br | ||
77 | br | ||
78 | +a-button(variant='primary')= 'Button' | ||
79 | = ' ' | ||
80 | +a-button(variant='primary' disabled=true)= 'Button' | ||
81 | = ' ' | ||
82 | +a-button(variant='primary' outline=true)= 'Button' | ||
83 | = ' ' | ||
84 | +a-button(variant='primary' outline=true disabled=true)= 'Button' | ||
85 | br | ||
86 | br | ||
87 | +a-button(variant='secondary')= 'Button' | ||
88 | = ' ' | ||
89 | +a-button(variant='secondary' disabled=true)= 'Button' | ||
90 | = ' ' | ||
91 | +a-button(variant='secondary' outline=true)= 'Button' | ||
92 | = ' ' | ||
93 | +a-button(variant='secondary' outline=true disabled=true)= 'Button' | ||