From b20f717288875e533466ad32ba4930f35015c655 Mon Sep 17 00:00:00 2001 From: zzstoatzz Date: Mon, 6 Oct 2025 12:17:33 -0500 Subject: [PATCH] feat: improve mobile ux and record display MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - fix @ symbol positioning: larger (1.2rem) and better aligned with handle - add structured record display with headers and content sections - add copy button to each record with visual feedback - improve mobile responsiveness for identity circle and records 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- src/templates.rs | 127 ++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 114 insertions(+), 13 deletions(-) diff --git a/src/templates.rs b/src/templates.rs index 2f825a3..d31179c 100644 --- a/src/templates.rs +++ b/src/templates.rs @@ -297,18 +297,29 @@ pub fn app_page(did: &str) -> String { }} .identity-label {{ - font-size: 0.45rem; - color: var(--text-lighter); - letter-spacing: 0.1em; + font-size: 1.2rem; + color: var(--text); + font-weight: 600; + line-height: 1; }} .identity-value {{ - font-size: 0.75rem; - color: var(--text); + font-size: 0.7rem; + color: var(--text-lighter); text-align: center; word-break: break-word; max-width: 100px; - font-weight: 500; + font-weight: 400; + }} + + @media (max-width: 768px) {{ + .identity-label {{ + font-size: 1.1rem; + }} + + .identity-value {{ + font-size: 0.65rem; + }} }} .identity-hint {{ @@ -485,7 +496,6 @@ pub fn app_page(did: &str) -> String { }} .record {{ - padding: 0.6rem; margin-bottom: 0.5rem; background: var(--bg); border: 1px solid var(--border); @@ -493,6 +503,7 @@ pub fn app_page(did: &str) -> String { font-size: 0.65rem; color: var(--text-light); transition: all 0.15s ease; + overflow: hidden; }} .record:hover {{ @@ -504,11 +515,55 @@ pub fn app_page(did: &str) -> String { margin-bottom: 0; }} - .record pre {{ + .record-header {{ + display: flex; + justify-content: space-between; + align-items: center; + padding: 0.5rem 0.6rem; + background: var(--surface); + border-bottom: 1px solid var(--border); + }} + + .record-label {{ + font-size: 0.6rem; + color: var(--text-lighter); + font-weight: 500; + }} + + .copy-btn {{ + background: var(--bg); + border: 1px solid var(--border); + color: var(--text-light); + font-family: inherit; + font-size: 0.55rem; + padding: 0.2rem 0.5rem; + cursor: pointer; + transition: all 0.15s ease; + border-radius: 2px; + -webkit-tap-highlight-color: transparent; + }} + + .copy-btn:hover, .copy-btn:active {{ + background: var(--surface-hover); + border-color: var(--text-light); + color: var(--text); + }} + + .copy-btn.copied {{ + color: var(--text); + border-color: var(--text); + }} + + .record-content {{ + padding: 0.6rem; + }} + + .record-content pre {{ margin: 0; white-space: pre-wrap; word-break: break-word; line-height: 1.5; + font-size: 0.625rem; }} .load-more {{ @@ -797,9 +852,20 @@ pub fn app_page(did: &str) -> String { .then(data => {{ if (data.records && data.records.length > 0) {{ let recordsHtml = ''; - data.records.forEach(record => {{ + data.records.forEach((record, idx) => {{ const json = JSON.stringify(record.value, null, 2); - recordsHtml += `
${{json}}
`; + const recordId = `record-${{Date.now()}}-${{idx}}`; + recordsHtml += ` +
+
+ record + +
+
+ 
${{json}}
+
+
+ `; }}); if (data.cursor) {{ @@ -808,8 +874,32 @@ pub fn app_page(did: &str) -> String { recordListDiv.innerHTML = recordsHtml; - // Use event delegation for load more buttons + // Use event delegation for copy and load more buttons recordListDiv.addEventListener('click', (e) => {{ + // Handle copy button + if (e.target.classList.contains('copy-btn')) {{ + e.stopPropagation(); + const copyBtn = e.target; + const content = decodeURIComponent(copyBtn.dataset.content); + + navigator.clipboard.writeText(content).then(() => {{ + const originalText = copyBtn.textContent; + copyBtn.textContent = 'copied!'; + copyBtn.classList.add('copied'); + setTimeout(() => {{ + copyBtn.textContent = originalText; + copyBtn.classList.remove('copied'); + }}, 1500); + }}).catch(err => {{ + console.error('Failed to copy:', err); + copyBtn.textContent = 'error'; + setTimeout(() => {{ + copyBtn.textContent = 'copy'; + }}, 1500); + }}); + }} + + // Handle load more button if (e.target.classList.contains('load-more')) {{ e.stopPropagation(); const loadMoreBtn = e.target; @@ -822,9 +912,20 @@ pub fn app_page(did: &str) -> String { .then(r => r.json()) .then(moreData => {{ let moreHtml = ''; - moreData.records.forEach(record => {{ + moreData.records.forEach((record, idx) => {{ const json = JSON.stringify(record.value, null, 2); - moreHtml += `
${{json}}
`; + const recordId = `record-more-${{Date.now()}}-${{idx}}`; + moreHtml += ` +
+
+ record + +
+
+ 
${{json}}
+
+
+ `; }}); loadMoreBtn.remove(); -- 2.43.0 From 17a617927f98277cab88c7ac2d85565aa61679ac Mon Sep 17 00:00:00 2001 From: zzstoatzz Date: Mon, 6 Oct 2025 12:21:19 -0500 Subject: [PATCH] ci: add fmt and clippy linting workflows MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - fmt.yaml: checks code formatting with cargo fmt - clippy.yaml: runs clippy linter with warnings as errors - both run on push and pull_request events 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- .tangled/workflows/clippy.yaml | 15 +++++++++++++++ .tangled/workflows/fmt.yaml | 15 +++++++++++++++ 2 files changed, 30 insertions(+) create mode 100644 .tangled/workflows/clippy.yaml create mode 100644 .tangled/workflows/fmt.yaml diff --git a/.tangled/workflows/clippy.yaml b/.tangled/workflows/clippy.yaml new file mode 100644 index 0000000..c0478c2 --- /dev/null +++ b/.tangled/workflows/clippy.yaml @@ -0,0 +1,15 @@ +engine: nixery + +when: + - event: ["push", "pull_request"] + +dependencies: + nixpkgs: + - rustc + - cargo + - clippy + +steps: + - name: run clippy + command: | + cargo clippy -- -D warnings diff --git a/.tangled/workflows/fmt.yaml b/.tangled/workflows/fmt.yaml new file mode 100644 index 0000000..dfba270 --- /dev/null +++ b/.tangled/workflows/fmt.yaml @@ -0,0 +1,15 @@ +engine: nixery + +when: + - event: ["push", "pull_request"] + +dependencies: + nixpkgs: + - rustc + - cargo + - rustfmt + +steps: + - name: check formatting + command: | + cargo fmt --check -- 2.43.0 From 5f71d2e9fb0a1f30be44ed34d60f8e9614e3ef25 Mon Sep 17 00:00:00 2001 From: zzstoatzz Date: Mon, 6 Oct 2025 12:40:42 -0500 Subject: [PATCH] ci: consolidate fmt and clippy into check workflow MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit following tangled.org/core pattern where linting and testing are combined in one workflow with multiple steps 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- .tangled/workflows/{clippy.yaml => check.yaml} | 5 +++++ .tangled/workflows/fmt.yaml | 15 --------------- 2 files changed, 5 insertions(+), 15 deletions(-) rename .tangled/workflows/{clippy.yaml => check.yaml} (71%) delete mode 100644 .tangled/workflows/fmt.yaml diff --git a/.tangled/workflows/clippy.yaml b/.tangled/workflows/check.yaml similarity index 71% rename from .tangled/workflows/clippy.yaml rename to .tangled/workflows/check.yaml index c0478c2..b805074 100644 --- a/.tangled/workflows/clippy.yaml +++ b/.tangled/workflows/check.yaml @@ -7,9 +7,14 @@ dependencies: nixpkgs: - rustc - cargo + - rustfmt - clippy steps: + - name: check formatting + command: | + cargo fmt --check + - name: run clippy command: | cargo clippy -- -D warnings diff --git a/.tangled/workflows/fmt.yaml b/.tangled/workflows/fmt.yaml deleted file mode 100644 index dfba270..0000000 --- a/.tangled/workflows/fmt.yaml +++ /dev/null @@ -1,15 +0,0 @@ -engine: nixery - -when: - - event: ["push", "pull_request"] - -dependencies: - nixpkgs: - - rustc - - cargo - - rustfmt - -steps: - - name: check formatting - command: | - cargo fmt --check -- 2.43.0