summaryrefslogtreecommitdiff
path: root/tools/spectral_editor/style.css
diff options
context:
space:
mode:
Diffstat (limited to 'tools/spectral_editor/style.css')
-rw-r--r--tools/spectral_editor/style.css106
1 files changed, 3 insertions, 103 deletions
diff --git a/tools/spectral_editor/style.css b/tools/spectral_editor/style.css
index 48f7463..87fb54e 100644
--- a/tools/spectral_editor/style.css
+++ b/tools/spectral_editor/style.css
@@ -1,18 +1,4 @@
-/* Spectral Brush Editor Styles */
-
-* {
- margin: 0;
- padding: 0;
- box-sizing: border-box;
-}
-
-body {
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
- background: #1e1e1e;
- color: #d4d4d4;
- overflow: hidden;
- height: 100vh;
-}
+/* Spectral Brush Editor Specific Styles */
#app {
display: flex;
@@ -20,41 +6,12 @@ body {
height: 100vh;
}
-/* Header */
-header {
- background: #252526;
- padding: 12px 20px;
- border-bottom: 1px solid #3e3e42;
- display: flex;
- justify-content: space-between;
- align-items: center;
-}
-
-header h1 {
- font-size: 18px;
- font-weight: 600;
- color: #cccccc;
-}
-
-.header-controls {
- display: flex;
- align-items: center;
- gap: 15px;
-}
-
-.file-info {
- font-size: 13px;
- color: #858585;
-}
-
-/* Main content area */
.main-content {
display: flex;
flex: 1;
overflow: hidden;
}
-/* Canvas container (80% width) */
.canvas-container {
flex: 1;
position: relative;
@@ -89,7 +46,6 @@ header h1 {
display: none;
}
-/* Mini spectrum viewer (bottom-right overlay) */
.spectrum-viewer {
position: absolute;
bottom: 10px;
@@ -99,12 +55,8 @@ header h1 {
background: rgba(30, 30, 30, 0.9);
border: 1px solid #3e3e42;
border-radius: 3px;
- display: block; /* Always visible */
- pointer-events: none; /* Don't interfere with mouse events */
-}
-
-.spectrum-viewer.active {
- display: block; /* Keep for backward compatibility */
+ display: block;
+ pointer-events: none;
}
#spectrumCanvas {
@@ -123,7 +75,6 @@ header h1 {
color: #858585;
}
-/* Toolbar (20% width) */
.toolbar {
width: 250px;
background: #252526;
@@ -155,16 +106,6 @@ header h1 {
transition: background 0.2s;
}
-.btn-toolbar:hover {
- background: #1177bb;
-}
-
-.btn-toolbar:disabled {
- background: #3e3e42;
- color: #858585;
- cursor: not-allowed;
-}
-
.btn-toolbar.btn-danger {
background: #a82d2d;
}
@@ -199,7 +140,6 @@ header h1 {
border-color: #0e639c;
}
-/* Point info panel */
.point-info {
margin-top: 10px;
padding: 10px;
@@ -224,7 +164,6 @@ header h1 {
font-family: monospace;
}
-/* Control panel (bottom) */
.control-panel {
background: #252526;
border-top: 1px solid #3e3e42;
@@ -314,16 +253,6 @@ header h1 {
transition: background 0.2s;
}
-.btn-playback:hover:not(:disabled) {
- background: #1177bb;
-}
-
-.btn-playback:disabled {
- background: #3e3e42;
- color: #858585;
- cursor: not-allowed;
-}
-
.btn-playback kbd {
background: rgba(255, 255, 255, 0.1);
padding: 2px 5px;
@@ -331,7 +260,6 @@ header h1 {
font-size: 11px;
}
-/* Action bar (bottom) */
.action-bar {
background: #2d2d30;
border-top: 1px solid #3e3e42;
@@ -365,11 +293,6 @@ header h1 {
border-color: #0e639c;
}
-.btn-action:disabled {
- color: #858585;
- cursor: not-allowed;
-}
-
.btn-primary {
padding: 6px 16px;
background: #0e639c;
@@ -381,17 +304,11 @@ header h1 {
transition: background 0.2s;
}
-.btn-primary:hover {
- background: #1177bb;
-}
-
-/* Icon styling */
.icon {
font-size: 14px;
line-height: 1;
}
-/* Modal */
.modal {
position: fixed;
z-index: 1000;
@@ -490,7 +407,6 @@ header h1 {
color: #cccccc;
}
-/* Scrollbar styling */
::-webkit-scrollbar {
width: 10px;
height: 10px;
@@ -509,7 +425,6 @@ header h1 {
background: #4e4e52;
}
-/* Waveform intensity viewer */
.waveform-container {
position: relative;
height: 120px;
@@ -570,24 +485,9 @@ header h1 {
transition: background 0.2s;
}
-.btn-copy:hover, .btn-snap:hover {
- background: #1177bb;
-}
-
-.btn-copy:active, .btn-snap:active {
- background: #0d5a8f;
-}
-
.spectrogram-wrapper {
flex: 1;
position: relative;
overflow: hidden;
z-index: 1;
}
-
-#spectrogramCanvas {
- width: 100%;
- height: 100%;
- display: block;
- cursor: crosshair;
-}