salman/igny8
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Styles styels styles

Browse Source
This commit is contained in:
IGNY8 VPS (Salman)
2026-01-01 18:12:51 +00:00
parent e96069775c
commit c880e24fc0
22 changed files with 314 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
frontend/src/styles/design-system.css
View File

@@ -9,10 +9,14 @@
these tokens. See DESIGN_SYSTEM.md for usage guidelines.
⚠️ ONLY 6 HEX VALUES IN ENTIRE SYSTEM - Everything else derived!
⚠️ TAILWIND DEFAULT COLORS ARE DISABLED - THEY WON'T WORK!
⚠️ AI AGENTS: DO NOT USE blue-500, red-500, green-500, etc.
⚠️ USE ONLY: brand-*, success-*, warning-*, error-*, purple-*, gray-*
Last Updated: 2026-01-01
=================================================================== */
/* Tailwind with ALL default colors DISABLED */
@import "tailwindcss";
@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap") layer(base);
@@ -26,7 +30,7 @@
:root {
/* ===== THE ONLY 6 HEX VALUES IN THE ENTIRE SYSTEM ===== */
--color-primary: #2C7AA1; /* Brand Blue - main CTA, links, primary actions */
--color-primary: #0077B6; /* Brand Blue - main CTA, links, primary actions */
--color-success: #2CA18E; /* Success Green - confirmations, positive states */
--color-warning: #D9A12C; /* Warning Amber - alerts, cautions */
--color-danger: #A12C40; /* Danger Red - errors, destructive actions */
@@ -82,13 +86,13 @@
/* ===================================================================
BORDER RADIUS
=================================================================== */
--radius-xs: 4px;
--radius-sm: 6px;
--radius-base: 8px;
--radius-md: 10px;
--radius-lg: 12px;
--radius-xl: 16px;
--radius-2xl: 20px;
--radius-xs: 2px;
--radius-sm: 4px;
--radius-base: 6px;
--radius-md: 6px;
--radius-lg: 8px;
--radius-xl: 10px;
--radius-2xl: 12px;
--radius-full: 9999px;
/* ===================================================================
@@ -182,6 +186,18 @@
--color-neutral-*: initial;
--color-stone-*: initial;
/* -----------------------------------------------------------------
BORDER RADIUS (Override Tailwind defaults)
----------------------------------------------------------------- */
--radius-xs: 2px;
--radius-sm: 4px;
--radius-md: 6px;
--radius-lg: 8px;
--radius-xl: 10px;
--radius-2xl: 12px;
--radius-3xl: 16px;
--radius-4xl: 20px;
/* -----------------------------------------------------------------
FONTS
----------------------------------------------------------------- */
@@ -481,18 +497,23 @@
SECTION 7: TABLE STYLES
=================================================================== */
/* Global Table Font Size */
.igny8-table-compact th,
.igny8-table-compact td {
font-size: 13px !important;
}
/* Compact Table Headers */
.igny8-table-compact th {
padding: 8px 12px !important;
font-size: 13px !important;
font-weight: 600 !important;
font-weight: 500 !important;
color: var(--color-text-dim) !important;
text-align: left !important;
background-color: var(--color-surface) !important;
border-bottom: 2px solid var(--color-stroke) !important;
text-transform: capitalize;
letter-spacing: 0.3px;
line-height: 1.3 !important;
border-bottom: 1px solid var(--color-stroke) !important;
text-transform: uppercase;
letter-spacing: 0.5px;
line-height: 1.4 !important;
}
.dark .igny8-table-compact th {
@@ -502,9 +523,8 @@
}
.igny8-table-compact td {
padding: 6px 10px !important;
font-size: 13px !important;
line-height: 1.3 !important;
padding: 8px !important;
line-height: 1.4 !important;
border-bottom: 1px solid var(--color-stroke) !important;
}