diff --git a/_mixins.pug b/_mixins.pug
index b3954201f1d77935060ae4727bbe57645834a62b..45f7d10731c775395b6d267f51574a011ce13485 100644
--- a/_mixins.pug
+++ b/_mixins.pug
@@ -6,12 +6,12 @@ mixin responsive_image(alt, thumb, fallback, urls, sizes, aspect_ratio, webp_url
if webp_urls
source(type="image/webp", sizes=sizes, srcset=webp_urls, alt=alt)
source(sizes=sizes, srcset=urls, alt=alt)
- img(src=fallback, sizes=sizes, srcset=urls, alt=alt)
+ img(src=fallback, alt=alt)
picture.load-responsive
if webp_urls
source(type="image/webp", sizes=sizes, data-srcset=webp_urls, alt=alt)
source(sizes=sizes, data-srcset=urls, alt=alt)
- img(data-src=fallback, sizes=sizes, data-srcset=urls, alt=alt)
+ img(data-src=fallback, alt=alt)
mixin theme_card(id, name)
a.card(href=`/assets/images/${id}.png`)
diff --git a/assets/js/script.js b/assets/js/script.js
index bdc8b1fba470d702f52d155f074b89f3df89d624..a23afe73784fcd4b463cea2b44b9df6737f40945 100644
--- a/assets/js/script.js
+++ b/assets/js/script.js
@@ -39,7 +39,7 @@ window.addEventListener("load", () => {
}
// Get all of the images that are marked up to lazy load
- const images = document.querySelectorAll('picture.load-responsive');
+ const images = document.querySelectorAll('.load-responsive');
const config = {
// If the image gets within 50px in the Y axis, start the download.
rootMargin: '400px 0px',
diff --git a/index.html b/index.html
index 39797e18bb2d69dfd94c0c31549a2d5eb751b0f3..c8e2565ff34bd307317cf335cac2ec1fcde28e35 100644
--- a/index.html
+++ b/index.html
@@ -4,18 +4,18 @@
</style><style>@font-face{font-family:'Lato';src:url("/assets/fonts/Lato-Regular.eot");src:url("/assets/fonts/Lato-Regular.eot?#iefix") format("embedded-opentype"),url("/assets/fonts/Lato-Regular.woff2") format("woff2"),url("/assets/fonts/Lato-Regular.woff") format("woff"),url("/assets/fonts/Lato-Regular.ttf") format("truetype");font-style:normal;font-weight:normal;font-display:fallback;text-rendering:optimizeLegibility}@font-face{font-family:'Lato';src:url("/assets/fonts/Lato-Bold.eot");src:url("/assets/fonts/Lato-Bold.eot?#iefix") format("embedded-opentype"),url("/assets/fonts/Lato-Bold.woff2") format("woff2"),url("/assets/fonts/Lato-Bold.woff") format("woff"),url("/assets/fonts/Lato-Bold.ttf") format("truetype");font-style:normal;font-weight:bold;font-display:fallback;text-rendering:optimizeLegibility}@font-face{font-family:'Lato';src:url("/assets/fonts/Lato-BoldItalic.eot");src:url("/assets/fonts/Lato-BoldItalic.eot?#iefix") format("embedded-opentype"),url("/assets/fonts/Lato-BoldItalic.woff2") format("woff2"),url("/assets/fonts/Lato-BoldItalic.woff") format("woff"),url("/assets/fonts/Lato-BoldItalic.ttf") format("truetype");font-style:italic;font-weight:bold;font-display:fallback;text-rendering:optimizeLegibility}@font-face{font-family:'Lato';src:url("/assets/fonts/Lato-Italic.eot");src:url("/assets/fonts/Lato-Italic.eot?#iefix") format("embedded-opentype"),url("/assets/fonts/Lato-Italic.woff2") format("woff2"),url("/assets/fonts/Lato-Italic.woff") format("woff"),url("/assets/fonts/Lato-Italic.ttf") format("truetype");font-style:italic;font-weight:normal;font-display:fallback;text-rendering:optimizeLegibility}@font-face{font-family:'IconFont';src:url("/assets/fonts/icons.eot");src:url("/assets/fonts/icons.eot?#iefix") format("embedded-opentype"),url("/assets/fonts/icons.woff2") format("woff2"),url("/assets/fonts/icons.woff") format("woff"),url("/assets/fonts/icons.ttf") format("truetype"),url("/assets/fonts/icons.svg#icons") format("svg");font-style:normal;font-weight:normal;font-variant:normal;font-display:block}
</style></head><body class="noscript index" id="page-index"><noscript><style>img[data-src] {
display: none !important;
-}</style></noscript><script>document.body.classList.remove("noscript");</script><div class="pusher"><div class="full height"><div class="following bar"><div class="ui container"><div class="ui large secondary menu inverted"><a class="view-ui item active" href="/"><img class="ui logo left" src="/assets/images/icon.svg" aria-hidden="true" role="img">Quasseldroid</a><a class="view-ui item" href="/docs/">Docs</a><div class="right menu"><a class="view-ui item" aria-label="Source" href="https://git.kuschku.de/justjanne/quasseldroid-ng/"><i class="icon github left" aria-hidden="true" role="img"></i><span class="text">Source</span></a><a class="view-ui item" aria-label="Download" href="/releases/"><i class="icon download left" aria-hidden="true" role="img"></i><span class="text">Download</span></a></div></div></div></div><div class="masthead segment"><div class="ui container"><div class="introduction"><h1 class="ui inverted header">Quasseldroid</h1><h2 class="ui inverted">Chat comfortably, everywhere.</h2><div class="ui hidden divider"></div><a class="ui huge inverted download button" aria-label="Download" href="/releases/"><i class="icon download left" aria-hidden="true" role="img"></i><span class="text">Download</span></a><a class="ui huge inverted basic button" aria-label="Source" href="https://git.kuschku.de/justjanne/quasseldroid-ng/"><i class="icon github left" aria-hidden="true" role="img"></i><span class="text">Source</span></a></div><div class="row"><div class="wide column"><div id="image_container" aria-hidden="true"><noscript><picture class="phone"><source sizes="(max-height: 800px) calc(50vw + 101px), (max-width: 800px) calc(50vw + 101px), calc(33vw + 1px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w"><img alt="Screenshot of Quasseldroid on a phone" src="/assets/images/phone@400.png" sizes="(max-height: 800px) calc(50vw + 101px), (max-width: 800px) calc(50vw + 101px), calc(33vw + 1px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w"></picture></noscript><picture class="phone"><source sizes="(max-height: 800px) calc(50vw + 101px), (max-width: 800px) calc(50vw + 101px), calc(33vw + 1px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w"><img alt="Screenshot of Quasseldroid on a phone" src="/assets/images/phone@400.png" sizes="(max-height: 800px) calc(50vw + 101px), (max-width: 800px) calc(50vw + 101px), calc(33vw + 1px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w"></picture><noscript><picture class="tablet"><source sizes="calc(33vw + 1px)" srcset="/assets/images/tablet@545.webp 545w, /assets/images/tablet@640.webp 640w, /assets/images/tablet@720.webp 720w, /assets/images/tablet@800.webp 800w, /assets/images/tablet@880.webp 880w, /assets/images/tablet@960.webp 960w, /assets/images/tablet@1090.webp 1090w, /assets/images/tablet@1635.webp 1635w, /assets/images/tablet@2180.webp 2180w"><img alt="Screenshot of Quasseldroid on a tablet" src="/assets/images/tablet@1090.png" sizes="calc(33vw + 1px)" srcset="/assets/images/tablet@545.png 545w, /assets/images/tablet@640.png 640w, /assets/images/tablet@720.png 720w, /assets/images/tablet@800.png 800w, /assets/images/tablet@880.png 880w, /assets/images/tablet@960.png 960w, /assets/images/tablet@1090.png 1090w, /assets/images/tablet@1635.png 1635w, /assets/images/tablet@2180.png 2180w"></picture></noscript><picture class="tablet"><source sizes="calc(33vw + 1px)" srcset="/assets/images/tablet@545.webp 545w, /assets/images/tablet@640.webp 640w, /assets/images/tablet@720.webp 720w, /assets/images/tablet@800.webp 800w, /assets/images/tablet@880.webp 880w, /assets/images/tablet@960.webp 960w, /assets/images/tablet@1090.webp 1090w, /assets/images/tablet@1635.webp 1635w, /assets/images/tablet@2180.webp 2180w"><img alt="Screenshot of Quasseldroid on a tablet" src="/assets/images/tablet@1090.png" sizes="calc(33vw + 1px)" srcset="/assets/images/tablet@545.png 545w, /assets/images/tablet@640.png 640w, /assets/images/tablet@720.png 720w, /assets/images/tablet@800.png 800w, /assets/images/tablet@880.png 880w, /assets/images/tablet@960.png 960w, /assets/images/tablet@1090.png 1090w, /assets/images/tablet@1635.png 1635w, /assets/images/tablet@2180.png 2180w"></picture></div></div></div></div></div><div class="ui vertical stripe intro segment"><div class="ui stackable very relaxed center aligned grid container"><div class="row" id="built_on_quassel"><div class="seven wide column left aligned"><h2 class="ui header">Built on Quassel</h2><p>Quassel makes IRC fun again – open a client anywhere, connect
+}</style></noscript><script>document.body.classList.remove("noscript");</script><div class="pusher"><div class="full height"><div class="following bar"><div class="ui container"><div class="ui large secondary menu inverted"><a class="view-ui item active" href="/"><img class="ui logo left" src="/assets/images/icon.svg" aria-hidden="true" role="img">Quasseldroid</a><a class="view-ui item" href="/docs/">Docs</a><div class="right menu"><a class="view-ui item" aria-label="Source" href="https://git.kuschku.de/justjanne/quasseldroid-ng/"><i class="icon github left" aria-hidden="true" role="img"></i><span class="text">Source</span></a><a class="view-ui item" aria-label="Download" href="/releases/"><i class="icon download left" aria-hidden="true" role="img"></i><span class="text">Download</span></a></div></div></div></div><div class="masthead segment"><div class="ui container"><div class="introduction"><h1 class="ui inverted header">Quasseldroid</h1><h2 class="ui inverted">Chat comfortably, everywhere.</h2><div class="ui hidden divider"></div><a class="ui huge inverted download button" aria-label="Download" href="/releases/"><i class="icon download left" aria-hidden="true" role="img"></i><span class="text">Download</span></a><a class="ui huge inverted basic button" aria-label="Source" href="https://git.kuschku.de/justjanne/quasseldroid-ng/"><i class="icon github left" aria-hidden="true" role="img"></i><span class="text">Source</span></a></div><div class="row"><div class="wide column"><div id="image_container" aria-hidden="true"><noscript><picture class="phone"><source type="image/webp" media="(max-width: 800px) or (max-height: 800px)" sizes="calc(50vw + 101px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w"><source type="image/webp" sizes="calc(33vw + 1px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w"><source media="(max-width: 800px) or (max-width: 800px)" sizes="calc(50vw + 101px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w"><source sizes="calc(33vw + 1px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w"><img alt="Screenshot of Quasseldroid on a phone" src="/assets/images/phone@400.png"></picture></noscript><picture class="phone"><source type="image/webp" media="(max-width: 800px) or (max-height: 800px)" sizes="calc(50vw + 101px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w"><source type="image/webp" sizes="calc(33vw + 1px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w"><source media="(max-width: 800px) or (max-height: 800px)" sizes="calc(50vw + 101px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w"><source sizes="calc(33vw + 1px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w"><img alt="Screenshot of Quasseldroid on a phone" src="/assets/images/phone@400.png"></picture><noscript><picture class="tablet"><source sizes="calc(33vw + 1px)" srcset="/assets/images/tablet@545.webp 545w, /assets/images/tablet@640.webp 640w, /assets/images/tablet@720.webp 720w, /assets/images/tablet@800.webp 800w, /assets/images/tablet@880.webp 880w, /assets/images/tablet@960.webp 960w, /assets/images/tablet@1090.webp 1090w, /assets/images/tablet@1635.webp 1635w, /assets/images/tablet@2180.webp 2180w"><img alt="Screenshot of Quasseldroid on a tablet" src="/assets/images/tablet@1090.png" sizes="calc(33vw + 1px)" srcset="/assets/images/tablet@545.png 545w, /assets/images/tablet@640.png 640w, /assets/images/tablet@720.png 720w, /assets/images/tablet@800.png 800w, /assets/images/tablet@880.png 880w, /assets/images/tablet@960.png 960w, /assets/images/tablet@1090.png 1090w, /assets/images/tablet@1635.png 1635w, /assets/images/tablet@2180.png 2180w"></picture></noscript><picture class="tablet"><source sizes="calc(33vw + 1px)" srcset="/assets/images/tablet@545.webp 545w, /assets/images/tablet@640.webp 640w, /assets/images/tablet@720.webp 720w, /assets/images/tablet@800.webp 800w, /assets/images/tablet@880.webp 880w, /assets/images/tablet@960.webp 960w, /assets/images/tablet@1090.webp 1090w, /assets/images/tablet@1635.webp 1635w, /assets/images/tablet@2180.webp 2180w"><img alt="Screenshot of Quasseldroid on a tablet" src="/assets/images/tablet@1090.png" sizes="calc(33vw + 1px)" srcset="/assets/images/tablet@545.png 545w, /assets/images/tablet@640.png 640w, /assets/images/tablet@720.png 720w, /assets/images/tablet@800.png 800w, /assets/images/tablet@880.png 880w, /assets/images/tablet@960.png 960w, /assets/images/tablet@1090.png 1090w, /assets/images/tablet@1635.png 1635w, /assets/images/tablet@2180.png 2180w"></picture></div></div></div></div></div><div class="ui vertical stripe intro segment"><div class="ui stackable very relaxed center aligned grid container"><div class="row" id="built_on_quassel"><div class="seven wide column left aligned"><h2 class="ui header">Built on Quassel</h2><p>Quassel makes IRC fun again – open a client anywhere, connect
to your core, and have all your favourite channels and
networks right there.</p><p>Be it at home with Windows, macOS, Linux, on the go with
Android or iOS, or via the web. Everything is exactly the way
-you left it.</p><a href="https://quassel-irc.org/">Learn more about Quassel</a></div><div class="nine wide column"><div class="ui one doubling cards"><div class="card"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 75.5932203389830%;background-image: url(/assets/images/desktop@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" srcset="/assets/images/desktop@363.webp 363w, /assets/images/desktop@474.webp 474w, /assets/images/desktop@590.webp 590w, /assets/images/desktop@726.webp 726w, /assets/images/desktop@948.webp 948w, /assets/images/desktop@1180.webp 1180w" alt="Screenshot of Quassel on desktop"/><source sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" srcset="/assets/images/desktop@363.png 363w, /assets/images/desktop@474.png 474w, /assets/images/desktop@590.png 590w, /assets/images/desktop@726.png 726w, /assets/images/desktop@948.png 948w, /assets/images/desktop@1180.png 1180w" alt="Screenshot of Quassel on desktop"/><img src="/assets/images/desktop@590.png" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" srcset="/assets/images/desktop@363.png 363w, /assets/images/desktop@474.png 474w, /assets/images/desktop@590.png 590w, /assets/images/desktop@726.png 726w, /assets/images/desktop@948.png 948w, /assets/images/desktop@1180.png 1180w" alt="Screenshot of Quassel on desktop"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" data-srcset="/assets/images/desktop@363.webp 363w, /assets/images/desktop@474.webp 474w, /assets/images/desktop@590.webp 590w, /assets/images/desktop@726.webp 726w, /assets/images/desktop@948.webp 948w, /assets/images/desktop@1180.webp 1180w" alt="Screenshot of Quassel on desktop"/><source sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" data-srcset="/assets/images/desktop@363.png 363w, /assets/images/desktop@474.png 474w, /assets/images/desktop@590.png 590w, /assets/images/desktop@726.png 726w, /assets/images/desktop@948.png 948w, /assets/images/desktop@1180.png 1180w" alt="Screenshot of Quassel on desktop"/><img data-src="/assets/images/desktop@590.png" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" data-srcset="/assets/images/desktop@363.png 363w, /assets/images/desktop@474.png 474w, /assets/images/desktop@590.png 590w, /assets/images/desktop@726.png 726w, /assets/images/desktop@948.png 948w, /assets/images/desktop@1180.png 1180w" alt="Screenshot of Quassel on desktop"/></picture></div></div></div></div></div></div></div><div class="ui divider"></div><div class="computer reversed row" id="never_miss_a_thing"><div class="seven wide column left aligned"><h2 class="ui header">Never miss a thing</h2><p>Always be up to date with push notifications in Quasseldroid.
+you left it.</p><a href="https://quassel-irc.org/">Learn more about Quassel</a></div><div class="nine wide column"><div class="ui one doubling cards"><div class="card"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 75.5932203389830%;background-image: url(/assets/images/desktop@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" srcset="/assets/images/desktop@363.webp 363w, /assets/images/desktop@474.webp 474w, /assets/images/desktop@590.webp 590w, /assets/images/desktop@726.webp 726w, /assets/images/desktop@948.webp 948w, /assets/images/desktop@1180.webp 1180w" alt="Screenshot of Quassel on desktop"/><source sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" srcset="/assets/images/desktop@363.png 363w, /assets/images/desktop@474.png 474w, /assets/images/desktop@590.png 590w, /assets/images/desktop@726.png 726w, /assets/images/desktop@948.png 948w, /assets/images/desktop@1180.png 1180w" alt="Screenshot of Quassel on desktop"/><img src="/assets/images/desktop@590.png" alt="Screenshot of Quassel on desktop"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" data-srcset="/assets/images/desktop@363.webp 363w, /assets/images/desktop@474.webp 474w, /assets/images/desktop@590.webp 590w, /assets/images/desktop@726.webp 726w, /assets/images/desktop@948.webp 948w, /assets/images/desktop@1180.webp 1180w" alt="Screenshot of Quassel on desktop"/><source sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" data-srcset="/assets/images/desktop@363.png 363w, /assets/images/desktop@474.png 474w, /assets/images/desktop@590.png 590w, /assets/images/desktop@726.png 726w, /assets/images/desktop@948.png 948w, /assets/images/desktop@1180.png 1180w" alt="Screenshot of Quassel on desktop"/><img data-src="/assets/images/desktop@590.png" alt="Screenshot of Quassel on desktop"/></picture></div></div></div></div></div></div></div><div class="ui divider"></div><div class="computer reversed row" id="never_miss_a_thing"><div class="seven wide column left aligned"><h2 class="ui header">Never miss a thing</h2><p>Always be up to date with push notifications in Quasseldroid.
Once you’ve set up the app, it automatically ensures you
always get notifications – without affecting your battery
-runtime.</p></div><div class="nine wide column"><div class="ui one doubling cards"><div class="card"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 51.57407407407407%;background-image: url(/assets/images/notifications@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" srcset="/assets/images/notifications@590.webp" alt="Screenshot of Quasseldroid notifications"/><source sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" srcset="/assets/images/notifications@363.png 363w, /assets/images/notifications@474.png 474w, /assets/images/notifications@590.png 590w" alt="Screenshot of Quasseldroid notifications"/><img src="/assets/images/notifications@590.png" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" srcset="/assets/images/notifications@363.png 363w, /assets/images/notifications@474.png 474w, /assets/images/notifications@590.png 590w" alt="Screenshot of Quasseldroid notifications"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" data-srcset="/assets/images/notifications@590.webp" alt="Screenshot of Quasseldroid notifications"/><source sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" data-srcset="/assets/images/notifications@363.png 363w, /assets/images/notifications@474.png 474w, /assets/images/notifications@590.png 590w" alt="Screenshot of Quasseldroid notifications"/><img data-src="/assets/images/notifications@590.png" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" data-srcset="/assets/images/notifications@363.png 363w, /assets/images/notifications@474.png 474w, /assets/images/notifications@590.png 590w" alt="Screenshot of Quasseldroid notifications"/></picture></div></div></div></div></div></div></div><div class="ui divider"></div><div class="row" id="make_it_yours"><div class="seven wide column left aligned"><h2 class="ui header">Make it yours</h2><p>With many available themes, and the ability to change every
+runtime.</p></div><div class="nine wide column"><div class="ui one doubling cards"><div class="card"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 51.57407407407407%;background-image: url(/assets/images/notifications@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" srcset="/assets/images/notifications@590.png" alt="Screenshot of Quasseldroid notifications"/><source sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" srcset="/assets/images/notifications@363.png 363w, /assets/images/notifications@474.png 474w, /assets/images/notifications@590.png 590w" alt="Screenshot of Quasseldroid notifications"/><img src="/assets/images/notifications@590.png" alt="Screenshot of Quasseldroid notifications"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" data-srcset="/assets/images/notifications@590.png" alt="Screenshot of Quasseldroid notifications"/><source sizes="(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px" data-srcset="/assets/images/notifications@363.png 363w, /assets/images/notifications@474.png 474w, /assets/images/notifications@590.png 590w" alt="Screenshot of Quasseldroid notifications"/><img data-src="/assets/images/notifications@590.png" alt="Screenshot of Quasseldroid notifications"/></picture></div></div></div></div></div></div></div><div class="ui divider"></div><div class="row" id="make_it_yours"><div class="seven wide column left aligned"><h2 class="ui header">Make it yours</h2><p>With many available themes, and the ability to change every
little bit of the UI to your liking, you can truly
customize Quasseldroid however you’d like.</p><p>Special themes for every situation – be it AMOLED displays
or holidays – are available, and improve your battery life
-or just look fancy.</p></div><div class="nine wide column"></div></div><div class="ui divider"></div><div class="row centered"><div class="wide column"><div class="ui four doubling cards"><a class="card" href="/assets/images/material_light.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/material_light@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/material_light@220.webp 220w, /assets/images/material_light@266.webp 266w, /assets/images/material_light@335.webp 335w, /assets/images/material_light@352.webp 352w, /assets/images/material_light@532.webp 532w" alt="Material Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/material_light@220.png 220w, /assets/images/material_light@266.png 266w, /assets/images/material_light@335.png 335w, /assets/images/material_light@352.png 352w, /assets/images/material_light@532.png 532w" alt="Material Light"/><img src="/assets/images/material_light@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/material_light@220.png 220w, /assets/images/material_light@266.png 266w, /assets/images/material_light@335.png 335w, /assets/images/material_light@352.png 352w, /assets/images/material_light@532.png 532w" alt="Material Light"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/material_light@220.webp 220w, /assets/images/material_light@266.webp 266w, /assets/images/material_light@335.webp 335w, /assets/images/material_light@352.webp 352w, /assets/images/material_light@532.webp 532w" alt="Material Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/material_light@220.png 220w, /assets/images/material_light@266.png 266w, /assets/images/material_light@335.png 335w, /assets/images/material_light@352.png 352w, /assets/images/material_light@532.png 532w" alt="Material Light"/><img data-src="/assets/images/material_light@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/material_light@220.png 220w, /assets/images/material_light@266.png 266w, /assets/images/material_light@335.png 335w, /assets/images/material_light@352.png 352w, /assets/images/material_light@532.png 532w" alt="Material Light"/></picture></div></div></div><div class="content"><div class="extra">Material Light</div></div></a><a class="card" href="/assets/images/material_dark.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/material_dark@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/material_dark@220.webp 220w, /assets/images/material_dark@266.webp 266w, /assets/images/material_dark@335.webp 335w, /assets/images/material_dark@352.webp 352w, /assets/images/material_dark@532.webp 532w" alt="Material Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/material_dark@220.png 220w, /assets/images/material_dark@266.png 266w, /assets/images/material_dark@335.png 335w, /assets/images/material_dark@352.png 352w, /assets/images/material_dark@532.png 532w" alt="Material Dark"/><img src="/assets/images/material_dark@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/material_dark@220.png 220w, /assets/images/material_dark@266.png 266w, /assets/images/material_dark@335.png 335w, /assets/images/material_dark@352.png 352w, /assets/images/material_dark@532.png 532w" alt="Material Dark"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/material_dark@220.webp 220w, /assets/images/material_dark@266.webp 266w, /assets/images/material_dark@335.webp 335w, /assets/images/material_dark@352.webp 352w, /assets/images/material_dark@532.webp 532w" alt="Material Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/material_dark@220.png 220w, /assets/images/material_dark@266.png 266w, /assets/images/material_dark@335.png 335w, /assets/images/material_dark@352.png 352w, /assets/images/material_dark@532.png 532w" alt="Material Dark"/><img data-src="/assets/images/material_dark@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/material_dark@220.png 220w, /assets/images/material_dark@266.png 266w, /assets/images/material_dark@335.png 335w, /assets/images/material_dark@352.png 352w, /assets/images/material_dark@532.png 532w" alt="Material Dark"/></picture></div></div></div><div class="content"><div class="extra">Material Dark</div></div></a><a class="card" href="/assets/images/solarized_light.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/solarized_light@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/solarized_light@220.webp 220w, /assets/images/solarized_light@266.webp 266w, /assets/images/solarized_light@335.webp 335w, /assets/images/solarized_light@352.webp 352w, /assets/images/solarized_light@532.webp 532w" alt="Solarized Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/solarized_light@220.png 220w, /assets/images/solarized_light@266.png 266w, /assets/images/solarized_light@335.png 335w, /assets/images/solarized_light@352.png 352w, /assets/images/solarized_light@532.png 532w" alt="Solarized Light"/><img src="/assets/images/solarized_light@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/solarized_light@220.png 220w, /assets/images/solarized_light@266.png 266w, /assets/images/solarized_light@335.png 335w, /assets/images/solarized_light@352.png 352w, /assets/images/solarized_light@532.png 532w" alt="Solarized Light"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/solarized_light@220.webp 220w, /assets/images/solarized_light@266.webp 266w, /assets/images/solarized_light@335.webp 335w, /assets/images/solarized_light@352.webp 352w, /assets/images/solarized_light@532.webp 532w" alt="Solarized Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/solarized_light@220.png 220w, /assets/images/solarized_light@266.png 266w, /assets/images/solarized_light@335.png 335w, /assets/images/solarized_light@352.png 352w, /assets/images/solarized_light@532.png 532w" alt="Solarized Light"/><img data-src="/assets/images/solarized_light@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/solarized_light@220.png 220w, /assets/images/solarized_light@266.png 266w, /assets/images/solarized_light@335.png 335w, /assets/images/solarized_light@352.png 352w, /assets/images/solarized_light@532.png 532w" alt="Solarized Light"/></picture></div></div></div><div class="content"><div class="extra">Solarized Light</div></div></a><a class="card" href="/assets/images/solarized_dark.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/solarized_dark@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/solarized_dark@220.webp 220w, /assets/images/solarized_dark@266.webp 266w, /assets/images/solarized_dark@335.webp 335w, /assets/images/solarized_dark@352.webp 352w, /assets/images/solarized_dark@532.webp 532w" alt="Solarized Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/solarized_dark@220.png 220w, /assets/images/solarized_dark@266.png 266w, /assets/images/solarized_dark@335.png 335w, /assets/images/solarized_dark@352.png 352w, /assets/images/solarized_dark@532.png 532w" alt="Solarized Dark"/><img src="/assets/images/solarized_dark@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/solarized_dark@220.png 220w, /assets/images/solarized_dark@266.png 266w, /assets/images/solarized_dark@335.png 335w, /assets/images/solarized_dark@352.png 352w, /assets/images/solarized_dark@532.png 532w" alt="Solarized Dark"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/solarized_dark@220.webp 220w, /assets/images/solarized_dark@266.webp 266w, /assets/images/solarized_dark@335.webp 335w, /assets/images/solarized_dark@352.webp 352w, /assets/images/solarized_dark@532.webp 532w" alt="Solarized Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/solarized_dark@220.png 220w, /assets/images/solarized_dark@266.png 266w, /assets/images/solarized_dark@335.png 335w, /assets/images/solarized_dark@352.png 352w, /assets/images/solarized_dark@532.png 532w" alt="Solarized Dark"/><img data-src="/assets/images/solarized_dark@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/solarized_dark@220.png 220w, /assets/images/solarized_dark@266.png 266w, /assets/images/solarized_dark@335.png 335w, /assets/images/solarized_dark@352.png 352w, /assets/images/solarized_dark@532.png 532w" alt="Solarized Dark"/></picture></div></div></div><div class="content"><div class="extra">Solarized Dark</div></div></a><a class="card" href="/assets/images/gruvbox_light.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/gruvbox_light@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/gruvbox_light@220.webp 220w, /assets/images/gruvbox_light@266.webp 266w, /assets/images/gruvbox_light@335.webp 335w, /assets/images/gruvbox_light@352.webp 352w, /assets/images/gruvbox_light@532.webp 532w" alt="Gruvbox Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/gruvbox_light@220.png 220w, /assets/images/gruvbox_light@266.png 266w, /assets/images/gruvbox_light@335.png 335w, /assets/images/gruvbox_light@352.png 352w, /assets/images/gruvbox_light@532.png 532w" alt="Gruvbox Light"/><img src="/assets/images/gruvbox_light@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/gruvbox_light@220.png 220w, /assets/images/gruvbox_light@266.png 266w, /assets/images/gruvbox_light@335.png 335w, /assets/images/gruvbox_light@352.png 352w, /assets/images/gruvbox_light@532.png 532w" alt="Gruvbox Light"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/gruvbox_light@220.webp 220w, /assets/images/gruvbox_light@266.webp 266w, /assets/images/gruvbox_light@335.webp 335w, /assets/images/gruvbox_light@352.webp 352w, /assets/images/gruvbox_light@532.webp 532w" alt="Gruvbox Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/gruvbox_light@220.png 220w, /assets/images/gruvbox_light@266.png 266w, /assets/images/gruvbox_light@335.png 335w, /assets/images/gruvbox_light@352.png 352w, /assets/images/gruvbox_light@532.png 532w" alt="Gruvbox Light"/><img data-src="/assets/images/gruvbox_light@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/gruvbox_light@220.png 220w, /assets/images/gruvbox_light@266.png 266w, /assets/images/gruvbox_light@335.png 335w, /assets/images/gruvbox_light@352.png 352w, /assets/images/gruvbox_light@532.png 532w" alt="Gruvbox Light"/></picture></div></div></div><div class="content"><div class="extra">Gruvbox Light</div></div></a><a class="card" href="/assets/images/gruvbox_dark.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/gruvbox_dark@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/gruvbox_dark@220.webp 220w, /assets/images/gruvbox_dark@266.webp 266w, /assets/images/gruvbox_dark@335.webp 335w, /assets/images/gruvbox_dark@352.webp 352w, /assets/images/gruvbox_dark@532.webp 532w" alt="Gruvbox Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/gruvbox_dark@220.png 220w, /assets/images/gruvbox_dark@266.png 266w, /assets/images/gruvbox_dark@335.png 335w, /assets/images/gruvbox_dark@352.png 352w, /assets/images/gruvbox_dark@532.png 532w" alt="Gruvbox Dark"/><img src="/assets/images/gruvbox_dark@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/gruvbox_dark@220.png 220w, /assets/images/gruvbox_dark@266.png 266w, /assets/images/gruvbox_dark@335.png 335w, /assets/images/gruvbox_dark@352.png 352w, /assets/images/gruvbox_dark@532.png 532w" alt="Gruvbox Dark"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/gruvbox_dark@220.webp 220w, /assets/images/gruvbox_dark@266.webp 266w, /assets/images/gruvbox_dark@335.webp 335w, /assets/images/gruvbox_dark@352.webp 352w, /assets/images/gruvbox_dark@532.webp 532w" alt="Gruvbox Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/gruvbox_dark@220.png 220w, /assets/images/gruvbox_dark@266.png 266w, /assets/images/gruvbox_dark@335.png 335w, /assets/images/gruvbox_dark@352.png 352w, /assets/images/gruvbox_dark@532.png 532w" alt="Gruvbox Dark"/><img data-src="/assets/images/gruvbox_dark@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/gruvbox_dark@220.png 220w, /assets/images/gruvbox_dark@266.png 266w, /assets/images/gruvbox_dark@335.png 335w, /assets/images/gruvbox_dark@352.png 352w, /assets/images/gruvbox_dark@532.png 532w" alt="Gruvbox Dark"/></picture></div></div></div><div class="content"><div class="extra">Gruvbox Dark</div></div></a><a class="card" href="/assets/images/amoled.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/amoled@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/amoled@220.webp 220w, /assets/images/amoled@266.webp 266w, /assets/images/amoled@335.webp 335w, /assets/images/amoled@352.webp 352w, /assets/images/amoled@532.webp 532w" alt="AMOLED"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/amoled@220.png 220w, /assets/images/amoled@266.png 266w, /assets/images/amoled@335.png 335w, /assets/images/amoled@352.png 352w, /assets/images/amoled@532.png 532w" alt="AMOLED"/><img src="/assets/images/amoled@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/amoled@220.png 220w, /assets/images/amoled@266.png 266w, /assets/images/amoled@335.png 335w, /assets/images/amoled@352.png 352w, /assets/images/amoled@532.png 532w" alt="AMOLED"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/amoled@220.webp 220w, /assets/images/amoled@266.webp 266w, /assets/images/amoled@335.webp 335w, /assets/images/amoled@352.webp 352w, /assets/images/amoled@532.webp 532w" alt="AMOLED"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/amoled@220.png 220w, /assets/images/amoled@266.png 266w, /assets/images/amoled@335.png 335w, /assets/images/amoled@352.png 352w, /assets/images/amoled@532.png 532w" alt="AMOLED"/><img data-src="/assets/images/amoled@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/amoled@220.png 220w, /assets/images/amoled@266.png 266w, /assets/images/amoled@335.png 335w, /assets/images/amoled@352.png 352w, /assets/images/amoled@532.png 532w" alt="AMOLED"/></picture></div></div></div><div class="content"><div class="extra">AMOLED</div></div></a><a class="card" href="/assets/images/dracula.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/dracula@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/dracula@220.webp 220w, /assets/images/dracula@266.webp 266w, /assets/images/dracula@335.webp 335w, /assets/images/dracula@352.webp 352w, /assets/images/dracula@532.webp 532w" alt="Dracula"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/dracula@220.png 220w, /assets/images/dracula@266.png 266w, /assets/images/dracula@335.png 335w, /assets/images/dracula@352.png 352w, /assets/images/dracula@532.png 532w" alt="Dracula"/><img src="/assets/images/dracula@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/dracula@220.png 220w, /assets/images/dracula@266.png 266w, /assets/images/dracula@335.png 335w, /assets/images/dracula@352.png 352w, /assets/images/dracula@532.png 532w" alt="Dracula"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/dracula@220.webp 220w, /assets/images/dracula@266.webp 266w, /assets/images/dracula@335.webp 335w, /assets/images/dracula@352.webp 352w, /assets/images/dracula@532.webp 532w" alt="Dracula"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/dracula@220.png 220w, /assets/images/dracula@266.png 266w, /assets/images/dracula@335.png 335w, /assets/images/dracula@352.png 352w, /assets/images/dracula@532.png 532w" alt="Dracula"/><img data-src="/assets/images/dracula@266.png" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/dracula@220.png 220w, /assets/images/dracula@266.png 266w, /assets/images/dracula@335.png 335w, /assets/images/dracula@352.png 352w, /assets/images/dracula@532.png 532w" alt="Dracula"/></picture></div></div></div><div class="content"><div class="extra">Dracula</div></div></a></div></div></div></div></div></div><div class="ui black inverted vertical footer segment"><div class="ui center aligned container"><div class="ui stackable inverted grid"><div class="three wide column"><h4 class="ui inverted header">Community</h4><div class="ui inverted link list"><a class="item" href="https://www.transifex.com/quasseldroid-1/quasseldroid-1/">Help Translate</a><a class="item" href="https://lithium.kuschku.de/quasseldroid-theme-editor/">Create a Theme</a><a class="item" href="https://git.kuschku.de/justjanne/quasseldroid-ng/issues/">Submit an Issue</a><a class="item" href="ircs://chat.freenode.org/#quasseldroid">Join our Chat</a><a class="item" href="/docs/">Documentation</a></div></div><div class="three wide column"><h4 class="ui inverted header">Discover More</h4><div class="ui inverted link list"><a class="item" href="https://quassel-irc.org/">Quassel</a><a class="item" href="https://github.com/magne4000/quassel-webserver/">quassel-webserver</a><a class="item" href="https://github.com/phhusson/quassel-irssi">quassel-irssi</a><a class="item" href="https://woboq.com/iquassel.html">iQuassel</a><a class="item" href="http://github.com/justjanne/quassel-rest-search">Quassel-Rest-Search</a></div></div></div><div class="ui inverted section divider"></div><img class="ui centered mini image" src="/assets/images/icon.svg" aria-hidden="true" role="img"><div class="ui inverted small link list"><a class="item" href="https://git.kuschku.de/justjanne/quasseldroid-ng/">Free & Open Source</a><p class="item"><a class="ui item" href="/privacy-policy/">Privacy Policy</a> · <a class="ui item" href="https://kuschku.de/imprint/">Imprint</a></p><p class="item renewable"><img src="/assets/images/sprout.svg" aria-hidden="true" role="img"><span>This website is hosted with 100% renewable energy.</span></p></div></div></div></div><script src="/assets/js/intersectionobserver.min.js"></script><script>document.addEventListener("DOMContentLoaded", () => {
+or just look fancy.</p></div><div class="nine wide column"></div></div><div class="ui divider"></div><div class="row centered"><div class="wide column"><div class="ui four doubling cards"><a class="card" href="/assets/images/material_light.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/material_light@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/material_light@220.webp 220w, /assets/images/material_light@266.webp 266w, /assets/images/material_light@335.webp 335w, /assets/images/material_light@352.webp 352w, /assets/images/material_light@532.webp 532w" alt="Material Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/material_light@220.png 220w, /assets/images/material_light@266.png 266w, /assets/images/material_light@335.png 335w, /assets/images/material_light@352.png 352w, /assets/images/material_light@532.png 532w" alt="Material Light"/><img src="/assets/images/material_light@266.png" alt="Material Light"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/material_light@220.webp 220w, /assets/images/material_light@266.webp 266w, /assets/images/material_light@335.webp 335w, /assets/images/material_light@352.webp 352w, /assets/images/material_light@532.webp 532w" alt="Material Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/material_light@220.png 220w, /assets/images/material_light@266.png 266w, /assets/images/material_light@335.png 335w, /assets/images/material_light@352.png 352w, /assets/images/material_light@532.png 532w" alt="Material Light"/><img data-src="/assets/images/material_light@266.png" alt="Material Light"/></picture></div></div></div><div class="content"><div class="extra">Material Light</div></div></a><a class="card" href="/assets/images/material_dark.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/material_dark@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/material_dark@220.webp 220w, /assets/images/material_dark@266.webp 266w, /assets/images/material_dark@335.webp 335w, /assets/images/material_dark@352.webp 352w, /assets/images/material_dark@532.webp 532w" alt="Material Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/material_dark@220.png 220w, /assets/images/material_dark@266.png 266w, /assets/images/material_dark@335.png 335w, /assets/images/material_dark@352.png 352w, /assets/images/material_dark@532.png 532w" alt="Material Dark"/><img src="/assets/images/material_dark@266.png" alt="Material Dark"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/material_dark@220.webp 220w, /assets/images/material_dark@266.webp 266w, /assets/images/material_dark@335.webp 335w, /assets/images/material_dark@352.webp 352w, /assets/images/material_dark@532.webp 532w" alt="Material Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/material_dark@220.png 220w, /assets/images/material_dark@266.png 266w, /assets/images/material_dark@335.png 335w, /assets/images/material_dark@352.png 352w, /assets/images/material_dark@532.png 532w" alt="Material Dark"/><img data-src="/assets/images/material_dark@266.png" alt="Material Dark"/></picture></div></div></div><div class="content"><div class="extra">Material Dark</div></div></a><a class="card" href="/assets/images/solarized_light.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/solarized_light@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/solarized_light@220.webp 220w, /assets/images/solarized_light@266.webp 266w, /assets/images/solarized_light@335.webp 335w, /assets/images/solarized_light@352.webp 352w, /assets/images/solarized_light@532.webp 532w" alt="Solarized Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/solarized_light@220.png 220w, /assets/images/solarized_light@266.png 266w, /assets/images/solarized_light@335.png 335w, /assets/images/solarized_light@352.png 352w, /assets/images/solarized_light@532.png 532w" alt="Solarized Light"/><img src="/assets/images/solarized_light@266.png" alt="Solarized Light"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/solarized_light@220.webp 220w, /assets/images/solarized_light@266.webp 266w, /assets/images/solarized_light@335.webp 335w, /assets/images/solarized_light@352.webp 352w, /assets/images/solarized_light@532.webp 532w" alt="Solarized Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/solarized_light@220.png 220w, /assets/images/solarized_light@266.png 266w, /assets/images/solarized_light@335.png 335w, /assets/images/solarized_light@352.png 352w, /assets/images/solarized_light@532.png 532w" alt="Solarized Light"/><img data-src="/assets/images/solarized_light@266.png" alt="Solarized Light"/></picture></div></div></div><div class="content"><div class="extra">Solarized Light</div></div></a><a class="card" href="/assets/images/solarized_dark.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/solarized_dark@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/solarized_dark@220.webp 220w, /assets/images/solarized_dark@266.webp 266w, /assets/images/solarized_dark@335.webp 335w, /assets/images/solarized_dark@352.webp 352w, /assets/images/solarized_dark@532.webp 532w" alt="Solarized Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/solarized_dark@220.png 220w, /assets/images/solarized_dark@266.png 266w, /assets/images/solarized_dark@335.png 335w, /assets/images/solarized_dark@352.png 352w, /assets/images/solarized_dark@532.png 532w" alt="Solarized Dark"/><img src="/assets/images/solarized_dark@266.png" alt="Solarized Dark"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/solarized_dark@220.webp 220w, /assets/images/solarized_dark@266.webp 266w, /assets/images/solarized_dark@335.webp 335w, /assets/images/solarized_dark@352.webp 352w, /assets/images/solarized_dark@532.webp 532w" alt="Solarized Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/solarized_dark@220.png 220w, /assets/images/solarized_dark@266.png 266w, /assets/images/solarized_dark@335.png 335w, /assets/images/solarized_dark@352.png 352w, /assets/images/solarized_dark@532.png 532w" alt="Solarized Dark"/><img data-src="/assets/images/solarized_dark@266.png" alt="Solarized Dark"/></picture></div></div></div><div class="content"><div class="extra">Solarized Dark</div></div></a><a class="card" href="/assets/images/gruvbox_light.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/gruvbox_light@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/gruvbox_light@220.webp 220w, /assets/images/gruvbox_light@266.webp 266w, /assets/images/gruvbox_light@335.webp 335w, /assets/images/gruvbox_light@352.webp 352w, /assets/images/gruvbox_light@532.webp 532w" alt="Gruvbox Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/gruvbox_light@220.png 220w, /assets/images/gruvbox_light@266.png 266w, /assets/images/gruvbox_light@335.png 335w, /assets/images/gruvbox_light@352.png 352w, /assets/images/gruvbox_light@532.png 532w" alt="Gruvbox Light"/><img src="/assets/images/gruvbox_light@266.png" alt="Gruvbox Light"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/gruvbox_light@220.webp 220w, /assets/images/gruvbox_light@266.webp 266w, /assets/images/gruvbox_light@335.webp 335w, /assets/images/gruvbox_light@352.webp 352w, /assets/images/gruvbox_light@532.webp 532w" alt="Gruvbox Light"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/gruvbox_light@220.png 220w, /assets/images/gruvbox_light@266.png 266w, /assets/images/gruvbox_light@335.png 335w, /assets/images/gruvbox_light@352.png 352w, /assets/images/gruvbox_light@532.png 532w" alt="Gruvbox Light"/><img data-src="/assets/images/gruvbox_light@266.png" alt="Gruvbox Light"/></picture></div></div></div><div class="content"><div class="extra">Gruvbox Light</div></div></a><a class="card" href="/assets/images/gruvbox_dark.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/gruvbox_dark@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/gruvbox_dark@220.webp 220w, /assets/images/gruvbox_dark@266.webp 266w, /assets/images/gruvbox_dark@335.webp 335w, /assets/images/gruvbox_dark@352.webp 352w, /assets/images/gruvbox_dark@532.webp 532w" alt="Gruvbox Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/gruvbox_dark@220.png 220w, /assets/images/gruvbox_dark@266.png 266w, /assets/images/gruvbox_dark@335.png 335w, /assets/images/gruvbox_dark@352.png 352w, /assets/images/gruvbox_dark@532.png 532w" alt="Gruvbox Dark"/><img src="/assets/images/gruvbox_dark@266.png" alt="Gruvbox Dark"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/gruvbox_dark@220.webp 220w, /assets/images/gruvbox_dark@266.webp 266w, /assets/images/gruvbox_dark@335.webp 335w, /assets/images/gruvbox_dark@352.webp 352w, /assets/images/gruvbox_dark@532.webp 532w" alt="Gruvbox Dark"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/gruvbox_dark@220.png 220w, /assets/images/gruvbox_dark@266.png 266w, /assets/images/gruvbox_dark@335.png 335w, /assets/images/gruvbox_dark@352.png 352w, /assets/images/gruvbox_dark@532.png 532w" alt="Gruvbox Dark"/><img data-src="/assets/images/gruvbox_dark@266.png" alt="Gruvbox Dark"/></picture></div></div></div><div class="content"><div class="extra">Gruvbox Dark</div></div></a><a class="card" href="/assets/images/amoled.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/amoled@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/amoled@220.webp 220w, /assets/images/amoled@266.webp 266w, /assets/images/amoled@335.webp 335w, /assets/images/amoled@352.webp 352w, /assets/images/amoled@532.webp 532w" alt="AMOLED"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/amoled@220.png 220w, /assets/images/amoled@266.png 266w, /assets/images/amoled@335.png 335w, /assets/images/amoled@352.png 352w, /assets/images/amoled@532.png 532w" alt="AMOLED"/><img src="/assets/images/amoled@266.png" alt="AMOLED"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/amoled@220.webp 220w, /assets/images/amoled@266.webp 266w, /assets/images/amoled@335.webp 335w, /assets/images/amoled@352.webp 352w, /assets/images/amoled@532.webp 532w" alt="AMOLED"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/amoled@220.png 220w, /assets/images/amoled@266.png 266w, /assets/images/amoled@335.png 335w, /assets/images/amoled@352.png 352w, /assets/images/amoled@532.png 532w" alt="AMOLED"/><img data-src="/assets/images/amoled@266.png" alt="AMOLED"/></picture></div></div></div><div class="content"><div class="extra">AMOLED</div></div></a><a class="card" href="/assets/images/dracula.png"><div class="image" aria-hidden="true" role="img"><div class="responsive container"><div class="responsive placeholder" style="padding-bottom: 177.7777777777778%;background-image: url(/assets/images/dracula@thumb.jpg)"><noscript><picture><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/dracula@220.webp 220w, /assets/images/dracula@266.webp 266w, /assets/images/dracula@335.webp 335w, /assets/images/dracula@352.webp 352w, /assets/images/dracula@532.webp 532w" alt="Dracula"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" srcset="/assets/images/dracula@220.png 220w, /assets/images/dracula@266.png 266w, /assets/images/dracula@335.png 335w, /assets/images/dracula@352.png 352w, /assets/images/dracula@532.png 532w" alt="Dracula"/><img src="/assets/images/dracula@266.png" alt="Dracula"/></picture></noscript><picture class="load-responsive"><source type="image/webp" sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/dracula@220.webp 220w, /assets/images/dracula@266.webp 266w, /assets/images/dracula@335.webp 335w, /assets/images/dracula@352.webp 352w, /assets/images/dracula@532.webp 532w" alt="Dracula"/><source sizes="(max-width: 767px) calc(50vw - 2em + 1px), (max-width: 991px) 336px, (max-width: 1199px) 221px, 267px" data-srcset="/assets/images/dracula@220.png 220w, /assets/images/dracula@266.png 266w, /assets/images/dracula@335.png 335w, /assets/images/dracula@352.png 352w, /assets/images/dracula@532.png 532w" alt="Dracula"/><img data-src="/assets/images/dracula@266.png" alt="Dracula"/></picture></div></div></div><div class="content"><div class="extra">Dracula</div></div></a></div></div></div></div></div></div><div class="ui black inverted vertical footer segment"><div class="ui center aligned container"><div class="ui stackable inverted grid"><div class="three wide column"><h4 class="ui inverted header">Community</h4><div class="ui inverted link list"><a class="item" href="https://www.transifex.com/quasseldroid-1/quasseldroid-1/">Help Translate</a><a class="item" href="https://lithium.kuschku.de/quasseldroid-theme-editor/">Create a Theme</a><a class="item" href="https://git.kuschku.de/justjanne/quasseldroid-ng/issues/">Submit an Issue</a><a class="item" href="ircs://chat.freenode.org/#quasseldroid">Join our Chat</a><a class="item" href="/docs/">Documentation</a></div></div><div class="three wide column"><h4 class="ui inverted header">Discover More</h4><div class="ui inverted link list"><a class="item" href="https://quassel-irc.org/">Quassel</a><a class="item" href="https://github.com/magne4000/quassel-webserver/">quassel-webserver</a><a class="item" href="https://github.com/phhusson/quassel-irssi">quassel-irssi</a><a class="item" href="https://woboq.com/iquassel.html">iQuassel</a><a class="item" href="http://github.com/justjanne/quassel-rest-search">Quassel-Rest-Search</a></div></div></div><div class="ui inverted section divider"></div><img class="ui centered mini image" src="/assets/images/icon.svg" aria-hidden="true" role="img"><div class="ui inverted small link list"><a class="item" href="https://git.kuschku.de/justjanne/quasseldroid-ng/">Free & Open Source</a><p class="item"><a class="ui item" href="/privacy-policy/">Privacy Policy</a> · <a class="ui item" href="https://kuschku.de/imprint/">Imprint</a></p><p class="item renewable"><img src="/assets/images/sprout.svg" aria-hidden="true" role="img"><span>This website is hosted with 100% renewable energy.</span></p></div></div></div></div><script src="/assets/js/intersectionobserver.min.js"></script><script>document.addEventListener("DOMContentLoaded", () => {
const following_bar = document.querySelector(".following.bar");
const update_top_bar = function () {
following_bar.classList.toggle("qd", window.scrollY !== 0);
@@ -56,7 +56,7 @@ window.addEventListener("load", () => {
}
// Get all of the images that are marked up to lazy load
- const images = document.querySelectorAll('picture.load-responsive');
+ const images = document.querySelectorAll('.load-responsive');
const config = {
// If the image gets within 50px in the Y axis, start the download.
rootMargin: '400px 0px',
diff --git a/index.pug b/index.pug
index a26d4eb9b2621c3b21bb6200d97e0db73d33417c..0938ec8bedeac0d3aedc7f7a8fd6d8d2a757ec5b 100644
--- a/index.pug
+++ b/index.pug
@@ -23,11 +23,17 @@ block content
#image_container(aria-hidden="true")
noscript
picture.phone
- source(sizes="(max-height: 800px) calc(50vw + 101px), (max-width: 800px) calc(50vw + 101px), calc(33vw + 1px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w")
- img(alt="Screenshot of Quasseldroid on a phone" src="/assets/images/phone@400.png" sizes="(max-height: 800px) calc(50vw + 101px), (max-width: 800px) calc(50vw + 101px), calc(33vw + 1px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w")
+ source(type="image/webp" media="(max-width: 800px) or (max-height: 800px)" sizes="calc(50vw + 101px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w")
+ source(type="image/webp" sizes="calc(33vw + 1px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w")
+ source(media="(max-width: 800px) or (max-width: 800px)" sizes="calc(50vw + 101px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w")
+ source(sizes="calc(33vw + 1px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w")
+ img(alt="Screenshot of Quasseldroid on a phone" src="/assets/images/phone@400.png")
picture.phone
- source(sizes="(max-height: 800px) calc(50vw + 101px), (max-width: 800px) calc(50vw + 101px), calc(33vw + 1px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w")
- img(alt="Screenshot of Quasseldroid on a phone" src="/assets/images/phone@400.png" sizes="(max-height: 800px) calc(50vw + 101px), (max-width: 800px) calc(50vw + 101px), calc(33vw + 1px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w")
+ source(type="image/webp" media="(max-width: 800px) or (max-height: 800px)" sizes="calc(50vw + 101px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w")
+ source(type="image/webp" sizes="calc(33vw + 1px)" srcset="/assets/images/phone@220.webp 220w, /assets/images/phone@300.webp 300w, /assets/images/phone@400.webp 400w, /assets/images/phone@520.webp 520w, /assets/images/phone@640.webp 640w, /assets/images/phone@800.webp 800w, /assets/images/phone@1000.webp 1000w, /assets/images/phone@1220.webp 1220w")
+ source(media="(max-width: 800px) or (max-height: 800px)" sizes="calc(50vw + 101px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w")
+ source(sizes="calc(33vw + 1px)" srcset="/assets/images/phone@220.png 220w, /assets/images/phone@300.png 300w, /assets/images/phone@400.png 400w, /assets/images/phone@520.png 520w, /assets/images/phone@640.png 640w, /assets/images/phone@800.png 800w, /assets/images/phone@1000.png 1000w, /assets/images/phone@1220.png 1220w")
+ img(alt="Screenshot of Quasseldroid on a phone" src="/assets/images/phone@400.png")
noscript
picture.tablet
source(sizes="calc(33vw + 1px)" srcset="/assets/images/tablet@545.webp 545w, /assets/images/tablet@640.webp 640w, /assets/images/tablet@720.webp 720w, /assets/images/tablet@800.webp 800w, /assets/images/tablet@880.webp 880w, /assets/images/tablet@960.webp 960w, /assets/images/tablet@1090.webp 1090w, /assets/images/tablet@1635.webp 1635w, /assets/images/tablet@2180.webp 2180w")
@@ -70,7 +76,7 @@ block content
.ui.one.doubling.cards
.card
.image(aria-hidden="true" role="img")
- +responsive_image("Screenshot of Quasseldroid notifications", "/assets/images/notifications@thumb.jpg", "/assets/images/notifications@590.png", "/assets/images/notifications@363.png 363w, /assets/images/notifications@474.png 474w, /assets/images/notifications@590.png 590w", "(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px", "51.57407407407407%", "/assets/images/notifications@590.webp", "/assets/images/notifications@363.webp 363w, /assets/images/notifications@474.webp 474w, /assets/images/notifications@590.webp 590w")
+ +responsive_image("Screenshot of Quasseldroid notifications", "/assets/images/notifications@thumb.jpg", "/assets/images/notifications@590.png", "/assets/images/notifications@363.png 363w, /assets/images/notifications@474.png 474w, /assets/images/notifications@590.png 590w", "(max-width: 767px) calc(100vw + 1px), (max-width: 991px) 364px, (max-width: 1199px) 475px, 591px", "51.57407407407407%", "/assets/images/notifications@590.png", "/assets/images/notifications@363.png 363w, /assets/images/notifications@474.png 474w, /assets/images/notifications@590.png 590w")
.ui.divider
.row#make_it_yours
.seven.wide.column.left.aligned
diff --git a/privacy-policy/index.html b/privacy-policy/index.html
index 7dacfcdd089e3700ac30a7014ca978cefd35fba5..e87687111fd21e28ea9aad6a331462214c3b2a6f 100644
--- a/privacy-policy/index.html
+++ b/privacy-policy/index.html
@@ -54,7 +54,7 @@ window.addEventListener("load", () => {
}
// Get all of the images that are marked up to lazy load
- const images = document.querySelectorAll('picture.load-responsive');
+ const images = document.querySelectorAll('.load-responsive');
const config = {
// If the image gets within 50px in the Y axis, start the download.
rootMargin: '400px 0px',
diff --git a/releases/index.html b/releases/index.html
index a5d0858fe119a7549f12b72e7a41c752ee5415b7..772123a1117ea100bbad9e8d5f85c7f3c1f98fda 100644
--- a/releases/index.html
+++ b/releases/index.html
@@ -46,7 +46,7 @@ window.addEventListener("load", () => {
}
// Get all of the images that are marked up to lazy load
- const images = document.querySelectorAll('picture.load-responsive');
+ const images = document.querySelectorAll('.load-responsive');
const config = {
// If the image gets within 50px in the Y axis, start the download.
rootMargin: '400px 0px',