Rodrigo Rodriguez (Pragmatismo)
b9395cb0d7
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.
102 lines
1.5 KiB
CSS
102 lines
1.5 KiB
CSS
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
|
|
background: #0f172a;
|
|
color: #e2e8f0;
|
|
height: 100vh;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* Navbar */
|
|
nav {
|
|
background: #1e293b;
|
|
border-bottom: 2px solid #334155;
|
|
padding: 0 1rem;
|
|
display: flex;
|
|
align-items: center;
|
|
height: 60px;
|
|
gap: 0.5rem;
|
|
}
|
|
|
|
nav .logo {
|
|
font-size: 1.5rem;
|
|
font-weight: bold;
|
|
background: linear-gradient(135deg, #3b82f6, #8b5cf6);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
margin-right: auto;
|
|
}
|
|
|
|
nav a {
|
|
color: #94a3b8;
|
|
text-decoration: none;
|
|
padding: 0.75rem 1.25rem;
|
|
border-radius: 0.5rem;
|
|
transition: all 0.2s;
|
|
font-weight: 500;
|
|
}
|
|
|
|
nav a:hover {
|
|
background: #334155;
|
|
color: #e2e8f0;
|
|
}
|
|
|
|
nav a.active {
|
|
background: #3b82f6;
|
|
color: white;
|
|
}
|
|
|
|
/* Main Content */
|
|
#main-content {
|
|
height: calc(100vh - 60px);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.content-section {
|
|
display: none;
|
|
height: 100%;
|
|
overflow: auto;
|
|
}
|
|
|
|
.content-section.active {
|
|
display: block;
|
|
}
|
|
|
|
/* Panel Styles */
|
|
.panel {
|
|
background: #1e293b;
|
|
border: 1px solid #334155;
|
|
border-radius: 0.5rem;
|
|
}
|
|
|
|
/* Buttons */
|
|
button {
|
|
font-family: inherit;
|
|
}
|
|
|
|
button:disabled {
|
|
opacity: 0.5;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
/* Utility */
|
|
h1, h2, h3 {
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.text-sm {
|
|
font-size: 0.875rem;
|
|
}
|
|
|
|
.text-xs {
|
|
font-size: 0.75rem;
|
|
}
|
|
|
|
.text-gray {
|
|
color: #94a3b8;
|
|
}
|
|
|
|
[x-cloak] {
|
|
display: none !important;
|
|
}
|