diff --git a/static/flyers/asymmetric/style.css b/static/flyers/asymmetric/style.css index da45d6a..8005f27 100644 --- a/static/flyers/asymmetric/style.css +++ b/static/flyers/asymmetric/style.css @@ -3,15 +3,12 @@ flex-direction: column; gap: 3mm; height: fit-content; - /*! max-height: 350mm; */ - /*! height: ; */ } .flyer-container { max-height: fit-content; min-content: 40mm; max-content: 50mm; - /* border: 1px solid rgb(253, 140, 140); */ overflow: auto; } .flyer { @@ -19,7 +16,6 @@ max-height: 50px; } - body { border: 1px solid yellow; font: 18px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; @@ -30,18 +26,14 @@ body { h1, h2, h3 { line-height: 1.2; } - h1 { - /* margin: 0 0 .2em; */ margin: 0 0 .1em; color: #ff6e40; - /* font-size: 20mm; */ - font-size: 10mm; + font-size: 14mm; } .subtitle { - font-size: 14px; + font-size: 18px; } - h3 { margin-top: 0; margin-bottom: .2em; @@ -49,11 +41,9 @@ h3 { } .intestazione { - /* padding: 1.5rem; */ padding: 0.5rem 1.5rem; display: grid; grid-template-columns: auto auto auto; - /* margin-bottom: 1.5rem; */ margin-bottom: 0.5rem; } .logo, @@ -67,7 +57,6 @@ h3 { } .logo img, .qrcode img { - /* width: 25%; */ width: 15%; } @@ -84,7 +73,6 @@ h3 { background-color: #1e1e1e; border-radius: 4px; box-shadow: 0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12); - } .event_info { margin: 0.5rem 1rem; @@ -102,11 +90,6 @@ h3 { .flex { font-size: 12px; } -.title, -.flex, -.location { - /* margin: .5rem 1rem; */ -} .center { display: flex; flex-direction: column; @@ -130,7 +113,6 @@ h3 { object-fit: cover; border-radius: 4px 4px 0 0; } - footer { width: 100%; padding: 1rem; @@ -139,15 +121,22 @@ footer { padding-left: 24px; padding-right: 24px; } +footer .flex { + display: flex; +} .contacts { padding-left: 24px; } +.contacts .flex { + font-size: initial; +} .contacts span { padding-right: 1rem; } .contacts svg { width: 1rem; fill:#c9d1d9; + margin-right: 0.3rem; } .published { text-align: right; diff --git a/static/flyers/simple/style.css b/static/flyers/simple/style.css index 3439423..1882b97 100644 --- a/static/flyers/simple/style.css +++ b/static/flyers/simple/style.css @@ -12,14 +12,12 @@ h1, h2, h3 { } h1 { - /* margin: 0 0 .2em; */ margin: 0 0 .1em; color: #ff6e40; - /* font-size: 20mm; */ - font-size: 10mm; + font-size: 14mm; } .subtitle { - font-size: 14px; + font-size: 18px; } h3 { @@ -29,11 +27,9 @@ h3 { } .intestazione { - /* padding: 1.5rem; */ padding: 0.5rem 1.5rem; display: grid; grid-template-columns: auto auto auto; - /* margin-bottom: 1.5rem; */ margin-bottom: 0.5rem; } .logo, @@ -47,18 +43,14 @@ h3 { } .logo img, .qrcode img { - /* width: 25%; */ width: 15%; } #events { display: grid; - /* grid-template-columns: 33% 33% 33%; */ grid-template-columns: auto auto auto auto; grid-template-rows: auto auto auto auto auto; - /* grid-gap: 1.5em; */ grid-gap: 0.5em; - /* border: 1px dotted black; */ padding-left: 24px; padding-right: 24px; } @@ -71,37 +63,25 @@ h3 { margin: 0.5rem 1rem; } .event_info svg { - /* height: 24px; - width: 24px; */ height: 12px; width: 12px; fill: white; margin-right: 0.2em; } .title { - /* font-size: 16px; */ font-size: 14px; } .place_name, -.flex { - /* font-size: 14px; */ +.time { font-size: 12px; } -.title, -.flex, -.location { - /* margin: .5rem 1rem; */ -} .center { display: flex; flex-direction: column; align-items: center; } -.flex, +.time, .location { - /* display: grid; - grid-template-columns: auto auto; - justify-content: start; */ display: flex; align-items: center; } @@ -115,7 +95,6 @@ h3 { .flyer { width: 100%; object-fit: cover; - /* max-height: 40mm; */ max-height: 30mm; border-radius: 4px 4px 0 0; } @@ -137,8 +116,12 @@ footer { .contacts svg { width: 1rem; fill:#c9d1d9; + margin-right: 0.3rem; } .published { text-align: right; padding-right: 24px; } +.flex { + display: flex; +} diff --git a/static/flyers/simple_white/style.css b/static/flyers/simple_white/style.css index f855a80..503981a 100644 --- a/static/flyers/simple_white/style.css +++ b/static/flyers/simple_white/style.css @@ -1,121 +1,12 @@ -body { - border: 1px solid yellow; - font: 18px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"; - color: #c9d1d9; - display: flex; - justify-content: space-between; -} - -h1, h2, h3 { - line-height: 1.2; -} - -h1 { - margin: 0 0 .1em; - color: #ff6e40; - font-size: 10mm; -} .subtitle { color: #0d1117; - font-size: 14px; } - -h3 { - margin-top: 0; - margin-bottom: .2em; - color: #ff6e40; -} - -.intestazione { - padding: 0.5rem 1.5rem; - display: grid; - grid-template-columns: auto auto auto; - margin-bottom: 0.5rem; -} -.logo, -.qrcode { - display: flex; - align-items: center; - height: 100%; -} -.qrcode { - justify-content: flex-end; -} -.logo img, -.qrcode img { - width: 15%; -} - -#events { - display: grid; - grid-template-columns: auto auto auto auto; - grid-template-rows: auto auto auto auto auto; - grid-gap: 0.5em; - padding-left: 24px; - padding-right: 24px; -} -.event { - background-color: #1e1e1e; - border-radius: 4px; - box-shadow: 0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12); -} -.event_info { - margin: 0.5rem 1rem; -} -.event_info svg { - height: 12px; - width: 12px; - fill: white; - margin-right: 0.2em; -} -.title { - font-size: 14px; -} -.place_name, -.flex { - font-size: 12px; -} -.center { - display: flex; - flex-direction: column; - align-items: center; -} -.flex, -.location { - display: flex; - align-items: center; -} -.place_name { - color: #ff6e40; -} - -.flyer { - width: 100%; - object-fit: cover; - max-height: 30mm; - border-radius: 4px 4px 0 0; -} - footer { color: #0d1117; - width: 100%; - padding: 1rem; - display: grid; - grid-template-columns: 66% 33%; - padding-left: 24px; - padding-right: 24px; -} -.contacts { - padding-left: 24px; -} -.contacts span { - padding-right: 1rem; } .contacts svg { - width: 1rem; fill:#0d1117; } -.published { - text-align: right; - padding-right: 24px; +body { + background-color: blue; } diff --git a/templates/flyers/asymmetric.html b/templates/flyers/asymmetric.html index 4a703fd..1f1a194 100644 --- a/templates/flyers/asymmetric.html +++ b/templates/flyers/asymmetric.html @@ -49,16 +49,36 @@ + -