update: style

This commit is contained in:
tao.chen
2026-08-28 12:00:14 +08:00
parent e2fd7eba63
commit 9badd3597f
34 changed files with 207 additions and 237 deletions
@@ -41,6 +41,8 @@ import {
statusPillClass,
} from "./adminUi";
import { primaryGradientButtonClass } from "~/components/common/buttonClasses";
const EMPTY_FORM = {
username: "",
display_name: "",
@@ -50,10 +52,8 @@ const EMPTY_FORM = {
status: "active" as "active" | "disabled" | "locked",
};
const PRIMARY_BUTTON_CLASS =
"h-[37px] gap-[7px] rounded-md border border-[#126ac3] bg-gradient-to-br from-[#1881e7] to-[#1268c9] px-[15px] text-xs font-[650] text-white shadow-[0_6px_15px_rgb(20_111_202/18%)] enabled:hover:from-[#1175d8] enabled:hover:to-[#0e5bad]";
const FORM_INPUT_CLASS =
"h-[39px] w-full rounded-md border border-[#d6e0e9] bg-white px-[11px] text-xs text-[#283a4e] outline-none focus:border-[#5b9ddb] focus:shadow-[0_0_0_3px_rgb(38_125_207/8%)] disabled:cursor-not-allowed disabled:opacity-50";
"h-[39px] w-full rounded-md border border-[#d6e0e9] bg-white px-[11px] text-xs text-[#283a4e] outline-none focus:border-[#5b9ddb] focus:ring-3 focus:ring-brand/10 disabled:cursor-not-allowed disabled:opacity-50";
export function UserManagementPage({
onNotify,
onConnectionChange,
@@ -216,7 +216,7 @@ export function UserManagementPage({
type="button"
disabled={!canManage}
onClick={openCreate}
className={PRIMARY_BUTTON_CLASS}
className={primaryGradientButtonClass}
>
<Plus size={15} />
@@ -224,15 +224,15 @@ export function UserManagementPage({
</div>
{!canManage && <div className={adminReadonlyClass}></div>}
<Table className="rounded-[9px] border border-[#dfe7ef] overflow-hidden text-[11px] text-[#44576a] [--border-color:#dfe7ef] table-fixed bg-white">
<Table className="rounded-[9px] border border-line overflow-hidden text-[11px] text-[#44576a] [--border-color:var(--color-line)] table-fixed bg-white">
<AdminColgroup widths={USER_PROJECT_COL_WIDTHS} />
<TableHeader className="bg-[#f5f8fb] text-[#748598]">
<TableHeader className="bg-[#f5f8fb] text-ink-caption">
<TableRow className="hover:bg-transparent border-b border-[#edf1f5]">
<TableHead className="h-10 px-4 text-[10px] font-bold text-[#748598]"></TableHead>
<TableHead className="h-10 px-4 text-[10px] font-bold text-[#748598]"></TableHead>
<TableHead className="h-10 px-4 text-[10px] font-bold text-[#748598]"></TableHead>
<TableHead className="h-10 px-4 text-[10px] font-bold text-[#748598]"></TableHead>
<TableHead className="h-10 px-4 text-[10px] font-bold text-[#748598]"></TableHead>
<TableHead className="h-10 px-4 text-[10px] font-bold text-ink-caption"></TableHead>
<TableHead className="h-10 px-4 text-[10px] font-bold text-ink-caption"></TableHead>
<TableHead className="h-10 px-4 text-[10px] font-bold text-ink-caption"></TableHead>
<TableHead className="h-10 px-4 text-[10px] font-bold text-ink-caption"></TableHead>
<TableHead className="h-10 px-4 text-[10px] font-bold text-ink-caption"></TableHead>
</TableRow>
</TableHeader>
<TableBody>
@@ -301,7 +301,7 @@ export function UserManagementPage({
>
<form className={modalFormClass} onSubmit={(event) => void submit(event)}>
<label className={formFieldClass}>
<span><span className="text-[#e74c3c]">*</span></span>
<span><span className="text-danger">*</span></span>
<Input
className={FORM_INPUT_CLASS}
autoFocus={!editing}
@@ -311,7 +311,7 @@ export function UserManagementPage({
/>
</label>
<label className={formFieldClass}>
<span><span className="text-[#e74c3c]">*</span></span>
<span><span className="text-danger">*</span></span>
<Input
className={FORM_INPUT_CLASS}
disabled={Boolean(editing)}
@@ -323,7 +323,7 @@ export function UserManagementPage({
</label>
{!editing && (
<label className={formFieldClass}>
<span><span className="text-[#e74c3c]">*</span></span>
<span><span className="text-danger">*</span></span>
<Input
className={FORM_INPUT_CLASS}
type="password"
@@ -381,7 +381,7 @@ export function UserManagementPage({
</select>
</label>
)}
<div className="mt-[3px] flex shrink-0 justify-end gap-2 border-t border-[#e8edf2] bg-white -mx-[22px] px-[22px] py-3.5">
<div className="mt-[3px] flex shrink-0 justify-end gap-2 border-t border-line bg-white -mx-[22px] px-[22px] py-3.5">
<Button
variant="outline"
size="sm"