style(console-web): use canonical Tailwind utilities

Replace the hard-coded brand text color with its theme token and use Tailwind's standard z-index utility for Host notifications.
This commit is contained in:
Maofeng
2026-07-30 15:25:12 +08:00
parent 427abd15f9
commit c9a594d669
+2 -2
View File
@@ -403,7 +403,7 @@ export default function HostApp() {
<div class="grid h-dvh min-w-0 grid-cols-[minmax(0,1fr)] grid-rows-[auto_56px_minmax(0,1fr)_30px] overflow-hidden bg-canvas lg:grid-cols-[232px_minmax(0,1fr)] lg:grid-rows-[64px_minmax(0,1fr)_30px]"> <div class="grid h-dvh min-w-0 grid-cols-[minmax(0,1fr)] grid-rows-[auto_56px_minmax(0,1fr)_30px] overflow-hidden bg-canvas lg:grid-cols-[232px_minmax(0,1fr)] lg:grid-rows-[64px_minmax(0,1fr)_30px]">
<aside class="border-line min-w-0 bg-[#16221f] text-white lg:row-span-3 lg:flex lg:min-h-0 lg:flex-col lg:border-r"> <aside class="border-line min-w-0 bg-[#16221f] text-white lg:row-span-3 lg:flex lg:min-h-0 lg:flex-col lg:border-r">
<div class="flex h-16 shrink-0 items-center gap-3 px-4 lg:px-5"> <div class="flex h-16 shrink-0 items-center gap-3 px-4 lg:px-5">
<span class="flex size-9 items-center justify-center rounded-md bg-[#e5f4ef] text-[#155a46]"> <span class="flex size-9 items-center justify-center rounded-md bg-[#e5f4ef] text-brand-strong">
<Boxes size={19} /> <Boxes size={19} />
</span> </span>
<div> <div>
@@ -533,7 +533,7 @@ export default function HostApp() {
<Show when={toast()}> <Show when={toast()}>
{(message) => ( {(message) => (
<div class="fixed bottom-12 right-5 z-[70] max-w-sm rounded-md bg-[#16221f] px-4 py-3 text-sm text-white shadow-xl"> <div class="fixed bottom-12 right-5 z-70 max-w-sm rounded-md bg-[#16221f] px-4 py-3 text-sm text-white shadow-xl">
{message()} {message()}
</div> </div>
)} )}