Skip to content

[6.x] Fix theme colors gray-950 and success #13547

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jasonvarga merged 5 commits into from
Jan 14, 2026
Merged

[6.x] Fix theme colors gray-950 and success #13547

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
473040c
fix theme colors gray-950 and success
heidkaemper Jan 14, 2026
37d6ad9
Update previous 950 values for dark mode so they're not so intense
JayGeorge Jan 14, 2026
e4ea10a
Tiny border fix while I'm here
JayGeorge Jan 14, 2026
cfa67c1
Tweak value
JayGeorge Jan 14, 2026
dea7ba8
Tweak value
JayGeorge Jan 14, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions resources/css/components/fieldtypes/bard.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -255,10 +255,10 @@
@apply fixed inset-0 min-h-screen overflow-scroll border-none rounded-none bg-gray-100 pt-14 dark:bg-gray-850;

& > .bard-editor {
@apply relative mx-auto my-6 max-w-5xl rounded-lg bg-white px-8 shadow-ui-md dark:bg-gray-950 dark:shadow-lg;
@apply relative mx-auto my-6 max-w-5xl rounded-lg bg-white px-8 shadow-ui-md dark:bg-gray-925 dark:shadow-lg;
}
.bard-content {
@apply dark:bg-gray-950;
@apply dark:bg-gray-925;
}

.bard-fixed-toolbar {
Expand Down
2 changes: 1 addition & 1 deletion resources/css/components/page-tree.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@
.nav-builder {
background: none;
.tree-node {
@apply bg-gray-200/45 dark:bg-gray-950;
@apply bg-gray-200/45 dark:bg-gray-950/35;
.tree-node-inner {
@apply px-1;
}
Expand Down
2 changes: 1 addition & 1 deletion resources/css/elements/tables.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -159,7 +159,7 @@
/* Row Selection */
.data-table[data-has-selections] {
tbody tr[data-row="selected"] td {
@apply bg-gray-100 dark:bg-gray-950;
@apply bg-gray-100 dark:bg-gray-925;
}
}

Expand Down
4 changes: 1 addition & 3 deletions resources/css/ui.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
--color-gray-850: var(--theme-color-gray-850);
--color-gray-900: var(--theme-color-gray-900);
--color-gray-925: var(--theme-color-gray-925);
--color-gray-950: var(--theme-color-zinc-950);
--color-gray-950: var(--theme-color-gray-950);
--color-volt: oklch(93.86% 0.2018 122.24);

--color-body-bg: var(--theme-color-body-bg);
Expand Down Expand Up @@ -152,8 +152,6 @@
.dark {
@theme inline {
--color-primary-hover: color-mix(in oklch, var(--color-primary) 100%, white 30%);
--color-success: var(--color-green-500);
--color-gray-950: hsl(240deg 7% 8%);
}
}

Expand Down
4 changes: 2 additions & 2 deletions resources/js/components/fieldtypes/bard/Set.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,9 @@
>
<div ref="content" hidden />
<header
class="group/header animate-border-color show-focus-within flex items-center rounded-[calc(var(--radius-lg)-1px)] px-1.5 antialiased duration-200 bg-gray-100/50 dark:bg-gray-925 hover:bg-gray-100 dark:hover:bg-gray-950 border-gray-300 dark:shadow-md border-b-1 border-b-transparent"
class="group/header animate-border-color show-focus-within flex items-center rounded-[calc(var(--radius-lg)-1px)] px-1.5 antialiased duration-200 bg-gray-100/50 dark:bg-gray-925 hover:bg-gray-100 dark:hover:bg-gray-950/45 border-gray-300 dark:shadow-md border-b-1 border-b-transparent"
:class="{
'bg-gray-200/50 dark:bg-gray-950 rounded-b-none border-b-gray-300! dark:border-b-white/10!': !collapsed
'bg-gray-200/50 dark:bg-gray-950/35 rounded-b-none border-b-gray-300! dark:border-b-white/10!': !collapsed
}"
>
<Icon data-drag-handle name="handles" class="size-4 cursor-grab text-gray-400" v-if="!isReadOnly" />
Expand Down
4 changes: 2 additions & 2 deletions resources/js/components/fieldtypes/replicator/Set.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -152,9 +152,9 @@ function onAnimationComplete() {
:data-type="config.handle"
>
<header
class="group/header animate-border-color flex items-center show-focus-within rounded-[calc(var(--radius-lg)-1px)] px-1.5 antialiased duration-200 bg-gray-100/50 dark:bg-gray-925 hover:bg-gray-100 dark:hover:bg-gray-950 border-gray-300 dark:shadow-md border-b-1 border-b-transparent"
class="group/header animate-border-color flex items-center show-focus-within rounded-[calc(var(--radius-lg)-1px)] px-1.5 antialiased duration-200 bg-gray-100/50 dark:bg-gray-925 hover:bg-gray-100 dark:hover:bg-gray-950/45 border-gray-300 dark:shadow-md border-b-1 border-b-transparent"
:class="{
'bg-gray-200/50 dark:bg-gray-950 rounded-b-none border-b-gray-300! dark:border-b-white/10!': !collapsed
'bg-gray-200/50 dark:bg-gray-950/35 rounded-b-none border-b-gray-300! dark:border-b-white/10!': !collapsed
}"
>
<Icon
Expand Down
2 changes: 1 addition & 1 deletion resources/js/components/publish/FullscreenHeader.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<template>
<header class="fixed h-12 inset-x-0 top-0 z-max flex items-center justify-between bg-gray-50 dark:bg-gray-950 px-4 shadow-ui-lg dark:shadow-none dark:border-b dark:border-white/10">
<header class="fixed h-12 inset-x-0 top-0 z-max flex items-center justify-between bg-gray-50 dark:bg-gray-925 px-4 shadow-ui-lg dark:shadow-none dark:border-b dark:border-white/10">
<ui-heading class="shrink-0" :text="__(title)" />
<div class="flex min-w-max items-center gap-4">
<slot />
Expand Down
2 changes: 1 addition & 1 deletion resources/js/components/ui/AuthCard.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ const hasHeader = computed(() => {
</script>

<template>
<div class="bg-white dark:bg-gray-950 backdrop-blur-[2px] border border-gray-200 dark:border-none rounded-2xl p-2 shadow-[0_8px_5px_-6px_rgba(0,0,0,0.12),_0_3px_8px_0_rgba(0,0,0,0.02),_0_30px_22px_-22px_rgba(39,39,42,0.35)] dark:shadow-[0_8px_5px_-6px_rgba(0,0,0,0.3),_0_3px_8px_0_rgba(0,0,0,0.15),_0_30px_22px_-22px_rgba(0,0,0,0.4)]">
<div class="bg-white dark:bg-gray-925 backdrop-blur-[2px] border border-gray-200 dark:border-none rounded-2xl p-2 shadow-[0_8px_5px_-6px_rgba(0,0,0,0.12),_0_3px_8px_0_rgba(0,0,0,0.02),_0_30px_22px_-22px_rgba(39,39,42,0.35)] dark:shadow-[0_8px_5px_-6px_rgba(0,0,0,0.3),_0_3px_8px_0_rgba(0,0,0,0.15),_0_30px_22px_-22px_rgba(0,0,0,0.4)]">
<div class="relative space-y-3 rounded-xl border border-gray-300 bg-white dark:bg-gray-850 dark:border-gray-700 p-4 shadow-[0_1px_16px_-2px_rgba(63,63,71,0.2)]">
<header class="flex flex-col justify-center items-center mb-8 py-3" v-if="hasHeader">
<ui-card class="p-2! mb-4 flex items-center justify-center" v-if="icon">
Expand Down
4 changes: 2 additions & 2 deletions resources/js/components/ui/Calendar/Calendar.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -93,13 +93,13 @@ const gridStyle = computed(() => {
<div>
<Component
:is="components.CalendarPrev"
class="inline-flex size-8 cursor-pointer items-center justify-center rounded-md hover:bg-gray-50 active:scale-90 dark:hover:bg-gray-950"
class="inline-flex size-8 cursor-pointer items-center justify-center rounded-md hover:bg-gray-50 active:scale-90 dark:hover:bg-gray-925"
>
<Icon name="chevron-left" class="size-4" />
</Component>
<Component
:is="components.CalendarNext"
class="inline-flex size-8 cursor-pointer items-center justify-center rounded-md hover:bg-gray-50 active:scale-90 dark:hover:bg-gray-950"
class="inline-flex size-8 cursor-pointer items-center justify-center rounded-md hover:bg-gray-50 active:scale-90 dark:hover:bg-gray-925"
>
<Icon name="chevron-right" class="size-4" />
</Component>
Expand Down
2 changes: 1 addition & 1 deletion resources/js/components/ui/Context/Item.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ const classes = cva({
'rounded-lg px-1 py-1.5 text-sm antialiased',
'text-gray-700 dark:text-gray-300',
'not-data-disabled:cursor-pointer data-disabled:opacity-50',
'hover:not-data-disabled:bg-gray-50 dark:hover:not-data-disabled:bg-gray-950 outline-hidden',
'hover:not-data-disabled:bg-gray-50 dark:hover:not-data-disabled:bg-gray-925 outline-hidden',
],
variants: {
variant: {
Expand Down
2 changes: 1 addition & 1 deletion resources/js/components/ui/Input/GroupPrepend.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ const props = defineProps({
:class="[
'flex items-center justify-center',
'shadow-ui-sm disabled:shadow-none',
'border border-gray-300 bg-gray-50 text-gray-600 antialiased dark:border-gray-700 dark:bg-gray-950 dark:text-gray-300',
'border border-gray-300 bg-gray-50 text-gray-600 antialiased dark:border-gray-700 dark:bg-gray-925 dark:text-gray-300',
'rounded-s-lg px-3 text-sm leading-[1.375rem] shrink-0',
]"
data-ui-input-group-prepend
Expand Down
2 changes: 1 addition & 1 deletion resources/js/components/ui/Listing/Presets.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -174,7 +174,7 @@ function deletePreset() {
<template>
<Tabs v-model:modelValue="currentTab">
<div class="relative flex shrink-0 items-center space-x-2.5 px-2 -mt-2 sm:px-0 starting-style-transition">
<TabList class="flex-1 space-x-2.5 !border-gray-200 !dark:border-gray-800">
<TabList class="flex-1 space-x-2.5 border-gray-200 !dark:border-gray-800">
<PresetTrigger name="all" :text="__('All')" />
<PresetTrigger
v-for="(preset, handle) in presets"
Expand Down
2 changes: 1 addition & 1 deletion resources/js/components/ui/Panel/Panel.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ const props = defineProps({
<template>
<div
:class="[
'@container/panel relative bg-gray-150 [.bg-architectural-lines_&]:backdrop-blur-[10px] dark:bg-gray-950 dark:inset-shadow-2xs dark:inset-shadow-black',
'@container/panel relative bg-gray-150 [.bg-architectural-lines_&]:backdrop-blur-[10px] dark:bg-gray-950/35 dark:inset-shadow-2xs dark:inset-shadow-black',
'w-full rounded-2xl mb-5 max-[600px]:p-1.25 p-1.75 [&:has(>[data-ui-panel-header])]:pt-0 focus-none starting-style-transition starting-style-transition--siblings',
]"
data-ui-panel
Expand Down
2 changes: 1 addition & 1 deletion resources/js/components/ui/Toggle/Item.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ const toggleItemClasses = computed(() => {
'bg-linear-to-b from-primary/90 to-primary hover:bg-primary-hover text-white border border-primary-border shadow-ui-md inset-shadow-2xs inset-shadow-white/25 data-[state=on]:bg-primary-hover',
'dark:from-white dark:to-gray-200 dark:hover:from-gray-200 dark:text-gray-900 dark:border-0 dark:data-[state=on]:from-gray-300 dark:data-[state=on]:to-gray-300',
],
filled: 'bg-gray-100 hover:bg-gray-200 dark:bg-gray-700/80 dark:hover:bg-gray-700 data-[state=on]:bg-gray-300 data-[state=on]:border-gray-500 dark:data-[state=on]:bg-gray-950',
filled: 'bg-gray-100 hover:bg-gray-200 dark:bg-gray-700/80 dark:hover:bg-gray-700 data-[state=on]:bg-gray-300 data-[state=on]:border-gray-500 dark:data-[state=on]:bg-gray-925',
ghost: 'bg-transparent rounded-lg hover:bg-gray-400/10 text-gray-500 hover:text-gray-700 dark:text-gray-300 dark:hover:bg-gray-700/80 dark:hover:text-gray-200 data-[state=on]:bg-gray-400/20 data-[state=on]:text-gray-700 dark:data-[state=on]:bg-gray-700/80 dark:data-[state=on]:text-white',
},
size: {
Expand Down