From 0e63641c2a5792b9f5027c5d1d9b4586c5a532ba Mon Sep 17 00:00:00 2001 From: Silberengel Date: Thu, 19 Feb 2026 21:24:09 +0100 Subject: [PATCH] adjust responsiveness Nostr-Signature: b585b4ee5862b2593c0e469974f94b16a1a60e9f57df988cf9ed157acba1c921 573634b648634cbad10f2451776089ea21090d9407f715e83c577b4611ae6edc 7daeaea11600c77d015448d293f8d7c7500c65d87cd4b496c13ba0fa9922fe5330353a3082eb4f5b540208630e668f163981cdb5e35f027191fb6abd6d0d380f --- nostr/commit-signatures.jsonl | 1 + src/app.css | 81 +++++++++++++++++++ src/routes/repos/[npub]/[repo]/+page.svelte | 87 +++++++++++++++++---- 3 files changed, 154 insertions(+), 15 deletions(-) diff --git a/nostr/commit-signatures.jsonl b/nostr/commit-signatures.jsonl index 9d68a0a..34aab54 100644 --- a/nostr/commit-signatures.jsonl +++ b/nostr/commit-signatures.jsonl @@ -11,3 +11,4 @@ {"kind":1640,"pubkey":"573634b648634cbad10f2451776089ea21090d9407f715e83c577b4611ae6edc","created_at":1771529918,"tags":[["author","Silberengel","silberengel7@protonmail.com"],["message","get rid of settings page\nimplement transfer on cli and api"]],"content":"Signed commit: get rid of settings page\nimplement transfer on cli and api","id":"a312986953d2b408aae10a51ec29b51aca8a2e6396e5b5ec7fd969bb12c5b882","sig":"09b7bff4ce945ac120a413246a0a6111bf9afc14e570524f1e2e4f8ee8e22a2a2c71fd00fedb836e030245d3cbc1e42fcb8c5bde7c643fde2551582f63942851"} {"kind":1640,"pubkey":"573634b648634cbad10f2451776089ea21090d9407f715e83c577b4611ae6edc","created_at":1771530049,"tags":[["author","Silberengel","silberengel7@protonmail.com"],["message","update docs"]],"content":"Signed commit: update docs","id":"23e1028e3df47a06cee8aaee5da173a73d1317bc6bede818cc002fa002041175","sig":"ac48caad27206d5e1fd7fccbe6afe77ff0a7dd14d4c07b07a91caac1f91f9482960e019531fdb66025c90a4cda6ba0b570ddfe3f64eb7b979e06daeb551b1dad"} {"kind":1640,"pubkey":"573634b648634cbad10f2451776089ea21090d9407f715e83c577b4611ae6edc","created_at":1771531630,"tags":[["author","Silberengel","silberengel7@protonmail.com"],["message","bug-fixes"]],"content":"Signed commit: bug-fixes","id":"a219cd3c4055c7e77a20f464b2192dfc236059eb6b0f4717c8e9cb26b80a959f","sig":"fb9eef37d37242483dde59b9d3d96fc2a3ff9f9fb1893000327d45e3a1c73bd028b358bfbb43df19633661cc9b9c6798a76a3fc9323d2f89a3dea50fdd035f16"} +{"kind":1640,"pubkey":"573634b648634cbad10f2451776089ea21090d9407f715e83c577b4611ae6edc","created_at":1771532033,"tags":[["author","Silberengel","silberengel7@protonmail.com"],["message","fixing themes"]],"content":"Signed commit: fixing themes","id":"b415f46b54a30f022ece43f9acc4e13ffddaa56abfd6febe447a852c54ace23c","sig":"acec0d1ea91d8c77b7ac98f0837eae225eca1272d7f871c3c5ccefc744706cb933d2f20732d9a1e42dee4f978c2ca7d17d0bc4033088a8db0a39e66cf982cb62"} diff --git a/src/app.css b/src/app.css index 927344d..4af5cc5 100644 --- a/src/app.css +++ b/src/app.css @@ -209,6 +209,71 @@ a:hover { .container-wide { padding: 1rem; } + + /* Repo cards - make more responsive on mobile */ + .repo-header { + flex-direction: column; + align-items: stretch; + gap: 1rem; + } + + .repo-header-text { + flex: 1; + min-width: 0; /* Allow text to shrink */ + width: 100%; + max-width: 100%; + } + + .repo-header-text h3 { + margin: 0 0 0.5rem 0; + word-wrap: break-word; + overflow-wrap: break-word; + } + + .repo-header-text .description { + width: 100%; + max-width: 100%; + margin: 0.5rem 0; + line-height: 1.5; + word-wrap: break-word; + overflow-wrap: break-word; + } + + .repo-card-image { + align-self: flex-start; + margin-bottom: 0.5rem; + } + + .register-button { + align-self: flex-start; + margin-top: 0.5rem; + } + + .repo-actions { + flex-direction: column; + align-items: stretch; + width: 100%; + } + + .repo-actions .register-button, + .repo-actions .delete-button { + width: 100%; + text-align: center; + } + + .repo-card-content { + padding: 1rem; + } + + .clone-urls { + flex-direction: column; + gap: 0.5rem; + } + + .clone-urls code { + word-break: break-all; + display: block; + } } /* Header and Navigation */ @@ -1282,6 +1347,13 @@ pre code { color: inherit; } +.clone-urls { + display: flex; + flex-direction: column; + gap: 0.5rem; + margin-top: 1rem; +} + .clone-urls code { display: block; background: var(--bg-secondary); @@ -1292,6 +1364,8 @@ pre code { font-size: 0.875rem; color: var(--text-primary); border: 1px solid var(--border-light); + word-break: break-all; + overflow-wrap: break-word; } /* Utility classes */ @@ -1672,6 +1746,13 @@ label.filter-checkbox > span, .repo-header-text { flex: 1; + min-width: 0; /* Allow text to shrink and wrap */ +} + +.repo-header-text .description { + max-width: 100%; + word-wrap: break-word; + overflow-wrap: break-word; } .header-left { diff --git a/src/routes/repos/[npub]/[repo]/+page.svelte b/src/routes/repos/[npub]/[repo]/+page.svelte index 5e1ef23..7863c14 100644 --- a/src/routes/repos/[npub]/[repo]/+page.svelte +++ b/src/routes/repos/[npub]/[repo]/+page.svelte @@ -4721,15 +4721,47 @@ line-height: 1.3; } - /* Make tabs more compact on mobile */ + /* Make tabs more readable and responsive on mobile */ .tabs { - padding: 0.4rem 0.5rem; - gap: 0.2rem; + padding: 0.5rem 0.75rem; + gap: 0.5rem; + -webkit-overflow-scrolling: touch; + scroll-behavior: smooth; + scroll-padding: 0.5rem; + } + + .tab-button { + padding: 0.5rem 0.875rem; + font-size: 0.875rem; + font-weight: 500; + min-height: 2.5rem; + border-bottom-width: 3px; + touch-action: manipulation; /* Better touch response */ + } + + .tab-button.active { + font-weight: 600; + border-bottom-width: 3px; + } + + /* Better visual feedback for touch */ + .tab-button:active { + transform: scale(0.98); + transition: transform 0.1s ease; + } + } + + /* Extra small screens - make tabs even more readable */ + @media (max-width: 480px) { + .tabs { + padding: 0.5rem; + gap: 0.375rem; } .tab-button { - padding: 0.35rem 0.6rem; - font-size: 0.75rem; + padding: 0.625rem 0.75rem; + font-size: 0.875rem; + min-height: 2.75rem; } } @@ -5095,23 +5127,37 @@ gap: 0.5rem; font-size: 0.875rem; color: var(--text-primary); - transition: background 0.2s ease; + font-weight: 500; + transition: background 0.2s ease, color 0.2s ease; box-sizing: border-box; } .file-button:hover { background: var(--bg-tertiary); + color: var(--text-primary); } .file-item.selected .file-button { - background: var(--accent-light); - color: var(--accent); + background: var(--accent); + color: var(--accent-text, #ffffff); + font-weight: 600; + } + + .file-item.selected .file-button:hover { + background: var(--accent-hover); + color: var(--accent-text, #ffffff); } .file-size { - color: var(--text-muted); + color: var(--text-secondary); font-size: 0.75rem; margin-left: auto; + opacity: 0.9; + } + + .file-item.selected .file-size { + color: var(--accent-text, #ffffff); + opacity: 0.9; } .editor-area { @@ -5403,10 +5449,12 @@ overflow-y: hidden; scrollbar-width: thin; -webkit-overflow-scrolling: touch; + scroll-behavior: smooth; + position: relative; } .tabs::-webkit-scrollbar { - height: 4px; + height: 6px; } .tabs::-webkit-scrollbar-track { @@ -5415,30 +5463,39 @@ .tabs::-webkit-scrollbar-thumb { background: var(--border-color); - border-radius: 2px; + border-radius: 3px; + } + + .tabs::-webkit-scrollbar-thumb:hover { + background: var(--accent); } .tab-button { - padding: 0.4rem 0.75rem; + padding: 0.5rem 0.875rem; background: none; border: none; border-bottom: 2px solid transparent; cursor: pointer; - font-size: 0.8rem; - color: var(--text-muted); + font-size: 0.875rem; + color: var(--text-secondary); font-family: 'IBM Plex Serif', serif; - transition: color 0.2s ease, border-color 0.2s ease; + transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease; white-space: nowrap; flex-shrink: 0; + font-weight: 500; + border-radius: 0.25rem 0.25rem 0 0; } .tab-button:hover { color: var(--text-primary); + background: var(--bg-secondary); } .tab-button.active { color: var(--accent); border-bottom-color: var(--accent); + font-weight: 600; + background: var(--bg-secondary); } /* File tree actions */