Elgato_dark/podman-desktop
1
0
Fork 0
mirror of https://github.com/podman-desktop/podman-desktop synced 2026-05-24 10:18:53 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(PreferenceResource): adding light theme support for some preferences page (#7107)

Browse source 
* feat(PreferenceResource): adding light theme support for preferences tiles

Signed-off-by: axel7083 <42176370+axel7083@users.noreply.github.com>

* feat(PreferenceResource): more light theme

Signed-off-by: axel7083 <42176370+axel7083@users.noreply.github.com>

---------

Signed-off-by: axel7083 <42176370+axel7083@users.noreply.github.com>
This commit is contained in:
axel7083 2024-05-07 10:24:51 +02:00 committed by GitHub
parent fb0b2f0109
commit 1e7039cfdb
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 32 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/renderer/src/lib/preferences/PreferencesConnectionsEmptyRendering.svelte
View file

@ -6,7 +6,7 @@ export let hidden: boolean;
</script>
{#if !hidden}
<div class="ml-6 mt-2 text-sm text-gray-300">
<div class="ml-6 mt-2 text-sm">
<Markdown markdown="{message}" />
</div>
{/if}

22
packages/renderer/src/lib/preferences/PreferencesProxiesRendering.svelte
View file

@ -62,7 +62,7 @@ function validate(event: any) {
</script>
<SettingsPage title="Proxy Settings">
<div class="flex flex-col bg-charcoal-600 rounded-md p-3 space-y-2">
<div class="flex flex-col bg-[var(--pd-invert-content-card-bg)] rounded-md p-3 space-y-2">
<!-- if proxy is not enabled, display a toggle -->
<label for="toggle-proxy" class="inline-flex relative items-center mt-1 mb-4 cursor-pointer">
@ -75,13 +75,15 @@ function validate(event: any) {
<div
class="w-9 h-5 rounded-full peer bg-zinc-400 peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-400 after:border after:rounded-full after:h-4 after:w-4 after:transition-all border-gray-900 peer-checked:bg-violet-600">
</div>
<span class="ml-3 text-sm font-medium text-gray-400"
<span class="ml-3 text-sm font-medium text-[var(--pd-invert-content-card-header-text)]"
>Proxy configuration {proxyState ? 'enabled' : 'disabled'}</span>
</label>
{#if proxySettings}
<div class="space-y-2">
<label for="httpProxy" class="mb-2 text-sm font-medium {proxyState ? 'text-gray-400' : 'text-gray-900'}"
<label
for="httpProxy"
class="mb-2 text-sm font-medium {proxyState ? 'text-[var(--pd-invert-content-card-text)]' : 'text-gray-900'}"
>Web Proxy (HTTP):</label>
<Input
name="httpProxy"
@ -96,8 +98,11 @@ function validate(event: any) {
{/if}
</div>
<div class="space-y-2">
<label for="httpsProxy" class="pt-4 mb-2 text-sm font-medium {proxyState ? 'text-gray-400' : 'text-gray-900'}"
>Secure Web Proxy (HTTPS):</label>
<label
for="httpsProxy"
class="pt-4 mb-2 text-sm font-medium {proxyState
? 'text-[var(--pd-invert-content-card-text)]'
: 'text-gray-900'}">Secure Web Proxy (HTTPS):</label>
<Input
name="httpsProxy"
id="httpsProxy"
@ -111,8 +116,11 @@ function validate(event: any) {
{/if}
</div>
<div class="space-y-2">
<label for="httpProxy" class="pt-4 mb-2 text-sm font-medium {proxyState ? 'text-gray-400' : 'text-gray-900'}"
>Bypass proxy settings for these hosts and domains:</label>
<label
for="httpProxy"
class="pt-4 mb-2 text-sm font-medium {proxyState
? 'text-[var(--pd-invert-content-card-text)]'
: 'text-gray-900'}">Bypass proxy settings for these hosts and domains:</label>
<Input
name="noProxy"
id="noProxy"

15
packages/renderer/src/lib/preferences/PreferencesRegistriesEditing.svelte
View file

@ -235,10 +235,13 @@ function removeExistingRegistry(registry: containerDesktopAPI.Registry) {
</Button>
</div>
<div class="container bg-charcoal-600 rounded-md p-3">
<div class="container bg-[var(--pd-invert-content-card-bg)] rounded-md p-3">
<!-- Registries table start -->
<div class="w-full border-t border-b border-gray-900" role="table" aria-label="Registries">
<div class="flex w-full space-x-2" role="rowgroup" aria-label="header">
<div
class="flex w-full space-x-2 text-[var(--pd-invert-content-card-header-text)]"
role="rowgroup"
aria-label="header">
<div class="text-left py-4 text-sm font-bold w-2/5 pl-5" role="columnheader">Registry Location</div>
<div class="text-left py-4 text-sm font-bold w-1/5" role="columnheader">Username</div>
<div class="text-left py-4 text-sm font-bold w-1/5" role="columnheader">Password</div>
@ -248,7 +251,7 @@ function removeExistingRegistry(registry: containerDesktopAPI.Registry) {
{#each $registriesInfos as registry}
<!-- containerDesktopAPI.Registry row start -->
<div
class="flex flex-col w-full border-t border-gray-900"
class="flex flex-col w-full border-t border-gray-900 text-[var(--pd-invert-content-card-text)]"
role="row"
aria-label="{registry.name ? registry.name : registry.serverUrl}">
<div class="flex flex-row items-center pt-4 pb-3 space-x-2">
@ -380,7 +383,7 @@ function removeExistingRegistry(registry: containerDesktopAPI.Registry) {
{#each $registriesSuggestedInfos as registry, i (registry)}
<!-- Add new registry form start -->
<div
class="flex flex-col w-full border-t border-gray-900"
class="flex flex-col w-full border-t border-gray-900 text-[var(--pd-invert-content-card-text)]"
role="row"
aria-label="{registry.name ? registry.name : registry.url}">
<div class="flex flex-row items-center pt-4 pb-3 space-x-2">
@ -395,7 +398,7 @@ function removeExistingRegistry(registry: containerDesktopAPI.Registry) {
height="24" />
{/if}
<!-- By default, just show the name, but if we go to add it, show the full URL including https -->
<span class="ml-2 text-gray-700">
<span class="ml-2">
{#if listedSuggestedRegistries[i]}
https://{registry.url}
{:else}
@ -454,7 +457,7 @@ function removeExistingRegistry(registry: containerDesktopAPI.Registry) {
{#if showNewRegistryForm}
<!-- Add new registry form start -->
<div class="flex flex-col w-full border-t border-gray-900">
<div class="flex flex-col w-full border-t border-gray-900 text-[var(--pd-invert-content-card-text)]">
<div class="flex flex-row items-center pt-4 pb-3 space-x-2">
<div class="pl-5 text-sm w-2/5">
<Input

10
packages/renderer/src/lib/preferences/PreferencesResourcesRendering.svelte
View file

@ -374,7 +374,7 @@ function hasAnyConfiguration(provider: ProviderInfo) {
{#each providers as provider}
<div
class="bg-charcoal-600 mb-5 rounded-md p-3 divide-x divide-gray-900 flex"
class="bg-[var(--pd-invert-content-card-bg)] mb-5 rounded-md p-3 divide-x divide-gray-900 flex"
role="region"
aria-label="{provider.id}">
<div role="region" aria-label="Provider Setup">
@ -389,7 +389,8 @@ function hasAnyConfiguration(provider: ProviderInfo) {
<img src="{provider.images.icon.dark}" alt="{provider.name}" class="max-w-[40px]" />
{/if}
{/if}
<span class="my-auto text-gray-400 ml-3 break-words">{provider.name}</span>
<span class="my-auto text-[var(--pd-invert-content-card-header-text)] ml-3 break-words"
>{provider.name}</span>
</div>
<div class="text-center mt-10">
<!-- Some providers have a status of 'unknown' so that they do not appear in the dashboard, this allows onboarding to still show. -->
@ -445,7 +446,10 @@ function hasAnyConfiguration(provider: ProviderInfo) {
</div>
</div>
<!-- providers columns -->
<div class="grow flex flex-wrap divide-gray-900 ml-2" role="region" aria-label="Provider Connections">
<div
class="grow flex flex-wrap divide-gray-900 ml-2 text-[var(--pd-invert-content-card-text)]"
role="region"
aria-label="Provider Connections">
<PreferencesConnectionsEmptyRendering
message="{provider.emptyConnectionMarkdownDescription}"
hidden="{provider.containerConnections.length > 0 || provider.kubernetesConnections.length > 0}" />