Tria/edr-platform
1
0
Fork 0
mirror of https://github.com/Tria-plc/edr-platform.git synced 2026-08-26 18:42:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix ui

Browse Source
This commit is contained in:
natib21
2026-07-14 07:45:33 +00:00
parent 0396b6474f
commit bf9520ece4
7 changed files with 22 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
apps/edr-freight-web/backoffice/index.css
View File

@@ -41,11 +41,12 @@
--color-primary-950: #022c22;
}
/* Main brand color for the vendored IAM UI (user-management). The shadcn
`primary` token drives bg-primary / text-primary / border-primary (1600+
usages there). Un-layered, so it wins over the layer(theme) defaults from
@edr/ui-common (light: oklch green, dark: #0d5c2c). Same value in both
modes so the brand doesn't shift when toggling. */
/* Main brand color. NOTE: at runtime TenantConfig.applyTenantTheme() sets
--primary (and --ring/--accent/…) as INLINE styles on <html> from the
per-hostname tenant config, which beats any stylesheet — change the color
there (localhost → #0EA371). This block is the pre-mount fallback and fixes
--primary-foreground (the layered dark default is dark-on-dark). Same value
in both modes so the brand doesn't shift when toggling. */
:root,
.dark {
--primary: #0EA371;

11
apps/edr-freight-web/backoffice/src/layout/components/TenantConfig.ts
View File

@@ -119,7 +119,7 @@ const tenantConfigs: Record<string, TenantConfig> = {
appName: "Smart Office",
organizationName: "Addis Ababa City Administration",
logo: "",
primaryColor: "#115005",
primaryColor: "#0EA371",
moduleConfig: {
dms: true,
performance: true,
@@ -543,7 +543,14 @@ export const applyTenantTheme = (config: TenantConfig) => {
root.style.setProperty("--primary", primary);
root.style.setProperty("--ring", primary);
root.style.setProperty("--sidebar-primary", primary);
root.style.setProperty("--accent", primary);
// Accent is a subtle hover/highlight background (dropdown items, menus) that
// must stay readable under --accent-foreground text in BOTH color schemes.
// Full-strength brand color here produced dark-pill-with-dark-text hovers,
// so use a translucent tint of the brand color instead.
root.style.setProperty(
"--accent",
`color-mix(in oklab, ${primary} 15%, transparent)`,
);
root.style.setProperty("--chart-1", primary);
if (config.organizationName) {

2
apps/edr-freight-web/backoffice/src/pages/DashboardPage.tsx
View File

@@ -140,7 +140,7 @@ const DashboardPage = () => {
<Link to="/organizations">
<Button
variant="link"
className="text-purple-600 dark:text-purple-400 text-sm px-0">
className="text-primary dark:text-primary-400 text-sm px-0">
{t("organization.viewMore")}
</Button>
</Link>

6
apps/edr-freight-web/backoffice/src/super-admin/components/dashboard/components/ActivityTimeline.tsx
View File

@@ -17,11 +17,11 @@ export const ActivityTimeline = ({ activities }: ActivityTimelineProps) => {
return (
<div className="relative pl-6">
<div className="absolute left-2 top-2 bottom-2 w-0.5 bg-purple-500" />
<div className="absolute left-2 top-2 bottom-2 w-0.5 bg-primary" />
<ul className="space-y-6">
{activities.map((activity) => (
<li key={activity.id} className="relative pl-4">
<div className="absolute left-0 top-1 w-3 h-3 bg-purple-500 rounded-full" />
<div className="absolute left-0 top-1 w-3 h-3 bg-primary rounded-full" />
<div className="text-xs text-muted-foreground">
{formatDistanceToNow(new Date(activity.timestamp), {
addSuffix: true,
@@ -32,7 +32,7 @@ export const ActivityTimeline = ({ activities }: ActivityTimelineProps) => {
</div>
<div className="text-xs">
By{" "}
<span className="font-medium text-purple-600">
<span className="font-medium text-primary">
{activity.user}
</span>
</div>

2
apps/edr-freight-web/backoffice/src/super-admin/components/dashboard/components/HeaderBar.tsx
View File

@@ -7,7 +7,7 @@ export const HeaderBar = () => {
<h1 className="text-2xl font-bold text-gray-800 dark:text-gray-100">
{tenantConfig.appName} Dashboard
</h1>
<button className="bg-purple-600 hover:bg-purple-700 text-white px-4 py-2 rounded-md text-sm">
<button className="bg-primary hover:bg-primary-700 text-white px-4 py-2 rounded-md text-sm">
+ Add Organization
</button>
</div>

2
apps/edr-freight-web/backoffice/src/super-admin/components/dashboard/components/OrgTable.tsx
View File

@@ -38,7 +38,7 @@ export const OrgTable = ({ organizations }: OrgTableProps) => {
{organizations.map((org, index) => (
<TableRow
key={org.id}
className={index % 2 ? "bg-purple-50/20 dark:bg-gray-700/40" : "bg-white dark:bg-gray-800"}
className={index % 2 ? "bg-primary-50/20 dark:bg-gray-700/40" : "bg-white dark:bg-gray-800"}
>
<TableCell className="px-6 py-3 font-medium">
{org.name?.en || "N/A"}

2
apps/edr-freight-web/backoffice/src/super-admin/components/dashboard/components/StatCard.tsx
View File

@@ -34,7 +34,7 @@ export const StatCard: React.FC<StatCardProps> = ({
onClick={onClick}
className={cn(
"p-4 rounded-xl shadow-sm transition-colors",
variant === "primary" ? "bg-purple-600 text-white" : "bg-white dark:bg-gray-800 dark:border-gray-700",
variant === "primary" ? "bg-primary text-white" : "bg-white dark:bg-gray-800 dark:border-gray-700",
onClick && "cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-700"
)}
>