subtle aesthetic updates
This commit is contained in:
@@ -34,16 +34,18 @@
|
||||
/* Terminal Font Stack */
|
||||
--font-mono: 'Courier New', 'Consolas', 'Monaco', 'Menlo', monospace;
|
||||
|
||||
/* Glow Effects */
|
||||
--glow-green: 0 0 5px #00ff41, 0 0 10px #00ff41;
|
||||
--glow-red: 0 0 5px #ff4d4d, 0 0 10px #ff4d4d;
|
||||
--glow-blue: 0 0 5px #42a5f5, 0 0 10px #42a5f5;
|
||||
--glow-amber: 0 0 5px #ffb000, 0 0 10px #ffb000;
|
||||
--glow-priority-1: 0 0 5px #ff4d4d, 0 0 10px #ff4d4d;
|
||||
--glow-priority-2: 0 0 5px #ffa726, 0 0 10px #ffa726;
|
||||
--glow-priority-3: 0 0 5px #42a5f5, 0 0 10px #42a5f5;
|
||||
--glow-priority-4: 0 0 5px #66bb6a, 0 0 10px #66bb6a;
|
||||
--glow-priority-5: 0 0 5px #9e9e9e, 0 0 10px #9e9e9e;
|
||||
/* Glow Effects - Enhanced for stronger phosphor effect */
|
||||
--glow-green: 0 0 5px #00ff41, 0 0 10px #00ff41, 0 0 15px #00ff41;
|
||||
--glow-green-intense: 0 0 8px #00ff41, 0 0 16px #00ff41, 0 0 24px #00ff41, 0 0 32px rgba(0, 255, 65, 0.5);
|
||||
--glow-red: 0 0 5px #ff4d4d, 0 0 10px #ff4d4d, 0 0 15px #ff4d4d;
|
||||
--glow-blue: 0 0 5px #42a5f5, 0 0 10px #42a5f5, 0 0 15px #42a5f5;
|
||||
--glow-amber: 0 0 5px #ffb000, 0 0 10px #ffb000, 0 0 15px #ffb000;
|
||||
--glow-amber-intense: 0 0 8px #ffb000, 0 0 16px #ffb000, 0 0 24px #ffb000;
|
||||
--glow-priority-1: 0 0 5px #ff4d4d, 0 0 10px #ff4d4d, 0 0 15px #ff4d4d;
|
||||
--glow-priority-2: 0 0 5px #ffa726, 0 0 10px #ffa726, 0 0 15px #ffa726;
|
||||
--glow-priority-3: 0 0 5px #42a5f5, 0 0 10px #42a5f5, 0 0 15px #42a5f5;
|
||||
--glow-priority-4: 0 0 5px #66bb6a, 0 0 10px #66bb6a, 0 0 15px #66bb6a;
|
||||
--glow-priority-5: 0 0 5px #9e9e9e, 0 0 10px #9e9e9e, 0 0 15px #9e9e9e;
|
||||
|
||||
/* Spacing */
|
||||
--spacing-xs: 0.5rem;
|
||||
@@ -75,6 +77,86 @@ body {
|
||||
background-color: var(--bg-primary);
|
||||
color: var(--text-primary);
|
||||
transition: var(--transition-default);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* CRT Scanline Effect - Subtle retro terminal look */
|
||||
body::before {
|
||||
content: '';
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: repeating-linear-gradient(
|
||||
0deg,
|
||||
rgba(0, 0, 0, 0.15),
|
||||
rgba(0, 0, 0, 0.15) 1px,
|
||||
transparent 1px,
|
||||
transparent 2px
|
||||
);
|
||||
pointer-events: none;
|
||||
z-index: 9999;
|
||||
animation: scanline 8s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes scanline {
|
||||
0% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
100% {
|
||||
transform: translateY(4px);
|
||||
}
|
||||
}
|
||||
|
||||
/* Screen Flicker Effect */
|
||||
@keyframes flicker {
|
||||
0% { opacity: 1; }
|
||||
10% { opacity: 0.95; }
|
||||
20% { opacity: 1; }
|
||||
30% { opacity: 0.97; }
|
||||
40% { opacity: 1; }
|
||||
}
|
||||
|
||||
@keyframes glitch {
|
||||
0% { transform: translate(0); }
|
||||
20% { transform: translate(-2px, 2px); }
|
||||
40% { transform: translate(-2px, -2px); }
|
||||
60% { transform: translate(2px, 2px); }
|
||||
80% { transform: translate(2px, -2px); }
|
||||
100% { transform: translate(0); }
|
||||
}
|
||||
|
||||
.ascii-frame-outer:hover {
|
||||
animation: flicker 0.15s ease-in-out 1;
|
||||
}
|
||||
|
||||
/* Random screen glitch every 30 seconds */
|
||||
body {
|
||||
animation: flicker 0.2s ease-in-out 30s infinite;
|
||||
}
|
||||
|
||||
/* Subtle data stream effect in corner */
|
||||
body::after {
|
||||
content: '10101010';
|
||||
position: fixed;
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
font-family: var(--font-mono);
|
||||
font-size: 0.6rem;
|
||||
color: var(--terminal-green);
|
||||
opacity: 0.1;
|
||||
pointer-events: none;
|
||||
letter-spacing: 2px;
|
||||
animation: data-stream 3s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes data-stream {
|
||||
0% { content: '10101010'; opacity: 0.1; }
|
||||
25% { content: '01010101'; opacity: 0.15; }
|
||||
50% { content: '11001100'; opacity: 0.1; }
|
||||
75% { content: '00110011'; opacity: 0.15; }
|
||||
100% { content: '10101010'; opacity: 0.1; }
|
||||
}
|
||||
|
||||
body.menu-open {
|
||||
@@ -95,8 +177,25 @@ h1 {
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom: 2px solid var(--terminal-green);
|
||||
box-shadow: 0 2px 20px rgba(0, 255, 65, 0.2);
|
||||
box-sizing: border-box;
|
||||
font-family: var(--font-mono);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.user-header::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 2px;
|
||||
background: linear-gradient(90deg,
|
||||
transparent 0%,
|
||||
var(--terminal-green) 20%,
|
||||
var(--terminal-green) 80%,
|
||||
transparent 100%);
|
||||
box-shadow: var(--glow-green);
|
||||
}
|
||||
|
||||
.user-header-left,
|
||||
@@ -112,8 +211,15 @@ h1 {
|
||||
font-weight: bold;
|
||||
font-size: 1rem;
|
||||
color: var(--terminal-amber);
|
||||
text-shadow: var(--glow-amber);
|
||||
text-shadow: var(--glow-amber-intense);
|
||||
white-space: nowrap;
|
||||
animation: subtle-pulse 3s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.app-title::before {
|
||||
content: '>> ';
|
||||
color: var(--terminal-green);
|
||||
text-shadow: var(--glow-green);
|
||||
}
|
||||
|
||||
.back-link {
|
||||
@@ -251,15 +357,22 @@ h1 {
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
/* Bottom corners as separate elements */
|
||||
/* Bottom corners as separate elements with enhanced glow */
|
||||
.bottom-left-corner,
|
||||
.bottom-right-corner {
|
||||
position: absolute;
|
||||
bottom: -3px;
|
||||
font-size: 1.5rem;
|
||||
color: var(--terminal-green);
|
||||
text-shadow: var(--glow-green);
|
||||
line-height: 1;
|
||||
z-index: 10;
|
||||
animation: corner-pulse 4s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes corner-pulse {
|
||||
0%, 100% { text-shadow: var(--glow-green); }
|
||||
50% { text-shadow: var(--glow-green-intense); }
|
||||
}
|
||||
|
||||
.bottom-left-corner {
|
||||
@@ -308,9 +421,15 @@ h1 {
|
||||
font-family: var(--font-mono);
|
||||
font-weight: bold;
|
||||
color: var(--terminal-amber);
|
||||
text-shadow: var(--glow-amber);
|
||||
text-shadow: var(--glow-amber-intense);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.1em;
|
||||
animation: subtle-pulse 3s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes subtle-pulse {
|
||||
0%, 100% { text-shadow: var(--glow-amber); }
|
||||
50% { text-shadow: var(--glow-amber-intense); }
|
||||
}
|
||||
|
||||
.ascii-section-header::before {
|
||||
@@ -363,21 +482,25 @@ h1 {
|
||||
}
|
||||
|
||||
.ascii-divider::before {
|
||||
content: '╞';
|
||||
content: '╞═══';
|
||||
position: absolute;
|
||||
left: -2px;
|
||||
top: -11px;
|
||||
color: var(--terminal-green);
|
||||
font-size: 1.2rem;
|
||||
text-shadow: var(--glow-green);
|
||||
letter-spacing: -2px;
|
||||
}
|
||||
|
||||
.ascii-divider::after {
|
||||
content: '╡';
|
||||
content: '═══╡';
|
||||
position: absolute;
|
||||
right: -2px;
|
||||
top: -11px;
|
||||
color: var(--terminal-green);
|
||||
font-size: 1.2rem;
|
||||
text-shadow: var(--glow-green);
|
||||
letter-spacing: -2px;
|
||||
}
|
||||
|
||||
/* Content wrapper inside frames */
|
||||
@@ -714,18 +837,37 @@ button::after {
|
||||
.btn:hover,
|
||||
.btn-base:hover,
|
||||
button:hover {
|
||||
background: rgba(0, 255, 65, 0.1);
|
||||
background: rgba(0, 255, 65, 0.15);
|
||||
color: var(--terminal-amber);
|
||||
border-color: var(--terminal-amber);
|
||||
text-shadow: var(--glow-amber);
|
||||
text-shadow: var(--glow-amber-intense);
|
||||
box-shadow: var(--glow-amber-intense);
|
||||
transform: translateY(-2px);
|
||||
animation: pulse-glow 1.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.btn:active,
|
||||
.btn-base:active,
|
||||
button:active {
|
||||
transform: translateY(0);
|
||||
box-shadow: 0 0 20px rgba(0, 255, 65, 0.5);
|
||||
box-shadow: var(--glow-green-intense);
|
||||
}
|
||||
|
||||
@keyframes pulse-glow {
|
||||
0%, 100% { box-shadow: 0 0 8px currentColor, 0 0 16px currentColor; }
|
||||
50% { box-shadow: 0 0 12px currentColor, 0 0 24px currentColor, 0 0 32px currentColor; }
|
||||
}
|
||||
|
||||
/* Terminal prompt for primary action buttons */
|
||||
.btn.create-ticket::before,
|
||||
.btn.primary::before {
|
||||
content: '> ';
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.btn.create-ticket::after,
|
||||
.btn.primary::after {
|
||||
content: '';
|
||||
}
|
||||
|
||||
.btn-primary,
|
||||
@@ -775,7 +917,7 @@ table {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* ASCII corner decorations */
|
||||
/* ASCII corner decorations with glow */
|
||||
table::before {
|
||||
content: '┌';
|
||||
position: absolute;
|
||||
@@ -783,6 +925,7 @@ table::before {
|
||||
left: -2px;
|
||||
font-size: 1.2rem;
|
||||
color: var(--terminal-green);
|
||||
text-shadow: var(--glow-green);
|
||||
line-height: 1;
|
||||
z-index: 10;
|
||||
}
|
||||
@@ -794,6 +937,7 @@ table::after {
|
||||
right: -2px;
|
||||
font-size: 1.2rem;
|
||||
color: var(--terminal-green);
|
||||
text-shadow: var(--glow-green);
|
||||
line-height: 1;
|
||||
z-index: 10;
|
||||
}
|
||||
@@ -816,6 +960,12 @@ th {
|
||||
cursor: pointer;
|
||||
color: var(--terminal-amber);
|
||||
text-shadow: var(--glow-amber);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
th:hover {
|
||||
text-shadow: var(--glow-amber-intense);
|
||||
background-color: rgba(255, 176, 0, 0.05);
|
||||
}
|
||||
|
||||
/* Add terminal prompt to headers */
|
||||
@@ -826,7 +976,8 @@ th::before {
|
||||
}
|
||||
|
||||
tr:hover {
|
||||
background-color: rgba(0, 255, 65, 0.05);
|
||||
background-color: rgba(0, 255, 65, 0.08);
|
||||
box-shadow: inset 0 0 20px rgba(0, 255, 65, 0.1);
|
||||
}
|
||||
|
||||
tbody tr td:first-child {
|
||||
@@ -870,24 +1021,55 @@ td:nth-child(2) span::after {
|
||||
.priority-1 td:nth-child(2) {
|
||||
color: var(--priority-1);
|
||||
text-shadow: var(--glow-priority-1);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.priority-1 td:nth-child(2)::after {
|
||||
content: ' ▲▲';
|
||||
font-size: 0.7em;
|
||||
}
|
||||
|
||||
.priority-2 td:nth-child(2) {
|
||||
color: var(--priority-2);
|
||||
text-shadow: var(--glow-priority-2);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.priority-2 td:nth-child(2)::after {
|
||||
content: ' ▲';
|
||||
font-size: 0.7em;
|
||||
}
|
||||
|
||||
.priority-3 td:nth-child(2) {
|
||||
color: var(--priority-3);
|
||||
text-shadow: var(--glow-priority-3);
|
||||
}
|
||||
|
||||
.priority-3 td:nth-child(2)::after {
|
||||
content: ' ●';
|
||||
font-size: 0.7em;
|
||||
}
|
||||
|
||||
.priority-4 td:nth-child(2) {
|
||||
color: var(--priority-4);
|
||||
text-shadow: var(--glow-priority-4);
|
||||
}
|
||||
|
||||
.priority-4 td:nth-child(2)::after {
|
||||
content: ' ▼';
|
||||
font-size: 0.7em;
|
||||
}
|
||||
|
||||
.priority-5 td:nth-child(2) {
|
||||
color: var(--priority-5);
|
||||
text-shadow: var(--glow-priority-5);
|
||||
}
|
||||
|
||||
.priority-5 td:nth-child(2)::after {
|
||||
content: ' ▼▼';
|
||||
font-size: 0.7em;
|
||||
}
|
||||
|
||||
/* ===== STATUS STYLES - TERMINAL EDITION ===== */
|
||||
.status-Open {
|
||||
background-color: transparent !important;
|
||||
@@ -902,7 +1084,7 @@ td:nth-child(2) span::after {
|
||||
}
|
||||
|
||||
.status-Open::before {
|
||||
content: '[';
|
||||
content: '[●';
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
@@ -927,8 +1109,17 @@ td:nth-child(2) span::after {
|
||||
}
|
||||
|
||||
.status-In-Progress::before {
|
||||
content: '[';
|
||||
content: '[◐';
|
||||
margin-right: 4px;
|
||||
animation: spin-status 2s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin-status {
|
||||
0% { content: '[◐'; }
|
||||
25% { content: '[◓'; }
|
||||
50% { content: '[◑'; }
|
||||
75% { content: '[◒'; }
|
||||
100% { content: '[◐'; }
|
||||
}
|
||||
|
||||
.status-In-Progress::after {
|
||||
@@ -949,7 +1140,7 @@ td:nth-child(2) span::after {
|
||||
}
|
||||
|
||||
.status-Closed::before {
|
||||
content: '[';
|
||||
content: '[✓';
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
@@ -971,7 +1162,7 @@ td:nth-child(2) span::after {
|
||||
}
|
||||
|
||||
.status-Resolved::before {
|
||||
content: '[';
|
||||
content: '[✓';
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
@@ -993,6 +1184,18 @@ select {
|
||||
border-radius: 0;
|
||||
padding: 8px 12px;
|
||||
transition: all 0.3s ease;
|
||||
box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.search-box:focus,
|
||||
input[type="text"]:focus,
|
||||
input[type="search"]:focus,
|
||||
textarea:focus,
|
||||
select:focus {
|
||||
outline: none;
|
||||
border-color: var(--terminal-amber);
|
||||
box-shadow: var(--glow-amber), inset 0 0 10px rgba(0, 0, 0, 0.5);
|
||||
background: rgba(0, 255, 65, 0.05);
|
||||
}
|
||||
|
||||
.search-box {
|
||||
@@ -1367,17 +1570,45 @@ input[type="checkbox"]:checked {
|
||||
padding: 1rem;
|
||||
border: 2px solid var(--terminal-green);
|
||||
box-shadow: var(--glow-green);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.dashboard-sidebar .ascii-frame-inner::before {
|
||||
content: '│';
|
||||
position: absolute;
|
||||
left: 5px;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
color: var(--terminal-green);
|
||||
opacity: 0.3;
|
||||
font-size: 1.5rem;
|
||||
line-height: 1.2;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.dashboard-sidebar .ascii-subsection-header {
|
||||
color: var(--terminal-amber);
|
||||
text-shadow: var(--glow-amber);
|
||||
text-shadow: var(--glow-amber-intense);
|
||||
font-family: var(--font-mono);
|
||||
font-size: 1.1rem;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 1rem;
|
||||
padding-bottom: 0.5rem;
|
||||
border-bottom: 2px solid var(--terminal-green);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.dashboard-sidebar .ascii-subsection-header::before {
|
||||
content: '╔═══ ';
|
||||
color: var(--terminal-green);
|
||||
text-shadow: var(--glow-green);
|
||||
}
|
||||
|
||||
.dashboard-sidebar .ascii-subsection-header::after {
|
||||
content: ' ═══╗';
|
||||
color: var(--terminal-green);
|
||||
text-shadow: var(--glow-green);
|
||||
}
|
||||
|
||||
.filter-group {
|
||||
@@ -1413,6 +1644,18 @@ input[type="checkbox"]:checked {
|
||||
margin-right: 0.5rem;
|
||||
cursor: pointer;
|
||||
accent-color: var(--terminal-green);
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border: 2px solid var(--terminal-green);
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.filter-group input[type="checkbox"]:checked {
|
||||
box-shadow: var(--glow-green);
|
||||
}
|
||||
|
||||
.filter-group input[type="checkbox"]:hover {
|
||||
filter: brightness(1.3);
|
||||
}
|
||||
|
||||
.dashboard-sidebar .btn {
|
||||
@@ -1465,6 +1708,78 @@ input[type="checkbox"]:checked {
|
||||
}
|
||||
}
|
||||
|
||||
/* ===== BOOT SEQUENCE ===== */
|
||||
.boot-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--bg-primary);
|
||||
z-index: 99999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: opacity 0.5s;
|
||||
}
|
||||
|
||||
#boot-text {
|
||||
font-family: var(--font-mono);
|
||||
color: var(--terminal-green);
|
||||
text-shadow: var(--glow-green);
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.6;
|
||||
white-space: pre;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
/* ===== ASCII LOADING SPINNER ===== */
|
||||
.loading-spinner {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
z-index: 10000;
|
||||
background: var(--bg-primary);
|
||||
border: 3px solid var(--terminal-green);
|
||||
padding: 2rem;
|
||||
box-shadow: 0 0 30px rgba(0, 255, 65, 0.5);
|
||||
font-family: var(--font-mono);
|
||||
color: var(--terminal-green);
|
||||
font-size: 1.5rem;
|
||||
text-shadow: var(--glow-green);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.loading-spinner.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.spinner-text {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.spinner-frames {
|
||||
animation: spin-frames 0.8s steps(8) infinite;
|
||||
}
|
||||
|
||||
@keyframes spin-frames {
|
||||
0% { content: '|'; }
|
||||
12.5% { content: '/'; }
|
||||
25% { content: '—'; }
|
||||
37.5% { content: '\\'; }
|
||||
50% { content: '|'; }
|
||||
62.5% { content: '/'; }
|
||||
75% { content: '—'; }
|
||||
87.5% { content: '\\'; }
|
||||
}
|
||||
|
||||
.spinner-frames::before {
|
||||
content: '|';
|
||||
display: inline-block;
|
||||
animation: spin-frames 0.8s steps(8) infinite;
|
||||
}
|
||||
|
||||
/* ===== UTILITY STYLES ===== */
|
||||
.ticket-link {
|
||||
font-family: 'Courier New', monospace;
|
||||
@@ -1475,10 +1790,22 @@ input[type="checkbox"]:checked {
|
||||
padding: 4px 8px;
|
||||
border-radius: 0;
|
||||
display: inline-block;
|
||||
border: 1px solid transparent;
|
||||
transition: all 0.3s ease;
|
||||
text-shadow: var(--glow-green);
|
||||
}
|
||||
|
||||
.ticket-link::before {
|
||||
content: '#';
|
||||
color: var(--terminal-amber);
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
.ticket-link:hover {
|
||||
background: var(--border-color);
|
||||
background: rgba(0, 255, 65, 0.2);
|
||||
border-color: var(--terminal-green);
|
||||
text-shadow: var(--glow-green-intense);
|
||||
transform: translateX(2px);
|
||||
}
|
||||
|
||||
/* ===== PAGINATION STYLES ===== */
|
||||
@@ -1490,22 +1817,28 @@ input[type="checkbox"]:checked {
|
||||
|
||||
.pagination button {
|
||||
padding: 0.5rem 0.75rem;
|
||||
border: 1px solid var(--border-color);
|
||||
border: 2px solid var(--terminal-green);
|
||||
background: var(--bg-secondary);
|
||||
color: var(--text-primary);
|
||||
border-radius: 0.375rem;
|
||||
color: var(--terminal-green);
|
||||
border-radius: 0;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
transition: all 0.3s ease;
|
||||
font-family: var(--font-mono);
|
||||
text-shadow: var(--glow-green);
|
||||
}
|
||||
|
||||
.pagination button:hover {
|
||||
background: var(--hover-bg);
|
||||
background: rgba(0, 255, 65, 0.15);
|
||||
box-shadow: var(--glow-green);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.pagination button.active {
|
||||
background: #3b82f6;
|
||||
color: white;
|
||||
border-color: #3b82f6;
|
||||
background: var(--terminal-green);
|
||||
color: var(--bg-primary);
|
||||
border-color: var(--terminal-green);
|
||||
box-shadow: var(--glow-green-intense);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* ===== SORTING STYLES ===== */
|
||||
|
||||
Reference in New Issue
Block a user