Spaces:
Paused
Paused
File size: 2,524 Bytes
4279593 85a4a41 4279593 85a4a41 4279593 85a4a41 4279593 85a4a41 4279593 85a4a41 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 |
:root {
/* Dark theme variables */
--sidebar-background: #2b2b2b;
--text-light: #eee;
--border-dark: #333;
}
/* Main sidebar container */
.right-side-bar {
display: flex;
flex-direction: column;
position: fixed;
top: 0;
right: 0;
height: 100%;
background-color: var(--sidebar-background); /* Keep background uniform */
color: var(--text-light);
box-shadow: -2px 0 8px rgba(0, 0, 0, 0.5);
transition: width 0.4s ease;
overflow-y: auto;
z-index: 1000;
}
/* Sidebar resizing */
.right-side-bar.resizing {
transition: none;
}
/* When the sidebar is closed */
.right-side-bar.closed {
width: 0;
overflow: hidden;
}
/* Sidebar header styling */
.sidebar-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 16px;
border-bottom: 3px solid var(--border-dark);
}
.sidebar-header h3 {
margin: 0;
font-size: 1.2rem;
}
/* Close button styling */
.close-btn {
background: none;
border: none;
padding: 6px;
color: var(--text-color);
font-size: 1.2rem;
cursor: pointer;
transition: color var(--transition-speed);
}
.close-btn:hover {
background: rgba(255, 255, 255, 0.1);
color: white;
}
/* Ensure the sidebar background remains uniform */
.sidebar-content {
padding: 16px;
background: transparent;
overflow-x: hidden;
overflow-y: auto;
}
/* Also clear any default marker via the pseudo-element */
.nav-links.no-bullets li::marker {
content: "";
}
/* Lay out each task item using flex so that the icon and text align */
.task-item {
display: flex;
align-items: flex-start;
margin-bottom: 1rem;
}
/* Icon span: fixed width and margin for spacing */
.task-icon {
flex-shrink: 0;
margin-right: 1rem;
}
/* Task list text */
.task-text {
white-space: pre-wrap;
}
/* Resizer for sidebar width adjustment */
.resizer {
position: absolute;
left: 0;
top: 0;
width: 5px;
height: 100%;
cursor: ew-resize;
}
/* Toggle button (when sidebar is closed) */
.toggle-btn.right-toggle {
position: fixed;
top: 50%;
right: 0;
transform: translateY(-50%);
background-color: var(--dark-surface);
color: var(--text-light);
border: none;
padding: 8px;
cursor: pointer;
z-index: 1001;
box-shadow: -2px 0 4px rgba(0, 0, 0, 0.5);
}
.spin {
animation: spin 1s linear infinite;
color: #328bff;
}
.checkmark {
color: #03c203;
}
.x {
color: #d10808;
}
/* Keyframes for the spinner animation */
@keyframes spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
} |