Doormile/doormile_crm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updates on the full ui and followed by astryx

Browse Source
This commit is contained in:
dharaneesh-r
2026-07-15 17:53:46 +05:30
parent 03f07c79ee
commit d4227a0b12
18 changed files with 231 additions and 281 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/layout/MainLayout/Header.jsx
View File

@@ -15,7 +15,7 @@ export default function Header({ isSidebarCollapsed }) {
try {
const storedUser = localStorage.getItem('user');
if (storedUser) storedUserObj = JSON.parse(storedUser);
} catch (e) {}
} catch (e) { }
const [activeUserName, setActiveUserName] = useState(storedUserObj.name || 'Admin');
@@ -45,12 +45,12 @@ export default function Header({ isSidebarCollapsed }) {
logo={
<Logo
compact={isSidebarCollapsed}
size={32}
size={isSidebarCollapsed ? 36 : 32}
height={28}
// Scaling visually enlarges the mark without growing its layout
// box, so the navbar row keeps its original width/height instead
// of stretching taller every time the logo gets bigger.
style={isSidebarCollapsed ? { transform: 'scale(1.6)' } : undefined}
style={isSidebarCollapsed ? { transform: 'scale(1.4)' } : undefined}
/>
}
headingHref="/dashboard"

35
src/layout/MainLayout/Sidebar.jsx
View File

@@ -79,17 +79,17 @@ export default function Sidebar({ isCollapsed, onCollapsedChange }) {
height: 18px !important;
}
.doormile-side-nav .astryx-side-nav-item[aria-label]:hover {
background-color: rgba(192, 18, 39, 0.08) !important;
background-color: rgba(10, 19, 23, 0.08) !important;
}
.doormile-side-nav .astryx-side-nav-item[aria-label]:focus-visible {
outline: 2px solid rgba(192, 18, 39, 0.4);
outline: 2px solid rgba(10, 19, 23, 0.4);
outline-offset: 2px;
}
.doormile-side-nav .astryx-side-nav-item[aria-label][data-selected='selected'] {
background-color: rgba(192, 18, 39, 0.12) !important;
background-color: rgba(10, 19, 23, 0.12) !important;
}
.doormile-side-nav .astryx-side-nav-item[aria-label][data-selected='selected'] .astryx-icon {
color: #C01227 !important;
color: #0A1317 !important;
}
/* Expanded rows: rounded hover/selected states with a left accent
@@ -107,37 +107,37 @@ export default function Sidebar({ isCollapsed, onCollapsedChange }) {
position: relative;
margin-inline: 2px;
height: auto;
padding-block: 8px !important;
padding-block: 12px !important;
transition: background-color 0.15s ease, transform 0.15s ease;
}
.doormile-side-nav .astryx-side-nav-item:not([aria-label])::before {
content: '';
position: absolute;
left: -2px;
top: 8px;
bottom: 8px;
top: 12px;
bottom: 12px;
width: 3px;
border-radius: 3px;
background-color: #C01227;
background-color: #0A1317;
opacity: 0;
transition: opacity 0.15s ease;
}
.doormile-side-nav .astryx-side-nav-item:not([aria-label]):hover {
background-color: rgba(192, 18, 39, 0.05) !important;
background-color: rgba(10, 19, 23, 0.05) !important;
transform: translateX(2px);
}
.doormile-side-nav .astryx-side-nav-item:not([aria-label]):focus-visible {
outline: 2px solid rgba(192, 18, 39, 0.4);
outline: 2px solid rgba(10, 19, 23, 0.4);
outline-offset: 2px;
}
.doormile-side-nav .astryx-side-nav-item:not([aria-label])[data-selected='selected'] {
background-color: rgba(192, 18, 39, 0.08) !important;
background-color: rgba(10, 19, 23, 0.08) !important;
}
.doormile-side-nav .astryx-side-nav-item:not([aria-label])[data-selected='selected']::before {
opacity: 1;
}
.doormile-side-nav .astryx-side-nav-item:not([aria-label])[data-selected='selected'] .astryx-icon {
color: #C01227 !important;
color: #0A1317 !important;
}
/* Astryx's sticky-bottom footer wrapper (the toggle button's direct
@@ -150,19 +150,18 @@ export default function Sidebar({ isCollapsed, onCollapsedChange }) {
padding-block: 8px !important;
}
/* Collapse/expand toggle (the "<" / ">" chevron button). It sits
right on the sidebar's edge, so the default square ghost-button
hover clips against that border and looks broken. Give it a
clean circular hover detached from the edge instead. */
/* Collapse/expand toggle (the "<" / ">" chevron button). Give it a
clean circular hover, centered on the same axis as the nav icons
above it (the rail's own 8px inline padding already keeps it clear
of the sidebar's edge, so no extra offset is needed here). */
.doormile-side-nav button[aria-label*="sidebar"],
.doormile-side-nav button[aria-label*="navigation"] {
border-radius: 50% !important;
transition: background-color 0.15s ease !important;
transform: translateX(-6px) !important;
}
.doormile-side-nav button[aria-label*="sidebar"]:hover,
.doormile-side-nav button[aria-label*="navigation"]:hover {
background-color: rgba(192, 18, 39, 0.08) !important;
background-color: rgba(10, 19, 23, 0.08) !important;
}
`}</style>
</>