init
1
.gitignore
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
/out
|
||||
50
css/a4-format-landscape.css
Normal file
|
|
@ -0,0 +1,50 @@
|
|||
* {
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
background-color: #242424;
|
||||
}
|
||||
|
||||
#page {
|
||||
zoom: 124.988%;
|
||||
width: 29.7cm;
|
||||
height: 21cm;
|
||||
margin: 1cm auto;
|
||||
background: white;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@page {
|
||||
size: A4;
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
||||
@page {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
background-color: unset;
|
||||
zoom: 100%;
|
||||
}
|
||||
|
||||
#page {
|
||||
margin: 0;
|
||||
border: initial;
|
||||
border-radius: initial;
|
||||
box-shadow: initial;
|
||||
background: initial;
|
||||
overflow-y: hidden;
|
||||
|
||||
transform-origin: center center;
|
||||
transform: scale(0.939) rotate(90deg) translate(139px, 200px);
|
||||
}
|
||||
}
|
||||
47
css/a4-format-portrait.css
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
* {
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
margin: 0;
|
||||
background-color: #242424;
|
||||
}
|
||||
|
||||
#page {
|
||||
zoom: 124.988%;
|
||||
width: 21cm;
|
||||
height: 29.7cm;
|
||||
margin: 1cm auto;
|
||||
background: white;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@page {
|
||||
size: A4;
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
||||
@page {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
background-color: unset;
|
||||
zoom: 100%;
|
||||
}
|
||||
|
||||
#page {
|
||||
margin: 0;
|
||||
border: initial;
|
||||
border-radius: initial;
|
||||
box-shadow: initial;
|
||||
background: initial;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
}
|
||||
30
generate.sh
Executable file
|
|
@ -0,0 +1,30 @@
|
|||
#!/usr/bin/bash
|
||||
set -e
|
||||
cd "$(realpath "$(dirname "$0")")"
|
||||
|
||||
|
||||
rm -fr './out'
|
||||
mkdir -p './out'
|
||||
|
||||
|
||||
(cd phoques; ls) | while read file
|
||||
do
|
||||
infos="$(echo "$file" | cut -d '.' -f 1)"
|
||||
nam="$(echo "$infos" | cut -d '_' -f 1)"
|
||||
ori="$(echo "$infos" | cut -d '_' -f 2)"
|
||||
row="$(echo "$infos" | cut -d '_' -f 3)"
|
||||
col="$(echo "$infos" | cut -d '_' -f 4)"
|
||||
msg="$(echo "$infos" | cut -d '_' -f 5)"
|
||||
|
||||
|
||||
echo "nam: '$nam', file: '$file', ori: '$ori', row: '$row', col: '$col', msg: '$msg'"
|
||||
cat src/index.html \
|
||||
| sed "s/FILE/$file/g" \
|
||||
| sed "s/NAM/$nam/g" \
|
||||
| sed "s/ORI/$ori/g" \
|
||||
| sed "s/COL/$col/g" \
|
||||
| sed "s/ROW/$row/g" \
|
||||
| sed "s/MSG/$msg/g" \
|
||||
> "out/$nam.html"
|
||||
chromium --headless --print-to-pdf="out/$nam.pdf" "out/$nam.html"
|
||||
done
|
||||
|
After Width: | Height: | Size: 345 KiB |
BIN
phoques/1304823_landscape_1_1_Épargnez-le.jpg
Normal file
|
After Width: | Height: | Size: 78 KiB |
BIN
phoques/1660899711_landscape_2_1_Votez pas pour nous.jpg
Normal file
|
After Width: | Height: | Size: 154 KiB |
|
After Width: | Height: | Size: 366 KiB |
BIN
phoques/WW1110136_landscape_1_1_Pas nous seal vous plait.jpg
Normal file
|
After Width: | Height: | Size: 244 KiB |
BIN
phoques/aerobaie_landscape_1_1_Il ne sait pas gérer un BDE →.jpg
Normal file
|
After Width: | Height: | Size: 155 KiB |
|
After Width: | Height: | Size: 98 KiB |
49
src/index.html
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Affiche épiphoque - NAM</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="../css/a4-format-ORI.css">
|
||||
<style>
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
p {
|
||||
color: white;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
filter: drop-shadow(0.2rem 0.2rem 0.5rem black);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#page {
|
||||
background-image: url("../phoques/FILE");
|
||||
background-size: cover;
|
||||
display: grid;
|
||||
grid-template-rows: auto 3rem;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="page">
|
||||
<div style='display: grid; place-items: center; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr;'>
|
||||
<div style="grid-column: COL; grid-row: ROW; margin: 2rem;">
|
||||
<h1 style="font-size: 5rem;">
|
||||
ÉPIPHOQUE
|
||||
</h1>
|
||||
<h2 style="font-size: 3rem;">
|
||||
MSG
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<p style="font-size: 1rem; margin: 1rem;">
|
||||
Communication de campagne pour le BDE Épita.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||