Use image thumbnails
This commit is contained in:
parent
bbf1e8ce9e
commit
9ca3c60df9
9 changed files with 31 additions and 3 deletions
BIN
static/img/fotos/datentraeger_240.webp
Normal file
BIN
static/img/fotos/datentraeger_240.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 58 KiB |
BIN
static/img/fotos/datentraeger_360.webp
Normal file
BIN
static/img/fotos/datentraeger_360.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 73 KiB |
BIN
static/img/fotos/datentraeger_480.webp
Normal file
BIN
static/img/fotos/datentraeger_480.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 93 KiB |
BIN
static/img/fotos/laptop_matte_240.webp
Normal file
BIN
static/img/fotos/laptop_matte_240.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 70 KiB |
BIN
static/img/fotos/laptop_matte_360.webp
Normal file
BIN
static/img/fotos/laptop_matte_360.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 97 KiB |
BIN
static/img/fotos/laptop_matte_480.webp
Normal file
BIN
static/img/fotos/laptop_matte_480.webp
Normal file
Binary file not shown.
After Width: | Height: | Size: 130 KiB |
12
static/img/fotos/thumbnail.py
Executable file
12
static/img/fotos/thumbnail.py
Executable file
|
@ -0,0 +1,12 @@
|
|||
#!/usr/bin/python3
|
||||
import sys
|
||||
import pathlib
|
||||
import subprocess
|
||||
|
||||
SIZES = [(320, 240), (480, 360), (640, 480)]
|
||||
|
||||
image_path = pathlib.Path(sys.argv[1])
|
||||
for width, height in SIZES:
|
||||
thumb_name = image_path.with_name(f"{image_path.stem}_{height}.webp")
|
||||
print(f"Generating {width}x{height} at {thumb_name}")
|
||||
subprocess.run(["convert", str(image_path), "-resize", f"{width}x{height}", thumb_name])
|
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
|
|
@ -77,7 +77,15 @@
|
|||
</p>
|
||||
</div>
|
||||
<div class="split-section-img">
|
||||
<img width="4896" height="3672" src="static/img/fotos/laptop_matte.jpeg" alt="Laptop zur Reparatur geöffnet auf einer Arbeitsunterlage">
|
||||
<a href="static/img/fotos/laptop_matte.jpeg">
|
||||
<img
|
||||
width="320" height="240" src="static/img/fotos/laptop_matte_240.webp"
|
||||
srcset="static/img/fotos/laptop_matte_240.webp 1x,
|
||||
static/img/fotos/laptop_matte_360.webp 1.5x,
|
||||
static/img/fotos/laptop_matte_480.webp 2x"
|
||||
alt="Laptop zur Reparatur geöffnet auf einer Arbeitsunterlage"
|
||||
>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -108,7 +116,15 @@
|
|||
</p>
|
||||
</div>
|
||||
<div class="split-section-img">
|
||||
<img width="4896" height="3672" src="static/img/fotos/datentraeger.jpeg" alt="Geöffnetes Gehäuse eines SSD Datenträgers">
|
||||
<a href="static/img/fotos/datentraeger.jpeg">
|
||||
<img
|
||||
width="320" height="240" src="static/img/fotos/datentraeger_240.webp"
|
||||
srcset="static/img/fotos/datentraeger_240.webp 1x,
|
||||
static/img/fotos/datentraeger_360.webp 1.5x,
|
||||
static/img/fotos/datentraeger_480.webp 2x"
|
||||
alt="Geöffnetes Gehäuse eines SSD Datenträgers"
|
||||
>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue