edu/card-layouts
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: compact Neovim toolbar controls

Browse Source
This commit is contained in:
user
2026-07-17 08:05:06 +02:00
parent 94e77f1abf
commit b8b122abb9
2 changed files with 103 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
react/src/main.tsx
+50 -39
View File
@@ -298,13 +298,61 @@ function Topbar({
</div>
</details>
<div className="topbar-nvim-section" aria-label="Panel Neovima">
<span className="nvim-toolbar-boundary" aria-hidden="true">|</span>
<span className="nvim-toolbar-context">NVIM</span>
<div className="nvim-toolbar-actions" aria-label="Narzędzia okna Neovima">
<button
className="viewer-nvim-toggle"
className="viewer-nvim-toggle nvim-toolbar-button"
aria-label={nvimVisible ? "Alt+1: ukryj Neovim" : "Alt+1: pokaż Neovim"}
title={nvimVisible ? "Alt+1 · Ukryj Neovim" : "Alt+1 · Pokaż Neovim"}
aria-pressed={nvimVisible}
onClick={() => setNvimVisible(!nvimVisible)}
>
{nvimVisible ? "Alt+1 · Ukryj Neovim" : "Alt+1 · Pokaż Neovim"}
<kbd className="nvim-toolbar-key">A1</kbd><span className="nvim-toolbar-label">PANEL</span>
</button>
<button
type="button"
className={`nvim-control-indicator nvim-toolbar-button${nvimSummary.syncMode ? " is-active" : ""}${nvimSummary.syncReady ? " is-engaged" : ""}`}
aria-label={`Alt+2: synchronizacja ${nvimSyncMode ? "włączona" : "wyłączona"}`}
title={`Alt+2 · SYNC ${nvimSyncMode ? "ON" : "OFF"}`}
aria-pressed={nvimSyncMode}
onClick={() => setNvimSyncMode(!nvimSyncMode)}
>
<kbd className="nvim-toolbar-key">A2</kbd><span className="nvim-toolbar-label">SYNC</span>
</button>
<button
type="button"
className={`nvim-work-indicator nvim-toolbar-button${nvimControlMode ? " is-active" : ""}${nvimSummary.controlEnabled ? " is-engaged" : ""}`}
aria-label={`Alt+3: sterowanie ${!nvimSyncMode ? "niedostępne" : nvimControlMode ? "włączone" : "wyłączone"}`}
title={!nvimSyncMode ? "Alt+3 · Sterowanie wymaga SYNC ON" : `Alt+3 · Sterowanie ${nvimControlMode ? "ON" : "OFF"}`}
aria-pressed={nvimControlMode}
disabled={!nvimSyncMode}
onClick={() => setNvimControlMode(!nvimControlMode)}
>
<kbd className="nvim-toolbar-key">A3</kbd><span className="nvim-toolbar-label">CTRL</span>
</button>
<button
type="button"
className={`nvim-height-toggle nvim-toolbar-button${nvimExpanded ? " is-active" : ""}`}
aria-label={`Alt+4: ${nvimExpanded ? "przywróć normalną wysokość" : "ustaw wysoki panel"}`}
title={nvimExpanded ? "Alt+4 · Normalna wysokość" : "Alt+4 · Wysoki panel 90%"}
aria-pressed={nvimExpanded}
onClick={() => setNvimExpanded(!nvimExpanded)}
>
<kbd className="nvim-toolbar-key">A4</kbd><span className="nvim-toolbar-label">HIGH</span>
</button>
<button
type="button"
className={`nvim-height-toggle nvim-toolbar-button${nvimFit ? " is-active" : ""}`}
aria-label={`Alt+5: automatyczne dopasowanie ${nvimFit ? "włączone" : "wyłączone"}`}
title={nvimFit ? "Alt+5 · Wyłącz auto-fit" : "Alt+5 · Pokaż cały Neovim"}
aria-pressed={nvimFit}
onClick={() => setNvimFit(!nvimFit)}
>
<kbd className="nvim-toolbar-key">A5</kbd><span className="nvim-toolbar-label">FIT</span>
</button>
</div>
<span className="nvim-toolbar-boundary" aria-hidden="true">|</span>
{nvimVisible && (
<>
<span className={`nvim-status nvim-status--${nvimSummary.state}`}>
@@ -314,43 +362,6 @@ function Topbar({
<strong>{nvimSummary.instance ?? "Neovim MCP"}</strong>
{nvimSummary.detail && <small>{nvimSummary.detail}</small>}
</span>
<button
type="button"
className={`nvim-control-indicator${nvimSummary.syncMode ? " is-active" : ""}${nvimSummary.syncReady ? " is-engaged" : ""}`}
aria-pressed={nvimSyncMode}
onClick={() => setNvimSyncMode(!nvimSyncMode)}
>
{nvimSyncMode ? "Alt+2 · SYNC ON" : "Alt+2 · SYNC OFF"}
</button>
<button
type="button"
className={`nvim-work-indicator${nvimControlMode ? " is-active" : ""}${nvimSummary.controlEnabled ? " is-engaged" : ""}`}
aria-pressed={nvimControlMode}
disabled={!nvimSyncMode}
onClick={() => setNvimControlMode(!nvimControlMode)}
>
{!nvimSyncMode
? "Alt+3 · STEROWANIE NIEDOSTĘPNE"
: nvimControlMode
? "Alt+3 · STEROWANIE ON"
: "Alt+3 · STEROWANIE OFF"}
</button>
<button
type="button"
className={`nvim-height-toggle${nvimExpanded ? " is-active" : ""}`}
aria-pressed={nvimExpanded}
onClick={() => setNvimExpanded(!nvimExpanded)}
>
{nvimExpanded ? "Alt+4 · NORMALNA WYSOKOŚĆ" : "Alt+4 · WYSOKI PANEL"}
</button>
<button
type="button"
className={`nvim-height-toggle${nvimFit ? " is-active" : ""}`}
aria-pressed={nvimFit}
onClick={() => setNvimFit(!nvimFit)}
>
{nvimFit ? "Alt+5 · AUTO-FIT OFF" : "Alt+5 · POKAŻ CAŁY NVIM"}
</button>
<span className="nvim-shortcut-strip" aria-label="Skróty panelu Neovima">
<kbd>Alt+W</kbd> okna · <kbd>F12</kbd> skróty
</span>
react/src/react.css
+48
View File
@@ -69,6 +69,41 @@
min-width: 0;
gap: 6px;
}
.nvim-toolbar-boundary {
flex: none;
color: #6f7d83;
font: 700 14px/1 ui-monospace, monospace;
}
.nvim-toolbar-context {
flex: none;
width: 5ch;
color: #263238;
font: 800 12px/1 ui-monospace, monospace;
letter-spacing: .08em;
text-align: center;
}
.nvim-toolbar-actions {
display: flex;
align-items: center;
gap: 3px;
}
.nvim-toolbar-button {
display: inline-flex;
align-items: center;
}
.nvim-toolbar-key {
flex: 0 0 2ch;
color: #267697;
font: inherit;
text-align: center;
}
.nvim-toolbar-label {
flex: 0 0 5ch;
max-width: 5ch;
overflow: hidden;
text-align: left;
white-space: nowrap;
}
.topbar-nvim-meta {
display: flex;
align-items: baseline;
@@ -206,6 +241,19 @@
background: #eaf6fb;
color: #174d64;
}
.topbar-nvim-section .nvim-toolbar-button {
flex: 0 0 9.5ch;
width: 9.5ch;
min-width: 9.5ch;
max-width: 9.5ch;
height: 24px;
box-sizing: border-box;
justify-content: flex-start;
gap: .55ch;
padding: 2px .55ch;
font: 750 12px/1 ui-monospace, monospace;
letter-spacing: 0;
}
.nvim-shortcut-strip {
flex: none;
color: #536168;