08f8150064
Extracts inline styles from Razor pages into modular CSS files Adds new CSS files for components and specific page styles Improves code organization and maintainability by separating styling concerns Updates layout to include new CSS files and optional style sections
89 lines
1.6 KiB
CSS
89 lines
1.6 KiB
CSS
/* Backup Page Styles */
|
|
|
|
.type-icon, .dest-icon {
|
|
margin-right: 6px;
|
|
}
|
|
|
|
/* Daily Chart */
|
|
.daily-chart {
|
|
display: flex;
|
|
gap: 4px;
|
|
height: 80px;
|
|
align-items: flex-end;
|
|
padding: 8px 0;
|
|
}
|
|
|
|
.day-bar {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
.bar-container {
|
|
flex: 1;
|
|
width: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: flex-end;
|
|
position: relative;
|
|
}
|
|
|
|
.bar-success {
|
|
background: var(--success-color);
|
|
border-radius: 2px 2px 0 0;
|
|
min-height: 2px;
|
|
}
|
|
|
|
.bar-failed {
|
|
background: var(--danger-color);
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
border-radius: 2px 2px 0 0;
|
|
}
|
|
|
|
.day-label {
|
|
font-size: 9px;
|
|
color: var(--muted-color);
|
|
margin-top: 4px;
|
|
}
|
|
|
|
/* Chart Legend */
|
|
.chart-legend {
|
|
display: flex;
|
|
gap: 16px;
|
|
justify-content: center;
|
|
font-size: 10px;
|
|
color: var(--muted-color);
|
|
}
|
|
|
|
.legend-dot {
|
|
display: inline-block;
|
|
width: 8px;
|
|
height: 8px;
|
|
border-radius: 50%;
|
|
margin-right: 4px;
|
|
}
|
|
|
|
.legend-dot.success { background: var(--success-color); }
|
|
.legend-dot.danger { background: var(--danger-color); }
|
|
|
|
/* Item Error */
|
|
.item-error {
|
|
font-size: 10px;
|
|
color: var(--danger-color);
|
|
margin-top: 4px;
|
|
padding-left: 40px;
|
|
font-style: italic;
|
|
}
|
|
|
|
/* Error Code */
|
|
.error-code {
|
|
background: rgba(220, 53, 69, 0.1);
|
|
color: var(--danger-color);
|
|
padding: 2px 6px;
|
|
border-radius: 3px;
|
|
font-size: 10px;
|
|
}
|