Full document, spreadsheet, slideshow, and diagram tooling
Merge pull request 'fix: hidden rows at grid start unreachable + improve hide/unhide indicators' (#97) from fix/hidden-rows-unhide into main
+30
-13
+13
-13
src/css/app.css
+13
-13
src/css/app.css
···
1738
1738
}
1739
1739
1740
1740
/* Hidden row/column indicators */
1741
-
.hidden-row-indicator { height: 6px; }
1741
+
.hidden-row-indicator { height: 12px; }
1742
1742
.hidden-row-indicator td { padding: 0 !important; border: none !important; }
1743
1743
.hidden-row-indicator-line {
1744
-
height: 4px;
1744
+
height: 6px;
1745
1745
background: var(--color-teal);
1746
-
opacity: 0.5;
1746
+
opacity: 0.6;
1747
1747
cursor: pointer;
1748
-
border-radius: 2px;
1748
+
border-radius: 3px;
1749
1749
transition: opacity 150ms ease, height 150ms ease;
1750
1750
position: relative;
1751
1751
}
1752
1752
.hidden-row-indicator-line:hover {
1753
-
opacity: 0.85;
1754
-
height: 6px;
1753
+
opacity: 1;
1754
+
height: 10px;
1755
1755
}
1756
1756
.hidden-row-indicator-line::after {
1757
1757
content: 'Click to unhide';
···
1780
1780
.hidden-col-indicator {
1781
1781
position: absolute;
1782
1782
top: 0;
1783
-
right: -4px;
1784
-
width: 8px;
1783
+
right: -6px;
1784
+
width: 12px;
1785
1785
height: 100%;
1786
1786
cursor: pointer;
1787
1787
z-index: 6;
···
1790
1790
justify-content: center;
1791
1791
}
1792
1792
.hidden-col-indicator-bar {
1793
-
width: 4px;
1793
+
width: 6px;
1794
1794
height: 100%;
1795
1795
background: var(--color-teal);
1796
-
opacity: 0.5;
1797
-
border-radius: 2px;
1796
+
opacity: 0.6;
1797
+
border-radius: 3px;
1798
1798
transition: opacity 150ms ease, width 150ms ease;
1799
1799
}
1800
1800
.hidden-col-indicator:hover .hidden-col-indicator-bar {
1801
-
opacity: 0.85;
1802
-
width: 6px;
1801
+
opacity: 1;
1802
+
width: 8px;
1803
1803
}
1804
1804
.hidden-col-indicator::after {
1805
1805
content: 'Click to unhide';
+17
src/sheets/main.ts
+17
src/sheets/main.ts
···
472
472
// Find & replace match state for highlighting
473
473
const findActive = sheetsFindState.matches.length > 0;
474
474
475
+
// If rows at the very start are hidden, insert indicator before the first visible row
476
+
if (rowIndicatorMap.has(0)) {
477
+
const count = rowIndicatorMap.get(0);
478
+
tbodyHtml += '<tr class="hidden-row-indicator hidden-row-indicator-top" title="' + count + ' hidden row' + (count > 1 ? 's' : '') + '"><td colspan="' + (colCount + 1) + '"><div class="hidden-row-indicator-line"></div></td></tr>';
479
+
}
480
+
475
481
for (const r of allRowsToRender) {
476
482
const rowH = rh(r);
477
483
tbodyHtml += '<tr style="height:' + rowH + 'px">';
···
1033
1039
const row = parseInt(lastTh.dataset.row);
1034
1040
unhideAdjacentRows(row);
1035
1041
showToast('Rows unhidden');
1042
+
}
1043
+
} else {
1044
+
// Indicator at the very top — hidden rows start from row 1.
1045
+
// Find the first visible row after the indicator and unhide rows above it.
1046
+
const nextRow = indicatorRow?.nextElementSibling;
1047
+
if (nextRow) {
1048
+
const firstTh = nextRow.querySelector('th[data-row]');
1049
+
if (firstTh) {
1050
+
unhideAdjacentRows(parseInt(firstTh.dataset.row));
1051
+
showToast('Rows unhidden');
1052
+
}
1036
1053
}
1037
1054
}
1038
1055
return;