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

minor style

Browse source
This commit is contained in:
romo 2023-10-17 07:56:06 +02:00
parent f46e456b8f
commit 30f9112422
3 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -1,6 +1,6 @@
.eventcol {
display: flex;
flex-direction: column;
flex-direction: column;
gap: 3mm;
height: fit-content;
/*! max-height: 350mm; */
@ -11,7 +11,7 @@
max-height: fit-content;
min-content: 40mm;
max-content: 50mm;
border: 1px solid rgb(253, 140, 140);
/* border: 1px solid rgb(253, 140, 140); */
overflow: auto;
}
.flyer {

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

@ -43,6 +43,7 @@ h3 {
#events {
display: grid;
/* grid-template-columns: 33% 33% 33%; */
grid-template-columns: auto auto auto;
grid-gap: 1.5em;
border: 1px dotted black;

13
templates/flyers/asymmetric.html
View file

@ -2,11 +2,10 @@
<html lang="it">
<head>
<meta charset="utf-8">
<title>Balotta - sito in manutenzione</title>
<title>Balotta cartacea</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="{{ url_for('static', filename='flyers/asymmetric/style.css') }}">
<link rel="stylesheet" href="{{ url_for('static', filename='flyers/asymmetric/paper.css') }} ">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body class="A3 center">
@ -16,7 +15,7 @@
</div>
<div class="titolo center">
<h1>Balotta</h1>
<div class="subtitle">Agenda condivisa per Bolognano</div>
<div class="subtitle">Agenda condivisa per Bologna</div>
</div>
<div class="qrcode">
<img src="{{ url_for('static', filename='qr-code.png') }}" alt="">
@ -28,7 +27,7 @@
<div class="eventcol">
{% for row in (0, 1, 2, 3) %}
{% set event = events[column+(3*row)] %}
<div class="event">
<div class="center flyer-container">
<img class="flyer" src="https://balotta.org/media/thumb/{{event.media[0].url}}" style="object-position: {{ event.media[0].thumbnailPosition }}"></img>
@ -64,10 +63,10 @@
const container = document.querySelector('#events');
const content = container.querySelectorAll('.eventcol');
const containerHeight = parseInt(window.getComputedStyle(container).height);
const resizeObserver = new ResizeObserver(event => {
resizeObserver.disconnect();
event.forEach((el) => {
if(el.contentRect.height < containerHeight) {
el.target.querySelectorAll(".event > .flyer-container > .flyer").forEach((e) => {
@ -76,7 +75,7 @@
}
})
}
})
})
content.forEach(el => { requestAnimationFrame(() => resizeObserver.observe(el)) });
});