gov-layout 1.2.10 → 1.2.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -72,7 +72,7 @@ function SidebarHeader({ orgLogo, orgName, orgSubtitle, collapsed }) {
72
72
  fontWeight: 700,
73
73
  fontSize: "16px",
74
74
  lineHeight: "22px",
75
- color: isDark ? "#f1f5f9" : "var(--color-alias-color-brand-text-dark, #05010e)",
75
+ color: isDark ? "#ffffff" : "var(--color-alias-color-brand-text-dark, #05010e)",
76
76
  margin: 0,
77
77
  overflow: "hidden",
78
78
  textOverflow: "ellipsis",
@@ -81,7 +81,7 @@ function SidebarHeader({ orgLogo, orgName, orgSubtitle, collapsed }) {
81
81
  orgSubtitle && /* @__PURE__ */ jsx("p", { style: {
82
82
  fontSize: "14px",
83
83
  lineHeight: "20px",
84
- color: isDark ? "#94a3b8" : "var(--color-alias-text-colors-tertiary, #475272)",
84
+ color: isDark ? "#e2e8f0" : "var(--color-alias-text-colors-tertiary, #475272)",
85
85
  margin: 0,
86
86
  overflow: "hidden",
87
87
  textOverflow: "ellipsis",
@@ -477,7 +477,7 @@ function MenuItemComponent({
477
477
  borderRadius: "8px",
478
478
  border: "none",
479
479
  background: isActive || isChildActive ? `color-mix(in srgb, ${activeColor} 10%, transparent)` : "transparent",
480
- color: isActive || isChildActive ? activeColor : isDark ? "#f1f5f9" : "var(--color-alias-text-colors-tertiary, #475272)",
480
+ color: isActive || isChildActive ? activeColor : isDark ? "#ffffff" : "var(--color-alias-text-colors-tertiary, #475272)",
481
481
  cursor: "pointer",
482
482
  transition: "background-color 0.15s ease"
483
483
  },
@@ -517,7 +517,7 @@ function MenuItemComponent({
517
517
  borderRadius: "8px",
518
518
  border: "none",
519
519
  background: isActive ? `color-mix(in srgb, ${activeColor} 10%, transparent)` : "transparent",
520
- color: isActive ? activeColor : isDark ? "#f1f5f9" : "var(--color-alias-text-colors-primary, #060d26)",
520
+ color: isActive ? activeColor : isDark ? "#ffffff" : "var(--color-alias-text-colors-primary, #060d26)",
521
521
  cursor: "pointer",
522
522
  transition: "background-color 0.15s ease",
523
523
  textAlign: "left",
@@ -533,7 +533,7 @@ function MenuItemComponent({
533
533
  alignItems: "center",
534
534
  justifyContent: "center",
535
535
  flexShrink: 0,
536
- color: isActive ? activeColor : isDark ? "#94a3b8" : "var(--color-alias-text-colors-tertiary, #475272)"
536
+ color: isActive ? activeColor : isDark ? "#e2e8f0" : "var(--color-alias-text-colors-tertiary, #475272)"
537
537
  }, children: resolvedIcon }),
538
538
  /* @__PURE__ */ jsx("span", { style: { flex: 1 }, children: item.title }),
539
539
  hasChildren && /* @__PURE__ */ jsx(ChevronDownIcon, { isOpen: expanded })
@@ -808,7 +808,7 @@ function SidebarUserProfile({
808
808
  fontWeight: 600,
809
809
  fontSize: "14px",
810
810
  lineHeight: "20px",
811
- color: isDark ? "#f1f5f9" : "var(--color-alias-text-colors-primary, #060d26)",
811
+ color: isDark ? "#ffffff" : "var(--color-alias-text-colors-primary, #060d26)",
812
812
  margin: 0,
813
813
  overflow: "hidden",
814
814
  textOverflow: "ellipsis",
@@ -817,7 +817,7 @@ function SidebarUserProfile({
817
817
  /* @__PURE__ */ jsx("p", { style: {
818
818
  fontSize: "12px",
819
819
  lineHeight: "16px",
820
- color: isDark ? "#94a3b8" : "var(--color-alias-text-colors-tertiary, #475272)",
820
+ color: isDark ? "#e2e8f0" : "var(--color-alias-text-colors-tertiary, #475272)",
821
821
  margin: 0
822
822
  }, children: roleLabel })
823
823
  ] })
@@ -985,7 +985,7 @@ function StaffSidebar({
985
985
  zIndex: 40,
986
986
  overflow: "hidden",
987
987
  transition: "width 0.3s ease",
988
- color: isDark ? "#f1f5f9" : void 0
988
+ color: isDark ? "#ffffff" : void 0
989
989
  },
990
990
  children: [
991
991
  /* @__PURE__ */ jsx(
@@ -1067,7 +1067,7 @@ function StaffSidebar({
1067
1067
  justifyContent: "center",
1068
1068
  boxShadow: isDark ? "2px 0 8px rgba(0,0,0,0.3)" : "2px 0 8px rgba(0,0,0,0.06)",
1069
1069
  transition: "left 0.3s ease",
1070
- color: isDark ? "#f1f5f9" : "var(--color-alias-text-colors-tertiary, #475272)"
1070
+ color: isDark ? "#ffffff" : "var(--color-alias-text-colors-tertiary, #475272)"
1071
1071
  },
1072
1072
  children: /* @__PURE__ */ jsx(ToggleIcon, { isOpen: sidebarOpen })
1073
1073
  }
@@ -1142,12 +1142,12 @@ function UserHeader({
1142
1142
  {
1143
1143
  className,
1144
1144
  style: {
1145
- background: isDark ? "#1e293b" : "#fff",
1146
- boxShadow: isDark ? "0 1px 3px rgba(0,0,0,0.3)" : "0 1px 3px rgba(0,0,0,0.08)",
1145
+ background: "linear-gradient(135deg, #2e7d32, #388e3c)",
1146
+ boxShadow: "0 2px 8px rgba(0,0,0,0.15)",
1147
1147
  position: "sticky",
1148
1148
  top: 0,
1149
1149
  zIndex: 10,
1150
- color: isDark ? "#f1f5f9" : void 0
1150
+ color: "#ffffff"
1151
1151
  },
1152
1152
  children: /* @__PURE__ */ jsxs(
1153
1153
  "div",
@@ -1164,7 +1164,7 @@ function UserHeader({
1164
1164
  {
1165
1165
  onClick: onProfile,
1166
1166
  onMouseEnter: (e) => {
1167
- if (onProfile) e.currentTarget.style.backgroundColor = isDark ? "#334155" : "var(--color-alias-color-brand-surface, #f0fdf4)";
1167
+ if (onProfile) e.currentTarget.style.backgroundColor = "rgba(255,255,255,0.12)";
1168
1168
  },
1169
1169
  onMouseLeave: (e) => {
1170
1170
  if (onProfile) e.currentTarget.style.backgroundColor = "transparent";
@@ -1189,7 +1189,7 @@ function UserHeader({
1189
1189
  height: "44px",
1190
1190
  borderRadius: "50%",
1191
1191
  objectFit: "cover",
1192
- border: "2px solid var(--color-alias-color-brand-surface, #faf9e5)"
1192
+ border: "2px solid rgba(255,255,255,0.7)"
1193
1193
  }
1194
1194
  }
1195
1195
  ) : /* @__PURE__ */ jsx(
@@ -1199,7 +1199,8 @@ function UserHeader({
1199
1199
  width: "44px",
1200
1200
  height: "44px",
1201
1201
  borderRadius: "50%",
1202
- background: "linear-gradient(135deg, var(--color-alias-color-brand-secondary, #80d897), var(--color-alias-color-brand-primary, #1e7d55))",
1202
+ background: "rgba(255,255,255,0.2)",
1203
+ border: "2px solid rgba(255,255,255,0.7)",
1203
1204
  display: "flex",
1204
1205
  alignItems: "center",
1205
1206
  justifyContent: "center",
@@ -1218,9 +1219,9 @@ function UserHeader({
1218
1219
  "p",
1219
1220
  {
1220
1221
  style: {
1221
- fontSize: "14px",
1222
+ fontSize: "15px",
1222
1223
  fontWeight: 600,
1223
- color: isDark ? "#f1f5f9" : "var(--color-alias-color-brand-text-dark, #05010e)",
1224
+ color: "#ffffff",
1224
1225
  margin: 0
1225
1226
  },
1226
1227
  children: [
@@ -1230,7 +1231,7 @@ function UserHeader({
1230
1231
  "span",
1231
1232
  {
1232
1233
  style: {
1233
- color: isDark ? "#8be9a0" : "var(--color-alias-color-brand-primary, #1e7d55)"
1234
+ color: "#ffffff"
1234
1235
  },
1235
1236
  children: displayName
1236
1237
  }
@@ -1247,6 +1248,12 @@ function UserHeader({
1247
1248
  "button",
1248
1249
  {
1249
1250
  onClick: () => setIsNotifOpen(!isNotifOpen),
1251
+ onMouseEnter: (e) => {
1252
+ e.currentTarget.style.backgroundColor = "rgba(255,255,255,0.15)";
1253
+ },
1254
+ onMouseLeave: (e) => {
1255
+ e.currentTarget.style.backgroundColor = "transparent";
1256
+ },
1250
1257
  style: {
1251
1258
  padding: "10px",
1252
1259
  borderRadius: "8px",
@@ -1256,7 +1263,9 @@ function UserHeader({
1256
1263
  position: "relative",
1257
1264
  display: "flex",
1258
1265
  alignItems: "center",
1259
- justifyContent: "center"
1266
+ justifyContent: "center",
1267
+ color: "#ffffff",
1268
+ transition: "background-color 0.15s ease"
1260
1269
  },
1261
1270
  children: [
1262
1271
  /* @__PURE__ */ jsx(BellIcon2, {}),
@@ -1314,7 +1323,7 @@ function UserHeader({
1314
1323
  background: isDark ? "#1f2937" : "#fafafa"
1315
1324
  },
1316
1325
  children: [
1317
- /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, fontSize: "14px", color: isDark ? "#f1f5f9" : "#111" }, children: "\u0E01\u0E32\u0E23\u0E41\u0E08\u0E49\u0E07\u0E40\u0E15\u0E37\u0E2D\u0E19" }),
1326
+ /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, fontSize: "14px", color: isDark ? "#ffffff" : "#111" }, children: "\u0E01\u0E32\u0E23\u0E41\u0E08\u0E49\u0E07\u0E40\u0E15\u0E37\u0E2D\u0E19" }),
1318
1327
  onMarkAllRead && /* @__PURE__ */ jsx(
1319
1328
  "button",
1320
1329
  {
@@ -1403,7 +1412,7 @@ function UserHeader({
1403
1412
  style: {
1404
1413
  fontSize: "13px",
1405
1414
  fontWeight: !item.isRead ? 600 : 500,
1406
- color: isDark ? "#f1f5f9" : "#111",
1415
+ color: isDark ? "#ffffff" : "#111",
1407
1416
  margin: "0 0 2px"
1408
1417
  },
1409
1418
  children: item.title
@@ -1482,10 +1491,12 @@ function UserHeader({
1482
1491
  cursor: "pointer",
1483
1492
  display: "flex",
1484
1493
  alignItems: "center",
1485
- justifyContent: "center"
1494
+ justifyContent: "center",
1495
+ color: "#ffffff",
1496
+ transition: "background-color 0.15s ease"
1486
1497
  },
1487
1498
  onMouseEnter: (e) => {
1488
- e.currentTarget.style.backgroundColor = isDark ? "#374151" : "#f3f4f6";
1499
+ e.currentTarget.style.backgroundColor = "rgba(255,255,255,0.15)";
1489
1500
  },
1490
1501
  onMouseLeave: (e) => {
1491
1502
  e.currentTarget.style.backgroundColor = "transparent";
@@ -1583,7 +1594,7 @@ function UserSidebar({
1583
1594
  transition: "transform 0.3s ease",
1584
1595
  display: "flex",
1585
1596
  flexDirection: "column",
1586
- color: isDark ? "#f1f5f9" : void 0
1597
+ color: isDark ? "#ffffff" : void 0
1587
1598
  },
1588
1599
  children: [
1589
1600
  user && /* @__PURE__ */ jsx(
@@ -1642,7 +1653,7 @@ function UserSidebar({
1642
1653
  style: {
1643
1654
  fontWeight: 700,
1644
1655
  fontSize: "16px",
1645
- color: isDark ? "#f1f5f9" : "var(--color-alias-text-colors-primary, #060d26)",
1656
+ color: isDark ? "#ffffff" : "var(--color-alias-text-colors-primary, #060d26)",
1646
1657
  margin: 0,
1647
1658
  overflow: "hidden",
1648
1659
  textOverflow: "ellipsis",
@@ -1656,7 +1667,7 @@ function UserSidebar({
1656
1667
  {
1657
1668
  style: {
1658
1669
  fontSize: "13px",
1659
- color: isDark ? "#94a3b8" : "var(--color-alias-text-colors-tertiary, #6b7280)",
1670
+ color: isDark ? "#e2e8f0" : "var(--color-alias-text-colors-tertiary, #6b7280)",
1660
1671
  margin: "2px 0 0",
1661
1672
  display: "flex",
1662
1673
  alignItems: "center",