diff --git a/README.md b/README.md index 91a6f4c..438d884 100644 --- a/README.md +++ b/README.md @@ -13,3 +13,9 @@ flask run In teoria sto coso supporta piĆ¹ template ma non ho ancora finito di sistemarlo. Se vuoi aggiungerne uno nuovo metti il template in `templates/flyers/nometemplate.html` e crea la directory `static/flyers/nometemplate` per i files css. + +# Come usare i tamplate esistenti + +Vai nel file app.py ed alla riga #13 passi, come valore di "template_name" il nome del template che vuoi utilizzare. +Ad esempio: +template_name = 'simple_white' diff --git a/static/flyers/simple/style.css b/static/flyers/simple/style.css index e8dd6af..3439423 100644 --- a/static/flyers/simple/style.css +++ b/static/flyers/simple/style.css @@ -58,7 +58,7 @@ h3 { grid-template-rows: auto auto auto auto auto; /* grid-gap: 1.5em; */ grid-gap: 0.5em; - border: 1px dotted black; + /* border: 1px dotted black; */ padding-left: 24px; padding-right: 24px; } diff --git a/static/flyers/simple_white/paper.css b/static/flyers/simple_white/paper.css new file mode 100644 index 0000000..6547679 --- /dev/null +++ b/static/flyers/simple_white/paper.css @@ -0,0 +1,50 @@ +@page { + margin: 0; +} +body { + margin: 0; + position: relative; + box-sizing: border-box; + page-break-after: always; +} + +body.A3 { + width: 297mm; + height: 420mm; +} +body.A3.landscape .sheet { + width: 420mm; + height: 297mm; +} +body.A4 .sheet { + width: 210mm; + height: 297mm; +} +body.A4.landscape .sheet { + width: 297mm; + height: 210mm; +} +body.A5 .sheet { + width: 148mm; + height: 210mm; +} +body.A5.landscape .sheet { + width: 210mm; + height: 148mm; +} +body.letter .sheet { + width: 216mm; + height: 280mm; +} +body.letter.landscape .sheet { + width: 280mm; + height: 216mm; +} +body.legal .sheet { + width: 216mm; + height: 357mm; +} +body.legal.landscape .sheet { + width: 357mm; + height: 216mm; +} diff --git a/static/flyers/simple_white/style.css b/static/flyers/simple_white/style.css new file mode 100644 index 0000000..f855a80 --- /dev/null +++ b/static/flyers/simple_white/style.css @@ -0,0 +1,121 @@ +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; +} diff --git a/templates/flyers/simple_white.html b/templates/flyers/simple_white.html new file mode 100644 index 0000000..18a6b33 --- /dev/null +++ b/templates/flyers/simple_white.html @@ -0,0 +1,64 @@ + + +
+ +