Tria/edr-platform
1
0
Fork 0
mirror of https://github.com/Tria-plc/edr-platform.git synced 2026-09-07 21:15:41 +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; --color-primary-950: #022c22;
} }
/* Main brand color for the vendored IAM UI (user-management). The shadcn /* Main brand color. NOTE: at runtime TenantConfig.applyTenantTheme() sets
`primary` token drives bg-primary / text-primary / border-primary (1600+ --primary (and --ring/--accent/…) as INLINE styles on <html> from the
usages there). Un-layered, so it wins over the layer(theme) defaults from per-hostname tenant config, which beats any stylesheet — change the color
@edr/ui-common (light: oklch green, dark: #0d5c2c). Same value in both there (localhost → #0EA371). This block is the pre-mount fallback and fixes
modes so the brand doesn't shift when toggling. */ --primary-foreground (the layered dark default is dark-on-dark). Same value
in both modes so the brand doesn't shift when toggling. */
:root, :root,
.dark { .dark {
--primary: #0EA371; --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", appName: "Smart Office",
organizationName: "Addis Ababa City Administration", organizationName: "Addis Ababa City Administration",
logo: "", logo: "",
primaryColor: "#115005", primaryColor: "#0EA371",
moduleConfig: { moduleConfig: {
dms: true, dms: true,
performance: true, performance: true,
@@ -543,7 +543,14 @@ export const applyTenantTheme = (config: TenantConfig) => {
root.style.setProperty("--primary", primary); root.style.setProperty("--primary", primary);
root.style.setProperty("--ring", primary); root.style.setProperty("--ring", primary);
root.style.setProperty("--sidebar-primary", 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); root.style.setProperty("--chart-1", primary);
if (config.organizationName) { if (config.organizationName) {

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

@@ -140,7 +140,7 @@ const DashboardPage = () => {
<Link to="/organizations"> <Link to="/organizations">
<Button <Button
variant="link" 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")} {t("organization.viewMore")}
</Button> </Button>
</Link> </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 ( return (
<div className="relative pl-6"> <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"> <ul className="space-y-6">
{activities.map((activity) => ( {activities.map((activity) => (
<li key={activity.id} className="relative pl-4"> <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"> <div className="text-xs text-muted-foreground">
{formatDistanceToNow(new Date(activity.timestamp), { {formatDistanceToNow(new Date(activity.timestamp), {
addSuffix: true, addSuffix: true,
@@ -32,7 +32,7 @@ export const ActivityTimeline = ({ activities }: ActivityTimelineProps) => {
</div> </div>
<div className="text-xs"> <div className="text-xs">
By{" "} By{" "}
<span className="font-medium text-purple-600"> <span className="font-medium text-primary">
{activity.user} {activity.user}
</span> </span>
</div> </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"> <h1 className="text-2xl font-bold text-gray-800 dark:text-gray-100">
{tenantConfig.appName} Dashboard {tenantConfig.appName} Dashboard
</h1> </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 + Add Organization
</button> </button>
</div> </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) => ( {organizations.map((org, index) => (
<TableRow <TableRow
key={org.id} 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"> <TableCell className="px-6 py-3 font-medium">
{org.name?.en || "N/A"} {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} onClick={onClick}
className={cn( className={cn(
"p-4 rounded-xl shadow-sm transition-colors", "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" onClick && "cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-700"
)} )}
> >