From 666c499c722893d57bccf2c16a0fb6c3b4665f34 Mon Sep 17 00:00:00 2001
From: Thelonius Kort <tnt@users.noreply.github.com>
Date: Sat, 11 Feb 2023 20:05:00 +0100
Subject: [PATCH] Add .breakpoint_indicator

---
 lib/outlook_web/components/dark_mode_component.ex   | 13 +++++++++++++
 lib/outlook_web/components/layouts/public.html.heex |  1 +
 2 files changed, 14 insertions(+)

diff --git a/lib/outlook_web/components/dark_mode_component.ex b/lib/outlook_web/components/dark_mode_component.ex
index f937361..534f582 100644
--- a/lib/outlook_web/components/dark_mode_component.ex
+++ b/lib/outlook_web/components/dark_mode_component.ex
@@ -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
diff --git a/lib/outlook_web/components/layouts/public.html.heex b/lib/outlook_web/components/layouts/public.html.heex
index 6b05510..760f728 100644
--- a/lib/outlook_web/components/layouts/public.html.heex
+++ b/lib/outlook_web/components/layouts/public.html.heex
@@ -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">