chore: drop redundant background repaints so surfaces inherit their parent (#27576)
* chore: drop redundant background repaints so surfaces inherit their parent Four spots repaint the exact color their parent surface already provides (bg-white / dark:bg-gray-900 rows inside same-colored pages and modals, and the selectClass dark repaint inside the connection modals — the sibling input const is already fully transparent). Visually identical in stock light and dark; removing them lets instance theming show through instead of leaving opaque boxes: - .tiptap tr (app.css) — table rows in notes/editors - Edit User Group Users tab body rows (common Modal surface) - AddToolServerModal + AddTerminalServerModal selectClass dark repaint The matching repaints inside the ModelUsage/UserUsage components are not part of this change — those files were dead code and were removed entirely in #27574. * chore: catch remaining redundant surface repaints missed in the first pass Same rule as the previous commit — every one of these repaints the exact color its parent surface already provides, so removal is stock-identical in light and dark while letting instance theming show through: - Analytics Dashboard's inline Model Usage / User Activity row markup (the Analytics tab renders these tables from Dashboard.svelte itself; the unreferenced ModelUsage/UserUsage component files were removed in #27574) - Evaluations Feedbacks + Leaderboard body rows (settings modal surface) - admin UserList body rows (app page surface) - chat markdown tables (MarkdownTokens): thead and body rows — unlike the tiptap header (gray-850 contrast, untouched), this thead painted the page's own color - CitationsModal source rows (common Modal surface) - AddConnectionModal selectClass dark repaint — third copy of the same const already fixed in AddToolServerModal / AddTerminalServerModal
This commit is contained in:
11 files changed
+13
-15
No files matched your search
+1
-1
@@ -685,7 +685,7 @@ html.high-contrast.dark .ProseMirror p.is-editor-empty:first-child::before {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.tiptap tr {
|
.tiptap tr {
|
||||||
@apply bg-white dark:bg-gray-900 dark:border-gray-850 text-xs;
|
@apply dark:border-gray-850 text-xs;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tippy-box[data-theme~='transparent'] {
|
.tippy-box[data-theme~='transparent'] {
|
||||||
|
|||||||
@@ -63,7 +63,7 @@
|
|||||||
const inputClass =
|
const inputClass =
|
||||||
'bg-transparent outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
'bg-transparent outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
||||||
const selectClass =
|
const selectClass =
|
||||||
'dark:bg-gray-900 bg-transparent pr-5 outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
'bg-transparent pr-5 outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
||||||
|
|
||||||
const parsePassthroughParams = (value: string) =>
|
const parsePassthroughParams = (value: string) =>
|
||||||
value
|
value
|
||||||
|
|||||||
@@ -62,7 +62,7 @@
|
|||||||
const inputClass =
|
const inputClass =
|
||||||
'bg-transparent outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
'bg-transparent outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
||||||
const selectClass =
|
const selectClass =
|
||||||
'dark:bg-gray-900 bg-transparent pr-5 outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
'bg-transparent pr-5 outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
||||||
|
|
||||||
const stringifyJson = (value: object | null | undefined) => {
|
const stringifyJson = (value: object | null | undefined) => {
|
||||||
return JSON.stringify(value && Object.keys(value).length ? value : {}, null, 2);
|
return JSON.stringify(value && Object.keys(value).length ? value : {}, null, 2);
|
||||||
|
|||||||
@@ -72,7 +72,7 @@
|
|||||||
const inputClass =
|
const inputClass =
|
||||||
'bg-transparent outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
'bg-transparent outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
||||||
const selectClass =
|
const selectClass =
|
||||||
'dark:bg-gray-900 bg-transparent pr-5 outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
'bg-transparent pr-5 outline-hidden placeholder:text-gray-300 dark:placeholder:text-gray-700';
|
||||||
|
|
||||||
const registerOAuthClientHandler = async () => {
|
const registerOAuthClientHandler = async () => {
|
||||||
if (url === '') {
|
if (url === '') {
|
||||||
|
|||||||
@@ -468,7 +468,7 @@
|
|||||||
<tbody>
|
<tbody>
|
||||||
{#each sortedModels as model, idx (model.model_id)}
|
{#each sortedModels as model, idx (model.model_id)}
|
||||||
<tr
|
<tr
|
||||||
class="bg-white dark:bg-gray-900 dark:border-gray-850 text-xs cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors"
|
class="dark:border-gray-850 text-xs cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors"
|
||||||
on:click={() => {
|
on:click={() => {
|
||||||
selectedModel = { id: model.model_id, name: model.name };
|
selectedModel = { id: model.model_id, name: model.name };
|
||||||
showModelModal = true;
|
showModelModal = true;
|
||||||
@@ -581,7 +581,7 @@
|
|||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{#each sortedUsers as user, idx (user.user_id)}
|
{#each sortedUsers as user, idx (user.user_id)}
|
||||||
<tr class="bg-white dark:bg-gray-900 dark:border-gray-850 text-xs">
|
<tr class="dark:border-gray-850 text-xs">
|
||||||
<td class="px-3 py-1 text-gray-400">{idx + 1}</td>
|
<td class="px-3 py-1 text-gray-400">{idx + 1}</td>
|
||||||
<td class="px-3 py-1 font-normal text-gray-900 dark:text-white">
|
<td class="px-3 py-1 font-normal text-gray-900 dark:text-white">
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
|
|||||||
@@ -418,7 +418,7 @@
|
|||||||
<tbody class="">
|
<tbody class="">
|
||||||
{#each items as feedback (feedback.id)}
|
{#each items as feedback (feedback.id)}
|
||||||
<tr
|
<tr
|
||||||
class="bg-white dark:bg-gray-900 dark:border-gray-850 text-xs cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-850/50 transition rounded-xl"
|
class="dark:border-gray-850 text-xs cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-850/50 transition rounded-xl"
|
||||||
on:click={() => openFeedbackModal(feedback)}
|
on:click={() => openFeedbackModal(feedback)}
|
||||||
>
|
>
|
||||||
<td class=" py-0.5 text-right font-normal">
|
<td class=" py-0.5 text-right font-normal">
|
||||||
|
|||||||
@@ -201,7 +201,7 @@
|
|||||||
<tbody>
|
<tbody>
|
||||||
{#each sortedModels as model, idx (model.id)}
|
{#each sortedModels as model, idx (model.id)}
|
||||||
<tr
|
<tr
|
||||||
class="bg-white dark:bg-gray-900 text-xs group cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-850/50 transition"
|
class="text-xs group cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-850/50 transition"
|
||||||
on:click={() => openModal(model)}
|
on:click={() => openModal(model)}
|
||||||
>
|
>
|
||||||
<td class="px-3 py-1.5 font-normal text-gray-900 dark:text-white">
|
<td class="px-3 py-1.5 font-normal text-gray-900 dark:text-white">
|
||||||
|
|||||||
@@ -234,7 +234,7 @@
|
|||||||
</thead>
|
</thead>
|
||||||
<tbody class="">
|
<tbody class="">
|
||||||
{#each users as user, userIdx (user?.id ?? userIdx)}
|
{#each users as user, userIdx (user?.id ?? userIdx)}
|
||||||
<tr class="bg-white dark:bg-gray-900 dark:border-gray-850 text-xs">
|
<tr class="dark:border-gray-850 text-xs">
|
||||||
<td class=" px-3 py-1 w-8">
|
<td class=" px-3 py-1 w-8">
|
||||||
<div class="flex w-full justify-center">
|
<div class="flex w-full justify-center">
|
||||||
<Checkbox
|
<Checkbox
|
||||||
|
|||||||
@@ -346,7 +346,7 @@
|
|||||||
</thead>
|
</thead>
|
||||||
<tbody class="">
|
<tbody class="">
|
||||||
{#each users as user (user.id)}
|
{#each users as user (user.id)}
|
||||||
<tr class="bg-white dark:bg-gray-900 dark:border-gray-850 text-xs">
|
<tr class="dark:border-gray-850 text-xs">
|
||||||
<td class="px-3 py-1 font-normal text-gray-900 dark:text-white max-w-48">
|
<td class="px-3 py-1 font-normal text-gray-900 dark:text-white max-w-48">
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
<ProfilePreview {user} side="right" align="center" sideOffset={6}>
|
<ProfilePreview {user} side="right" align="center" sideOffset={6}>
|
||||||
|
|||||||
@@ -60,7 +60,7 @@
|
|||||||
{#each citations as citation, idx}
|
{#each citations as citation, idx}
|
||||||
<button
|
<button
|
||||||
id={`source-${id}-${idx + 1}`}
|
id={`source-${id}-${idx + 1}`}
|
||||||
class="no-toggle outline-hidden flex dark:text-gray-300 bg-white dark:bg-gray-900 rounded-xl gap-1.5 items-center"
|
class="no-toggle outline-hidden flex dark:text-gray-300 rounded-xl gap-1.5 items-center"
|
||||||
on:click={() => {
|
on:click={() => {
|
||||||
showCitationModal = true;
|
showCitationModal = true;
|
||||||
selectedCitation = citation;
|
selectedCitation = citation;
|
||||||
|
|||||||
@@ -193,9 +193,7 @@
|
|||||||
class=" w-full text-sm text-start text-gray-500 dark:text-gray-400 max-w-full rounded-xl"
|
class=" w-full text-sm text-start text-gray-500 dark:text-gray-400 max-w-full rounded-xl"
|
||||||
dir="auto"
|
dir="auto"
|
||||||
>
|
>
|
||||||
<thead
|
<thead class="text-xs text-gray-700 uppercase dark:text-gray-400 border-none">
|
||||||
class="text-xs text-gray-700 uppercase bg-white dark:bg-gray-900 dark:text-gray-400 border-none"
|
|
||||||
>
|
|
||||||
<tr class="">
|
<tr class="">
|
||||||
{#each token.header as header, headerIdx}
|
{#each token.header as header, headerIdx}
|
||||||
<th
|
<th
|
||||||
@@ -220,7 +218,7 @@
|
|||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{#each token.rows as row, rowIdx}
|
{#each token.rows as row, rowIdx}
|
||||||
<tr class="bg-white dark:bg-gray-900 text-xs">
|
<tr class="text-xs">
|
||||||
{#each row ?? [] as cell, cellIdx}
|
{#each row ?? [] as cell, cellIdx}
|
||||||
<td
|
<td
|
||||||
class="px-3! py-2! text-gray-900 dark:text-white w-max {token.rows.length -
|
class="px-3! py-2! text-gray-900 dark:text-white w-max {token.rows.length -
|
||||||
|
|||||||
Reference in new issue
Block a user