Fix people dropdown in dark mode

plausible · Jan 7, 2025 · 4f61cfa · 4f61cfa
1 parent 0fd45da
commit 4f61cfa
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 6 deletions.
diff --git a/lib/plausible_web/components/generic.ex b/lib/plausible_web/components/generic.ex
@@ -271,7 +271,7 @@ defmodule PlausibleWeb.Components.Generic do
   attr(:rest, :global, include: ~w(method))
   slot(:inner_block, required: true)
 
-  @base_class "block rounded-lg text-sm/6 text-gray-900 ui-disabled:text-gray-500 dark:text-gray-100 px-3.5 py-1.5"
+  @base_class "block rounded-lg text-sm/6 text-gray-900 ui-disabled:text-gray-500 dark:text-gray-100 dark:ui-disabled:text-gray-400 px-3.5 py-1.5"
   @clickable_class "hover:bg-gray-100 dark:hover:bg-gray-700"
   def dropdown_item(assigns) do
     assigns =

diff --git a/lib/plausible_web/templates/site/settings_people.html.heex b/lib/plausible_web/templates/site/settings_people.html.heex
@@ -43,22 +43,22 @@
               </div>
 
               <.dropdown class="relative">
-                <:button class="bg-white dark:bg-gray-300 text-gray-800 hover:bg-gray-50 focus-visible:outline-gray-100 whitespace-nowrap truncate inline-flex items-center gap-x-2 font-medium rounded-md px-3.5 py-2.5 text-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 disabled:bg-gray-400 dark:disabled:text-white dark:disabled:text-gray-400 dark:disabled:bg-gray-700">
+                <:button class="bg-transparent text-gray-800 dark:text-gray-100 hover:bg-gray-50 dark:hover:bg-gray-700 focus-visible:outline-gray-100 whitespace-nowrap truncate inline-flex items-center gap-x-2 font-medium rounded-md px-3.5 py-2.5 text-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 disabled:bg-gray-400 dark:disabled:text-white dark:disabled:text-gray-400 dark:disabled:bg-gray-700">
                   <%= membership.role |> to_string() |> String.capitalize() %>
                   <Heroicons.chevron_down mini class="size-4 mt-0.5" />
                 </:button>
                 <:menu class="max-w-60">
                   <%= if membership.role == :owner do %>
                     <.dropdown_item disabled={true}>
                       <div>Owner</div>
-                      <div class="text-gray-500 text-xs/5">
+                      <div class="text-gray-500 dark:text-gray-400 text-xs/5">
                         Site owner cannot be assigned to any other role
                       </div>
                     </.dropdown_item>
                     <.dropdown_divider />
                     <.dropdown_item
                       :if={@conn.assigns[:site_role] == :owner}
-                      class="text-red-600 hover:text-red-600"
+                      class="text-red-600 dark:text-red-500 hover:text-red-600"
                       href={
                         Routes.membership_path(
                           @conn,
@@ -84,7 +84,7 @@
                       disabled={membership.role == "admin"}
                     >
                       <div>Admin</div>
-                      <div class="text-gray-500 text-xs/5">View stats and edit site settings</div>
+                      <div class="text-gray-500 dark:text-gray-400 text-xs/5">View stats and edit site settings</div>
                     </.dropdown_item>
                     <.dropdown_item
                       href={
@@ -100,7 +100,7 @@
                       disabled={membership.role == "viewer"}
                     >
                       <div>Viewer</div>
-                      <div class="text-gray-500 text-xs/5">View stats only</div>
+                      <div class="text-gray-500 dark:text-gray-400 text-xs/5">View stats only</div>
                     </.dropdown_item>
                     <.dropdown_divider />
                     <.dropdown_item