amitwh/markdown-converter
1
0
Fork 0
mirror of https://github.com/amitwh/markdown-converter.git synced 2026-08-02 10:00:17 +05:30
Code Issues Packages Projects Releases Wiki Activity

feat: wire up sidebar panels and REPL with IPC handlers, preload channels, and CSS

Browse Source
This commit is contained in:
amitwh
2026-03-04 16:17:38 +05:30
parent 59ef2028f8
commit d3afd7ad86
6 changed files with 381 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles.css
+37
View File
@@ -290,6 +290,43 @@ body {
line-height: 1.6;
}
/* Bottom Panel (REPL Output) */
.bottom-panel { display: flex; flex-direction: column; border-top: 1px solid var(--gray-200, #e5e7eb); flex-shrink: 0; }
.bottom-panel.collapsed { height: 0; overflow: hidden; border: none; }
.bottom-panel:not(.collapsed) { height: 200px; }
.bottom-panel-header { display: flex; justify-content: space-between; align-items: center; padding: 6px 12px; background: var(--gray-50, #f9fafb); border-bottom: 1px solid var(--gray-200); }
.bottom-panel-title { font-size: 13px; font-weight: 600; color: var(--gray-600); }
.bottom-panel-actions { display: flex; gap: 4px; }
.bottom-panel-btn { font-size: 12px; padding: 4px 8px; border: 1px solid var(--gray-300); border-radius: 4px; background: white; cursor: pointer; }
.bottom-panel-content { flex: 1; overflow-y: auto; padding: 12px; font-family: 'JetBrains Mono', monospace; font-size: 13px; background: #1e1e1e; color: #d4d4d4; }
.repl-entry { margin-bottom: 8px; }
.repl-command { color: #569cd6; margin-bottom: 2px; }
.repl-stdout { color: #d4d4d4; white-space: pre-wrap; }
.repl-stderr { color: #f44747; white-space: pre-wrap; }
.repl-error { color: #f44747; }
/* Code Run Button */
.code-run-btn {
position: absolute;
top: 6px;
right: 6px;
padding: 4px 10px;
font-size: 12px;
background: var(--primary-dark, #5661b3);
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
opacity: 0;
transition: opacity 0.2s;
}
pre:hover .code-run-btn { opacity: 1; }
/* Dark theme bottom panel */
body[class*="dark"] .bottom-panel-header { background: #1e1e1e; border-color: #333; }
body[class*="dark"] .bottom-panel-btn { background: #2d2d2d; border-color: #444; color: #ccc; }
body[class*="dark"] .bottom-panel-title { color: #ccc; }
/* Status Bar */
.status-bar {
display: flex;