diff options
Diffstat (limited to 'frontend-vanilla/src')
| -rw-r--r-- | frontend-vanilla/src/main.test.ts | 2 | ||||
| -rw-r--r-- | frontend-vanilla/src/main.ts | 3 | ||||
| -rw-r--r-- | frontend-vanilla/src/style.css | 38 |
3 files changed, 25 insertions, 18 deletions
diff --git a/frontend-vanilla/src/main.test.ts b/frontend-vanilla/src/main.test.ts index d5681b8..7cae34b 100644 --- a/frontend-vanilla/src/main.test.ts +++ b/frontend-vanilla/src/main.test.ts @@ -62,7 +62,7 @@ describe('main application logic', () => { renderLayout(); expect(document.getElementById('sidebar')).not.toBeNull(); expect(document.getElementById('content-area')).not.toBeNull(); - expect(document.getElementById('logo-link')).not.toBeNull(); + expect(document.getElementById('sidebar-toggle-btn')).not.toBeNull(); }); it('renderFeeds should populate feed list', () => { diff --git a/frontend-vanilla/src/main.ts b/frontend-vanilla/src/main.ts index f545285..93bee63 100644 --- a/frontend-vanilla/src/main.ts +++ b/frontend-vanilla/src/main.ts @@ -29,9 +29,6 @@ export function renderLayout() { <button class="sidebar-toggle" id="sidebar-toggle-btn" title="Toggle Sidebar">🐱</button> <div class="sidebar-backdrop" id="sidebar-backdrop"></div> <aside class="sidebar" id="sidebar"> - <div class="sidebar-header"> - <div id="logo-link" class="sidebar-logo">🐱</div> - </div> <div class="sidebar-search"> <input type="search" id="search-input" placeholder="Search..." value="${store.searchQuery}"> </div> diff --git a/frontend-vanilla/src/style.css b/frontend-vanilla/src/style.css index a97f443..d5c1b2d 100644 --- a/frontend-vanilla/src/style.css +++ b/frontend-vanilla/src/style.css @@ -30,7 +30,14 @@ body { color: var(--text-color); height: 100vh; width: 100%; + max-width: 100vw; overflow: hidden; + /* Restore explicit hidden for app-shell feel */ +} + +html { + overflow-x: hidden; + max-width: 100vw; } #app { @@ -66,17 +73,7 @@ body { border-right-color: rgba(255, 255, 255, 0.05); } -.sidebar-header { - margin-bottom: 2rem; - display: flex; - justify-content: center; -} - -.sidebar-logo { - font-size: 3rem; - cursor: pointer; - user-select: none; -} +/* Sidebar Header Removed */ .sidebar-search { margin-bottom: 2rem; @@ -392,13 +389,24 @@ body { word-break: break-word; } -.item-description img { +.item-description img, +.item-description video, +.item-description pre { max-width: 100%; height: auto; display: block; margin: 1rem 0; } +.item-description pre { + white-space: pre-wrap; + word-wrap: break-word; + overflow-x: auto; + background: rgba(0, 0, 0, 0.05); + padding: 1em; + border-radius: 4px; +} + .scrape-btn { background: var(--bg-color); border: 1px solid var(--border-color, #ccc); @@ -483,6 +491,7 @@ button.active { background-color: #224; border-color: var(--accent-color); } + .add-feed-form { display: flex; gap: 0.5rem; @@ -514,7 +523,8 @@ button.active { color: var(--text-color); } -.data-actions button, .data-actions .button { +.data-actions button, +.data-actions .button { display: inline-block; text-align: center; width: 100%; @@ -522,4 +532,4 @@ button.active { label.button { cursor: pointer; -} +}
\ No newline at end of file |
