fix live flashes not dismissable by click
This commit is contained in:
		| @@ -1,18 +1,45 @@ | ||||
| <main role="main" class="min-h-full min-w-full"> | ||||
| <main role="main" class="pb-8 min-w-full"> | ||||
|   <header> | ||||
|     <.topbar current_user={assigns[:current_user]} /> | ||||
|  | ||||
|     <div class="mx-8 my-2 flex flex-col space-y-4 text-center"> | ||||
|       <p :if={@flash["info"]} class="alert alert-info" role="alert"> | ||||
|         <%= @flash["info"] %> | ||||
|       <p | ||||
|         :if={@flash && @flash |> Map.has_key?("info")} | ||||
|         class="alert alert-info cursor-pointer" | ||||
|         role="alert" | ||||
|         phx-click="lv:clear-flash" | ||||
|         phx-value-key="info" | ||||
|       > | ||||
|         <%= live_flash(@flash, :info) %> | ||||
|       </p> | ||||
|       <p :if={@flash["error"]} class="alert alert-danger" role="alert"> | ||||
|         <%= @flash["error"] %> | ||||
|  | ||||
|       <p | ||||
|         :if={@flash && @flash |> Map.has_key?("error")} | ||||
|         class="alert alert-danger cursor-pointer" | ||||
|         role="alert" | ||||
|         phx-click="lv:clear-flash" | ||||
|         phx-value-key="error" | ||||
|       > | ||||
|         <%= live_flash(@flash, :error) %> | ||||
|       </p> | ||||
|     </div> | ||||
|   </header> | ||||
|  | ||||
|   <div class="pb-4 mx-4 sm:mx-8 md:mx-16"> | ||||
|   <div class="mx-4 sm:mx-8 md:mx-16"> | ||||
|     <%= @inner_content %> | ||||
|   </div> | ||||
| </main> | ||||
|  | ||||
| <div | ||||
|   id="disconnect" | ||||
|   class="z-50 fixed opacity-0 bottom-8 right-12 px-8 py-4 w-max h-max | ||||
|   border border-primary-400 shadow-lg rounded-lg bg-primary-900 text-primary-400 | ||||
|   flex justify-center items-center space-x-4 | ||||
|   transition-opacity ease-in-out duration-500 delay-[2000ms]" | ||||
| > | ||||
|   <i class="fas fa-fade text-md fa-satellite-dish"></i> | ||||
|  | ||||
|   <h1 class="title text-md"> | ||||
|     <%= gettext("Reconnecting...") %> | ||||
|   </h1> | ||||
| </div> | ||||
|   | ||||
| @@ -1,45 +0,0 @@ | ||||
| <main class="pb-8 min-w-full"> | ||||
|   <header> | ||||
|     <.topbar current_user={assigns[:current_user]} /> | ||||
|  | ||||
|     <div class="mx-8 my-2 flex flex-col space-y-4 text-center"> | ||||
|       <p | ||||
|         :if={@flash && @flash |> Map.has_key?("info")} | ||||
|         class="alert alert-info" | ||||
|         role="alert" | ||||
|         phx-click="lv:clear-flash" | ||||
|         phx-value-key="info" | ||||
|       > | ||||
|         <%= live_flash(@flash, "info") %> | ||||
|       </p> | ||||
|  | ||||
|       <p | ||||
|         :if={@flash && @flash |> Map.has_key?("error")} | ||||
|         class="alert alert-danger" | ||||
|         role="alert" | ||||
|         phx-click="lv:clear-flash" | ||||
|         phx-value-key="error" | ||||
|       > | ||||
|         <%= live_flash(@flash, "error") %> | ||||
|       </p> | ||||
|     </div> | ||||
|   </header> | ||||
|  | ||||
|   <div class="mx-4 sm:mx-8 md:mx-16"> | ||||
|     <%= @inner_content %> | ||||
|   </div> | ||||
| </main> | ||||
|  | ||||
| <div | ||||
|   id="disconnect" | ||||
|   class="z-50 fixed opacity-0 bottom-12 right-12 px-8 py-4 w-max h-max | ||||
|   border border-primary-400 shadow-lg rounded-lg bg-primary-900 text-primary-400 | ||||
|   flex justify-center items-center space-x-4 | ||||
|   transition-opacity ease-in-out duration-500 delay-[2000ms]" | ||||
| > | ||||
|   <i class="fas fa-fade text-md fa-satellite-dish"></i> | ||||
|  | ||||
|   <h1 class="title text-md"> | ||||
|     <%= gettext("Reconnecting...") %> | ||||
|   </h1> | ||||
| </div> | ||||
		Reference in New Issue
	
	Block a user