Added new navigation links for Dashboard, Editor, Player, Paper, Settings, Tables, and News sections. Each link includes click handlers to switch sections and active state styling. This expands the application's navigation options for better user access to different features.
73 lines
1.3 KiB
CSS
73 lines
1.3 KiB
CSS
/* Dashboard specific styles */
|
|
.container {
|
|
max-width: 1200px;
|
|
margin: 0 auto;
|
|
padding: 1rem;
|
|
}
|
|
|
|
.cards-grid {
|
|
display: grid;
|
|
gap: 1rem;
|
|
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
|
|
}
|
|
|
|
.card {
|
|
padding: 1.5rem;
|
|
background: var(--card);
|
|
border: 1px solid var(--border);
|
|
border-radius: 0.5rem;
|
|
}
|
|
|
|
.card h3 {
|
|
font-size: 0.875rem;
|
|
color: var(--muted-foreground);
|
|
margin-bottom: 0.5rem;
|
|
}
|
|
|
|
.card .value {
|
|
font-size: 1.5rem;
|
|
font-weight: bold;
|
|
color: var(--card-foreground);
|
|
}
|
|
|
|
.card .subtext {
|
|
font-size: 0.75rem;
|
|
color: var(--muted-foreground);
|
|
margin-top: 0.25rem;
|
|
}
|
|
|
|
.dashboard-grid {
|
|
display: grid;
|
|
gap: 1rem;
|
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
|
}
|
|
|
|
.overview-container,
|
|
.recent-sales-container {
|
|
padding: 1.5rem;
|
|
background: var(--card);
|
|
border: 1px solid var(--border);
|
|
border-radius: 0.5rem;
|
|
}
|
|
|
|
.overview-container h3,
|
|
.recent-sales-container h3 {
|
|
font-size: 1.125rem;
|
|
font-weight: 500;
|
|
color: var(--card-foreground);
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.download-btn {
|
|
padding: 0.5rem 1rem;
|
|
background: var(--primary);
|
|
color: var(--primary-foreground);
|
|
border: none;
|
|
border-radius: 0.375rem;
|
|
cursor: pointer;
|
|
transition: opacity 0.2s;
|
|
}
|
|
|
|
.download-btn:hover {
|
|
opacity: 0.9;
|
|
}
|