Skip to content

Conversation

Copy link

Copilot AI commented Jan 4, 2026

The compilation progress section displays all SSE events expanded, forcing users to scroll past event logs to reach download/copy buttons. Event output is also hard to read with small text and minimal visual distinction.

Changes

Progress Section

  • Collapsed by default with clickable header to toggle visibility
  • Preserves user's expand/collapse preference across compilations
  • Smooth CSS transitions with visual indicator (▼ rotates to ▶)
  • Responsive max-height (50vh) instead of fixed pixel value

Event Log Readability

  • Font size: 0.85rem → 0.9rem
  • Padding: 8px → 10px, margin: 4px → 6px
  • Color-coded left borders by log type (blue/info, yellow/warning, red/error, green/success)
  • Line height: 1.5 for improved text flow

Examples

  • Updated to use real, working filter list URLs (AdGuard DNS, EasyList)
  • Replaced placeholder example.com URLs with functional endpoints
  • Added practical exclusions (github.com, stackoverflow.com)

Accessibility

  • ARIA attributes: role="button", aria-expanded, aria-controls, aria-label
  • Keyboard navigation: Enter/Space to toggle
  • Screen reader friendly: decorative elements marked aria-hidden

Screenshots

Before: Event logs always expanded, requiring scroll to buttons
After: Collapsed by default, buttons immediately visible

Clean UI - Progress Collapsed

Progress section collapsed
Collapsed State

Progress section expanded - improved readability
Expanded State

Original prompt

Collapse the compiler SSE events on the website by default, otherwise the user has to scroll a long way to get to the download/copy to clipboard buttons. Also, make the event output easier to read


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

…update examples

Co-authored-by: jaypatrick <1800595+jaypatrick@users.noreply.github.com>
@cloudflare-workers-and-pages
Copy link

cloudflare-workers-and-pages bot commented Jan 4, 2026

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Updated (UTC)
✅ Deployment successful!
View logs
adblock-compiler b71c82d Jan 04 2026, 03:21 AM

Copilot AI and others added 6 commits January 4, 2026 03:12
Co-authored-by: jaypatrick <1800595+jaypatrick@users.noreply.github.com>
Co-authored-by: jaypatrick <1800595+jaypatrick@users.noreply.github.com>
…-label

Co-authored-by: jaypatrick <1800595+jaypatrick@users.noreply.github.com>
Co-authored-by: jaypatrick <1800595+jaypatrick@users.noreply.github.com>
Co-authored-by: jaypatrick <1800595+jaypatrick@users.noreply.github.com>
Co-authored-by: jaypatrick <1800595+jaypatrick@users.noreply.github.com>
@jaypatrick jaypatrick marked this pull request as ready for review January 4, 2026 03:22
Copilot AI changed the title [WIP] Collapse compiler SSE events by default for better accessibility Collapse SSE event logs by default and improve readability Jan 4, 2026
Copilot AI requested a review from jaypatrick January 4, 2026 03:23
@jaypatrick jaypatrick merged commit 5890c0b into master Jan 4, 2026
8 checks passed
@jaypatrick jaypatrick deleted the copilot/collapse-compiler-sse-events branch January 4, 2026 03:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants