Merge branch 'testing-jxl'

Removed alt text for decorative image
Improved picture alt text
2022-01-01 14:08:30 +01:00 · 2022-01-01 11:03:48 +01:00 · 2022-01-01 10:59:41 +01:00 · 2022-01-01 10:12:10 +01:00
9 changed files with 17 additions and 3 deletions
--- a/src/static/css/index.css
+++ b/src/static/css/index.css
@ -7,7 +7,7 @@
 }

 .biglinks > a,
-.biglinks > img {
+.biglinks > picture {
 	max-width: calc(100% - 24px);
 }

@ -22,8 +22,13 @@
 	display: block;
 }

-.biglinks > img {
+.biglinks > picture {
+	display: inline-block;
 	height: 156px;
 	margin: 12px;
+}
+.biglinks > picture > img {
+	height: 100%;
+	width: 100%;
 	object-fit: cover;
 }
--- a/src/static/pic/pic.jxl
+++ b/src/static/pic/pic.jxl
--- a/src/static/pic/pic.webp
+++ b/src/static/pic/pic.webp
--- a/src/static/pic/pic1.webp
+++ b/src/static/pic/pic1.webp
--- a/src/static/pic/picx2.jxl
+++ b/src/static/pic/picx2.jxl
--- a/src/static/pic/picx2.webp
+++ b/src/static/pic/picx2.webp
--- a/src/static/pic/picx4.jxl
+++ b/src/static/pic/picx4.jxl
--- a/src/static/pic/picx4.webp
+++ b/src/static/pic/picx4.webp
--- a/src/views/template/index.html
+++ b/src/views/template/index.html
@ -27,7 +27,16 @@
 				<img class="svg" src="/static/picto/summit.svg" alt="" />
 				Komoot
 			</a>
-			<img src="/static/pic/pic1.webp" alt="Paysage" />
+			<picture>
+				<source type="image/jxl"
+					srcset="/static/pic/pic.jxl,
+						/static/pic/picx2.jxl 2x,
+						/static/pic/picx4.jxl 4x" />
+				<img alt=""
+				 	src="/static/pic/pic.webp"
+					srcset="/static/pic/picx2.webp 2x,
+						/static/pic/picx4.webp 4x" />
+			</picture>
 		</div>
 		<nav>
 			<a href="#">
Author	SHA1	Message	Date
Edgar P. Burkhart	d764d3373d	Merge branch 'testing-jxl'	2022-01-01 14:08:30 +01:00
Edgar P. Burkhart	2c9f6cb85f	Removed alt text for decorative image	2022-01-01 11:03:48 +01:00
Edgar P. Burkhart	5770fbe7f9	Improved picture alt text	2022-01-01 10:59:41 +01:00
Edgar P. Burkhart	108f7e2968	Added JPEG-xl support, with size alternatives for picture	2022-01-01 10:12:10 +01:00