🚀 Feature: Dark mode OIDC Client Icons #129

Open
opened 2025-10-07 23:54:09 +03:00 by OVERLORD · 6 comments
Owner

Originally created by @shelldandy on GitHub.

Originally assigned to: @kmendell on GitHub.

Feature description

Let's add an optional dark mode (or light mode) icon for the OIDC Clients.

In dashboard icons both versions are usually provided and it would be nice to have them in here for UX:

https://dashboardicons.com/icons/karakeep

Image

Pitch

Optional dark logo would be nice so the OIDC client lists looks nice on both color schemes

Originally created by @shelldandy on GitHub. Originally assigned to: @kmendell on GitHub. ### Feature description Let's add an optional dark mode (or light mode) icon for the OIDC Clients. In dashboard icons both versions are usually provided and it would be nice to have them in here for UX: https://dashboardicons.com/icons/karakeep <img width="1216" height="825" alt="Image" src="https://github.com/user-attachments/assets/77bec95f-9ccd-4bc9-84fa-6af07997d540" /> ### Pitch Optional dark logo would be nice so the OIDC client lists looks nice on both color schemes
Author
Owner

@jloh commented on GitHub:

I opened the original issue that was closed. I have several apps that have light/dark icons that would greatly appreciate this. I think the fact that Pocket ID itself has a light/dark variation for its icon hints towards it being a wanted feature.

@jloh commented on GitHub: I opened the original issue that was closed. I have several apps that have light/dark icons that would greatly appreciate this. I think the fact that Pocket ID itself has a light/dark variation for its icon hints towards it being a wanted feature.
Author
Owner

@michaelbeaumont commented on GitHub:

Duplicate of https://github.com/pocket-id/pocket-id/issues/178

@michaelbeaumont commented on GitHub: Duplicate of https://github.com/pocket-id/pocket-id/issues/178
Author
Owner

@kmendell commented on GitHub:

Elias and i have though about this from a previous issue in the past. Our thought were that it would clutter the ui have two different image selctors when id say 80% of icons have a universal variant, This was awhile ago though so maybe we could havea chnage of heart. Ill leave this open till @stonith404 gets back and puts his opinion.

@kmendell commented on GitHub: Elias and i have though about this from a previous issue in the past. Our thought were that it would clutter the ui have two different image selctors when id say 80% of icons have a universal variant, This was awhile ago though so maybe we could havea chnage of heart. Ill leave this open till @stonith404 gets back and puts his opinion.
Author
Owner

@Elyviere commented on GitHub:

I think this could be relatively cleanly added by simply adding a light/dark toggle by the icon buttons. Please excuse my terrible paint skills, it's meant to be a sun/moon but use whatever light/dark switch Pocketid already has.

Image

Upon uploading an image, the same image is set for light/dark mode. The preselected option matches your UI, so if you're using PocketID in dark mode then dark mode is preselected. When switching to light/dark mode, the only change is that the background of the image changes. If the user now uploads a new image, it is only set for that mode.

Image

In summary,

When adding a new icon:

  • If there are 0 icons
    • Add the new icon to both light and dark mode
  • If there is 1 icon, used for both modes
    • Add the new icon to the selected mode, leaving the existing icon on the other mode
  • If there are 2 icons
    • Replace the icon for the selected mode only

When removing an icon:

  • If there is 1 icon, used for both modes
    • Remove it for both modes
  • If there are 2 icons
    • Remove the icon for this mode and instead use the icon for the other mode (so both modes now use the same icon)
@Elyviere commented on GitHub: I think this could be relatively cleanly added by simply adding a light/dark toggle by the icon buttons. Please excuse my terrible paint skills, it's meant to be a sun/moon but use whatever light/dark switch Pocketid already has. <img width="334" height="203" alt="Image" src="https://github.com/user-attachments/assets/aec12f8f-de43-4431-b453-9b3c07d1aeca" /> Upon uploading an image, the same image is set for light/dark mode. The preselected option matches your UI, so if you're using PocketID in dark mode then dark mode is preselected. When switching to light/dark mode, the only change is that the background of the image changes. If the user now uploads a new image, it is only set for that mode. <img width="268" height="167" alt="Image" src="https://github.com/user-attachments/assets/9fda44f0-e99b-4ead-88d4-859c6475b2e7" /> In summary, When adding a new icon: - If there are 0 icons - Add the new icon to both light and dark mode - If there is 1 icon, used for both modes - Add the new icon to the selected mode, leaving the existing icon on the other mode - If there are 2 icons - Replace the icon for the selected mode only When removing an icon: - If there is 1 icon, used for both modes - Remove it for both modes - If there are 2 icons - Remove the icon for this mode and instead use the icon for the other mode (so both modes now use the same icon)
Author
Owner

@fred8044 commented on GitHub:

I hope this feature will be implemented.

@fred8044 commented on GitHub: I hope this feature will be implemented.
Author
Owner

@janreinhardt commented on GitHub:

Errr, does Pocket-ID itself have a switch for dark mode? Cant find it!
But in the settings, there are 2 application logos for light and for dark mode (?), this applies to situations when this is set via a browser preference?

@janreinhardt commented on GitHub: Errr, does Pocket-ID itself have a switch for dark mode? Cant find it! But in the settings, there are 2 application logos for light and for dark mode (?), this applies to situations when this is set via a browser preference?
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/pocket-id-pocket-id-1#129