mirror of
https://github.com/Ark0N/Codeman.git
synced 2026-10-09 00:49:41 +02:00
style(tiles): no CSS hides dividers and slots that a zoom never leaves
`.tile-grid--zoomed .tile-divider` and `.tile-grid--zoomed .tile-slot` hid elements that do not exist while a tile is zoomed: _applyTileLayout toggles the zoomed class in the same pass that syncs zero dividers and zero slots, and it is the only place either is created. Both rules are gone. The dividers test asserted the CSS rule; it now asserts what the user sees (no divider elements while zoomed, two again on restore), and tile-grid-entry-points gains the same check for the empty slot of three tiles in a 2x2. Both fail if the zoom stops removing them. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -19557,10 +19557,6 @@ html[data-session-list="sidebar"][data-sidebar="collapsed"] .btn-sidebar-toggle
|
||||
background: var(--accent, #4a9eff);
|
||||
}
|
||||
|
||||
.tile-grid.tile-grid--zoomed .tile-divider {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* While a divider drags: the resize cursor everywhere and no text selection
|
||||
(mirrors body.split-pane-resizing). */
|
||||
body.tile-grid-resizing,
|
||||
@@ -19592,10 +19588,6 @@ body.tile-grid-resizing--row * {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.tile-grid.tile-grid--zoomed .tile-slot {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* A tab dragged over a tile (replace it) or an empty slot (add it). */
|
||||
.tile.tile--drop-target,
|
||||
.tile-slot.tile--drop-target {
|
||||
|
||||
@@ -12,8 +12,6 @@
|
||||
*
|
||||
* Real code via the shared vm harness (test/mocks/tile-grid-vm.ts). Port: N/A.
|
||||
*/
|
||||
import { readFileSync } from 'node:fs';
|
||||
import { resolve } from 'node:path';
|
||||
import { beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
import {
|
||||
FakeEl,
|
||||
@@ -204,11 +202,13 @@ describe('fractions on fewer columns', () => {
|
||||
});
|
||||
|
||||
describe('zoomed', () => {
|
||||
it('shows no dividers', () => {
|
||||
it('has no dividers while a tile fills the grid, and gets them back on restore', () => {
|
||||
const app = grid(['s-a', 's-b', 's-c', 's-d']);
|
||||
const dividerEls = () => section.children.filter((el) => el.className.startsWith('tile-divider'));
|
||||
app.zoomTile('s-a');
|
||||
expect(app._tileGrid.dividers.size).toBe(0);
|
||||
const css = readFileSync(resolve(import.meta.dirname, '../src/web/public/styles.css'), 'utf8');
|
||||
expect(css).toMatch(/\.tile-grid\.tile-grid--zoomed \.tile-divider\s*\{\s*display: none;/);
|
||||
expect(dividerEls()).toHaveLength(0);
|
||||
app.zoomTile('s-a');
|
||||
expect(dividerEls()).toHaveLength(2);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -120,6 +120,15 @@ describe('dragging a tab onto an empty slot', () => {
|
||||
app.openTileGrid(['s-a', 's-b']);
|
||||
expect(slots()).toHaveLength(0);
|
||||
});
|
||||
|
||||
it('a zoomed grid has no slot; restoring the grid brings it back', () => {
|
||||
const app = makeGridApp(IDS);
|
||||
app.openTileGrid(IDS);
|
||||
app.zoomTile('s-a');
|
||||
expect(slots()).toHaveLength(0);
|
||||
app.zoomTile('s-a');
|
||||
expect(slots()).toHaveLength(1);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Ctrl/Cmd+click on a tab', () => {
|
||||
|
||||
Reference in New Issue
Block a user