From bc97048dfbb05766abf0c04aed593252a3abdc88 Mon Sep 17 00:00:00 2001 From: Joris Date: Sun, 2 Feb 2020 16:51:57 +0100 Subject: Show recipe title in each recipe page --- static/main.css | 52 ++++++++++++++++++++++++++++++++++++---------------- 1 file changed, 36 insertions(+), 16 deletions(-) (limited to 'static/main.css') diff --git a/static/main.css b/static/main.css index e19d1ac..cb4fda0 100644 --- a/static/main.css +++ b/static/main.css @@ -60,6 +60,18 @@ body { margin: 1rem; } +.g-Recipe__Title { + font-size: 1.5rem; + margin-top: 1.5rem; + color: var(--color-title); +} + +.g-Recipe__SubTitle { + font-size: 1.1rem; + margin-top: 1rem; + color: var(--color-title); +} + .g-Page__Recipes { list-style-type: none; padding-left: 1rem; @@ -69,21 +81,25 @@ body { margin-bottom: 1rem; } -h1, h2, h3 { - color: var(--color-title); -} +/* Recipe */ -h1 { +.g-Recipe__Content h1 { font-size: 1.5rem; margin-top: 1.5rem; + color: var(--color-title); } -h2 { +.g-Recipe__Content h2 { font-size: 1.1rem; margin-top: 1rem; + color: var(--color-title); } -/* Recipe */ +.g-Recipe__Content h3 { + font-size: 1.1rem; + margin-top: 1rem; + color: var(--color-title); +} .g-Number { font-size: inherit; @@ -95,33 +111,33 @@ h2 { width: 5rem; } -.g-Recipe ul, -.g-Recipe ol { +.g-Recipe__Content ul, +.g-Recipe__Content ol { list-style-type: none; padding-left: 1rem; } -.g-Recipe li { +.g-Recipe__Content li { margin-bottom: 1rem; line-height: 1.5rem; } -.g-Recipe ol, -.g-Recipe ul { +.g-Recipe__Content ol, +.g-Recipe__Content ul { margin-top: 1.5rem; } -.g-Recipe ol { +.g-Recipe__Content ol { counter-reset: ol; } -.g-Recipe ol > li { +.g-Recipe__Content ol > li { padding-left: 3rem; position: relative; text-align: justify; } -.g-Recipe ol > li::before { +.g-Recipe__Content ol > li::before { display: inline; position: absolute; top: 0; @@ -137,10 +153,14 @@ h2 { text-align: center; } -.g-Recipe ol > li:hover { +.g-Recipe__Content ol > li:hover { cursor: pointer; } -.g-Recipe ol > li.g-Recipe__Completed::before { +.g-Recipe__Content ol > li.g-Recipe__Completed { + text-decoration: line-through; +} + +.g-Recipe__Content ol > li.g-Recipe__Completed::before { background-color: var(--color-completed); } -- cgit v1.2.3