Balotta/gancio-flyers
12
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

griglia 4x6

Browse source
This commit is contained in:
romo 2023-10-17 18:46:54 +02:00
parent 30f9112422
commit 59eadcb7ba
2 changed files with 68 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
static/flyers/asymmetric/style.css
View file

@ -15,8 +15,8 @@
overflow: auto; overflow: auto;
} }
.flyer { .flyer {
object-fit: cover; object-fit: cover;
max-height: 150px; max-height: 150px;
} }
@ -32,9 +32,14 @@ h1, h2, h3 {
} }
h1 { h1 {
margin: 0 0 .2em; /* margin: 0 0 .2em; */
margin: 0 0 .1em;
color: #ff6e40; color: #ff6e40;
font-size: 20mm; /* font-size: 20mm; */
font-size: 10mm;
}
.subtitle {
font-size: 14px;
} }
h3 { h3 {
@ -44,10 +49,12 @@ h3 {
} }
.intestazione { .intestazione {
padding: 1.5rem; /* padding: 1.5rem; */
padding: 0.5rem 1.5rem;
display: grid; display: grid;
grid-template-columns: auto auto auto; grid-template-columns: auto auto auto;
margin-bottom: 1.5rem; /* margin-bottom: 1.5rem; */
margin-bottom: 0.5rem;
} }
.logo, .logo,
.qrcode { .qrcode {
@ -60,7 +67,8 @@ h3 {
} }
.logo img, .logo img,
.qrcode img { .qrcode img {
width: 25%; /* width: 25%; */
width: 15%;
} }
#events { #events {
@ -78,17 +86,26 @@ h3 {
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); 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 { .event_info svg {
height: 24px; height: 24px;
width: 24px; width: 24px;
fill: white; fill: white;
margin-right: 0.2em; margin-right: 0.2em;
} }
.title {
font-size: 14px;
}
.place_name,
.flex {
font-size: 12px;
}
.title, .title,
.flex, .flex,
.location { .location {
margin: .5rem 1rem; /* margin: .5rem 1rem; */
} }
.center { .center {
display: flex; display: flex;

55
static/flyers/simple/style.css
View file

@ -3,6 +3,8 @@ body {
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"; 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; color: #c9d1d9;
background: #0d1117; background: #0d1117;
display: flex;
justify-content: space-between;
} }
h1, h2, h3 { h1, h2, h3 {
@ -10,9 +12,14 @@ h1, h2, h3 {
} }
h1 { h1 {
margin: 0 0 .2em; /* margin: 0 0 .2em; */
margin: 0 0 .1em;
color: #ff6e40; color: #ff6e40;
font-size: 20mm; /* font-size: 20mm; */
font-size: 10mm;
}
.subtitle {
font-size: 14px;
} }
h3 { h3 {
@ -22,10 +29,12 @@ h3 {
} }
.intestazione { .intestazione {
padding: 1.5rem; /* padding: 1.5rem; */
padding: 0.5rem 1.5rem;
display: grid; display: grid;
grid-template-columns: auto auto auto; grid-template-columns: auto auto auto;
margin-bottom: 1.5rem; /* margin-bottom: 1.5rem; */
margin-bottom: 0.5rem;
} }
.logo, .logo,
.qrcode { .qrcode {
@ -38,14 +47,17 @@ h3 {
} }
.logo img, .logo img,
.qrcode img { .qrcode img {
width: 25%; /* width: 25%; */
width: 15%;
} }
#events { #events {
display: grid; display: grid;
/* grid-template-columns: 33% 33% 33%; */ /* grid-template-columns: 33% 33% 33%; */
grid-template-columns: auto auto auto; grid-template-columns: auto auto auto auto;
grid-gap: 1.5em; 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-left: 24px;
padding-right: 24px; padding-right: 24px;
@ -55,16 +67,30 @@ h3 {
border-radius: 4px; 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); 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 { .event_info svg {
height: 24px; /* height: 24px;
width: 24px; width: 24px; */
height: 12px;
width: 12px;
fill: white; fill: white;
margin-right: 0.2em; margin-right: 0.2em;
} }
.title {
/* font-size: 16px; */
font-size: 14px;
}
.place_name,
.flex {
/* font-size: 14px; */
font-size: 12px;
}
.title, .title,
.flex, .flex,
.location { .location {
margin: .5rem 1rem; /* margin: .5rem 1rem; */
} }
.center { .center {
display: flex; display: flex;
@ -73,9 +99,11 @@ h3 {
} }
.flex, .flex,
.location { .location {
display: grid; /* display: grid;
grid-template-columns: auto auto; grid-template-columns: auto auto;
justify-content: start; justify-content: start; */
display: flex;
align-items: center;
} }
.place_name { .place_name {
color: #ff6e40; color: #ff6e40;
@ -87,7 +115,8 @@ h3 {
.flyer { .flyer {
width: 100%; width: 100%;
object-fit: cover; object-fit: cover;
max-height: 40mm; /* max-height: 40mm; */
max-height: 30mm;
border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
} }