From 56779990f3a92b8f33ab807453cbcad5b6632bca Mon Sep 17 00:00:00 2001 From: Arnaud Freismuth Date: Tue, 15 Oct 2024 16:49:24 +0200 Subject: [PATCH] Improve style --- src/atom/_atom.scss | 2 ++ src/atom/atom.pug | 4 +++- src/atom/paragraph/_paragraph.scss | 5 +++++ src/atom/paragraph/paragraph.code.pug | 3 +++ src/atom/paragraph/paragraph.md | 1 + src/atom/paragraph/paragraph.mixin.pug | 3 +++ src/atom/paragraph/paragraph.render.pug | 4 ++++ src/atom/title/_title.scss | 6 ++++++ src/atom/title/title.code.pug | 3 +++ src/atom/title/title.md | 1 + src/atom/title/title.mixin.pug | 3 +++ src/atom/title/title.render.pug | 4 ++++ src/head.mixin.pug | 8 ++++++++ src/index.pug | 14 ++++++++++++-- src/tikui.scss | 2 +- 15 files changed, 59 insertions(+), 4 deletions(-) create mode 100644 src/atom/_atom.scss create mode 100644 src/atom/paragraph/_paragraph.scss create mode 100644 src/atom/paragraph/paragraph.code.pug create mode 100644 src/atom/paragraph/paragraph.md create mode 100644 src/atom/paragraph/paragraph.mixin.pug create mode 100644 src/atom/paragraph/paragraph.render.pug create mode 100644 src/atom/title/_title.scss create mode 100644 src/atom/title/title.code.pug create mode 100644 src/atom/title/title.md create mode 100644 src/atom/title/title.mixin.pug create mode 100644 src/atom/title/title.render.pug create mode 100644 src/head.mixin.pug diff --git a/src/atom/_atom.scss b/src/atom/_atom.scss new file mode 100644 index 0000000..bde2db0 --- /dev/null +++ b/src/atom/_atom.scss @@ -0,0 +1,2 @@ +@use 'paragraph/paragraph'; +@use 'title/title'; diff --git a/src/atom/atom.pug b/src/atom/atom.pug index 6925138..9f880bf 100644 --- a/src/atom/atom.pug +++ b/src/atom/atom.pug @@ -13,4 +13,6 @@ block content .tikui-vertical-spacing--line include /documentation/atomic-design/quote/atom .tikui-vertical-spacing--line - // Atoms componentDoc + include:componentDoc(height=100) paragraph/paragraph.md + .tikui-vertical-spacing--line + include:componentDoc(height=100) title/title.md diff --git a/src/atom/paragraph/_paragraph.scss b/src/atom/paragraph/_paragraph.scss new file mode 100644 index 0000000..92a4a06 --- /dev/null +++ b/src/atom/paragraph/_paragraph.scss @@ -0,0 +1,5 @@ +.paragraph { + margin: 0; + font-family: sans-serif; + color: #223344; +} diff --git a/src/atom/paragraph/paragraph.code.pug b/src/atom/paragraph/paragraph.code.pug new file mode 100644 index 0000000..0e68c5d --- /dev/null +++ b/src/atom/paragraph/paragraph.code.pug @@ -0,0 +1,3 @@ +include paragraph.mixin.pug + ++paragraph My paragraph diff --git a/src/atom/paragraph/paragraph.md b/src/atom/paragraph/paragraph.md new file mode 100644 index 0000000..ca713d4 --- /dev/null +++ b/src/atom/paragraph/paragraph.md @@ -0,0 +1 @@ +## Paragraph diff --git a/src/atom/paragraph/paragraph.mixin.pug b/src/atom/paragraph/paragraph.mixin.pug new file mode 100644 index 0000000..2747dc4 --- /dev/null +++ b/src/atom/paragraph/paragraph.mixin.pug @@ -0,0 +1,3 @@ +mixin paragraph + p.paragraph + block diff --git a/src/atom/paragraph/paragraph.render.pug b/src/atom/paragraph/paragraph.render.pug new file mode 100644 index 0000000..24c3735 --- /dev/null +++ b/src/atom/paragraph/paragraph.render.pug @@ -0,0 +1,4 @@ +extends /layout + +block body + include paragraph.code.pug diff --git a/src/atom/title/_title.scss b/src/atom/title/_title.scss new file mode 100644 index 0000000..e67f4b1 --- /dev/null +++ b/src/atom/title/_title.scss @@ -0,0 +1,6 @@ +.title { + margin: 0; + color: #234; + font-size: 4rem; + font-family: sans-serif; +} diff --git a/src/atom/title/title.code.pug b/src/atom/title/title.code.pug new file mode 100644 index 0000000..0791a42 --- /dev/null +++ b/src/atom/title/title.code.pug @@ -0,0 +1,3 @@ +include title.mixin.pug + ++title My title diff --git a/src/atom/title/title.md b/src/atom/title/title.md new file mode 100644 index 0000000..65e1cf4 --- /dev/null +++ b/src/atom/title/title.md @@ -0,0 +1 @@ +## Title diff --git a/src/atom/title/title.mixin.pug b/src/atom/title/title.mixin.pug new file mode 100644 index 0000000..c99d2ac --- /dev/null +++ b/src/atom/title/title.mixin.pug @@ -0,0 +1,3 @@ +mixin title + h1.title + block diff --git a/src/atom/title/title.render.pug b/src/atom/title/title.render.pug new file mode 100644 index 0000000..fe37e28 --- /dev/null +++ b/src/atom/title/title.render.pug @@ -0,0 +1,4 @@ +extends /layout + +block body + include title.code.pug diff --git a/src/head.mixin.pug b/src/head.mixin.pug new file mode 100644 index 0000000..8de2cf1 --- /dev/null +++ b/src/head.mixin.pug @@ -0,0 +1,8 @@ +mixin head + head + meta(charset='utf-8') + block title + title Mon site web + link(rel='icon' type='image/png' href='[[TIKUI_BASEPATH]]favicon.png') + link(href='[[TIKUI_BASEPATH]]tikui.css' rel='stylesheet') + diff --git a/src/index.pug b/src/index.pug index 5a6193f..9ac53ac 100644 --- a/src/index.pug +++ b/src/index.pug @@ -1,2 +1,12 @@ -block body - p Bonjour +include /head.mixin.pug +include /atom/title/title.mixin.pug +include /atom/paragraph/paragraph.mixin.pug + +doctype html +html(lang='fr') + +head + body + +title Mon site web à déployer + +paragraph Mon site web fonctionne bien en local et j'en suis fier 💪 + +paragraph Pendant ce live, voyons comment le déployer ! + :reload diff --git a/src/tikui.scss b/src/tikui.scss index 9284f7d..3a615f1 100644 --- a/src/tikui.scss +++ b/src/tikui.scss @@ -1 +1 @@ -// stylelint-disable-line no-empty-source +@use 'atom/atom';