Add .breakpoint_indicator

This commit is contained in:
Thelonius Kort
2023-02-11 20:05:00 +01:00
parent 7cd9a09cfd
commit 666c499c72
2 changed files with 14 additions and 0 deletions

View File

@ -38,4 +38,17 @@ defmodule OutlookWeb.DarkModeComponent do
</div>
"""
end
def breakpoint_indicator(assigns) do
~H"""
<div class="absolute p-1 bg-white text-black dark:bg-black dark:text-white">
<span class="sm:hidden">xs</span>
<span class="hidden sm:inline md:hidden">sm</span>
<span class="hidden md:inline lg:hidden">md</span>
<span class="hidden lg:inline xl:hidden">lg</span>
<span class="hidden xl:inline 2xl:hidden">xl</span>
<span class="hidden 2xl:inline">2xl</span>
</div>
"""
end
end

View File

@ -1,4 +1,5 @@
<header class="">
<.breakpoint_indicator :if={Mix.env == :dev} />
<a href="/">
<img class="w-full" src="/images/elbefoto-lg.jpg"
src-set="elbefoto-xxl.jpg 4496w, /images/elbefoto-lg.jpg 2248w, /images/elbefoto-md.jpg 1199w, /images/elbefoto-sm.jpg 991w, /images/elbefoto-xs.jpg 767w">