fix(dashboard): add CSS for header and container layout
Added missing CSS for dashboard v2 header and container: - .rpg-dashboard-container: Flexbox column layout with gap - .rpg-dashboard-header: Flexbox row with space-between - .rpg-dashboard-header-left/right: Flex containers for button groups - .rpg-dashboard-btn: Button styling with theme variables - .rpg-dashboard-grid: Grid container styling Also fixed dashboardManager.js to preserve template structure: - Changed createContainerStructure() to query existing elements first - Only creates elements if template didn't provide them - Prevents clearing the entire container and losing the header This fixes the issue where all components (header, buttons, widgets) were stacking on top of each other due to missing layout CSS.
This commit is contained in:
@@ -1040,6 +1040,65 @@ body:has(.rpg-panel.rpg-position-left) #sheld {
|
||||
transform: scale(0.95);
|
||||
}
|
||||
|
||||
/* ========================================
|
||||
DASHBOARD V2 CONTAINER & HEADER STYLES
|
||||
========================================
|
||||
Dashboard container and header layout
|
||||
======================================== */
|
||||
|
||||
.rpg-dashboard-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.75rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.rpg-dashboard-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.5rem 0;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.rpg-dashboard-header-left,
|
||||
.rpg-dashboard-header-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.rpg-dashboard-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
padding: 0.4rem 0.6rem;
|
||||
font-size: 0.75rem;
|
||||
border: 1px solid var(--SmartThemeBorderColor);
|
||||
background: var(--SmartThemeBlurTintColor);
|
||||
color: var(--SmartThemeBodyColor);
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.rpg-dashboard-btn:hover {
|
||||
background: var(--SmartThemeQuoteColor);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.rpg-dashboard-btn i {
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.rpg-dashboard-grid {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
min-height: 200px;
|
||||
}
|
||||
|
||||
/* ========================================
|
||||
DASHBOARD V2 WIDGET STYLES
|
||||
========================================
|
||||
|
||||
Reference in New Issue
Block a user