Skip to content

feat: new icons + sidebar UI overhaul + CSP fix#3

Merged
heznpc merged 4 commits intomainfrom
feat/sidebar-ui-overhaul
Mar 5, 2026
Merged

feat: new icons + sidebar UI overhaul + CSP fix#3
heznpc merged 4 commits intomainfrom
feat/sidebar-ui-overhaul

Conversation

@heznpc
Copy link
Copy Markdown
Owner

@heznpc heznpc commented Mar 5, 2026

What does this PR do?

AI Tutor 사이드바 UI 전면 개선, i18n 코드 간소화, CSP 보안 수정, 아이콘 교체, 다국어 README 업데이트

Type of Change

  • 🐛 Bug fix
  • ✨ New feature
  • 🌍 Translation/i18n
  • 📝 Documentation
  • 🔧 Refactoring
  • 🎨 UI/Style

Testing

  • Tested on anthropic.skilljar.com
  • Extension loads without errors
  • No console errors in DevTools
  • Tested in target language (if i18n change)

Screenshots (if UI change)

Changes

UI (content.css / content.js)

  • Flat header layout (44px), unified hover styles (rgba)
  • Text send button (pill shape) replacing SVG circle
  • SVG chevron for history back button (replaces ‹ character)
  • Subtle language select chip (no border, 24px, rounded)
  • FAB repositioned to bottom: 24px
  • Footer removed
  • Fix: all: unset causing entire header to act as close button

Code Quality

  • Extract t(map, lang?) i18n helper function
  • Add SEND_LABELS, ASK_TUTOR_LABELS, QUOTE_PLACEHOLDERS maps
  • Rename updateTutorGreetingupdateLocalizedLabels

Security

  • Remove unsafe-inline from bridge.html CSP (Chrome Web Store compliance)

Assets & Docs

  • Update extension icons (icon16/32/48/128)
  • Update all 6 language READMEs (KO, JA, ZH-CN, ES, FR, DE)

heznpc and others added 4 commits March 4, 2026 21:55
Replace placeholder icons with the official SkillBridge logo
(bridge + sun design) in 16px, 48px, and 128px sizes for
Chrome extension and Web Store listing.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Remove speech bubble icon from header, replace with history btn
- Move history button to left side of header for better flow
- Fix language select and close button vertical alignment
- Replace fill-based send icon with stroke arrow for visibility
- Tighten header padding and button sizing for consistent look
- Add "Built with Claude Code" note to README Tech Stack section

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Sidebar UI improvements:
- Flat header layout with consistent 44px height
- Text send button (pill shape) replacing SVG circle
- Unified hover styles (rgba) across all interactive elements
- SVG chevron for history back button (replaces ‹ character)
- Explicit button resets instead of `all: unset` (fixes click area bug)
- Subtle language select chip (no border, 24px, rounded)
- FAB repositioned to bottom: 24px
- Footer removed

Code simplification:
- Extract t(map, lang?) i18n helper function
- Add SEND_LABELS, ASK_TUTOR_LABELS, QUOTE_PLACEHOLDERS maps
- Rename updateTutorGreeting → updateLocalizedLabels

Docs:
- Update all 6 language READMEs (KO, JA, ZH-CN, ES, FR, DE)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Remove 'unsafe-inline' from Content-Security-Policy to pass Chrome
Web Store review. Puter.js and bridge.js are already loaded as
separate source files, so inline scripts are not needed.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@heznpc heznpc merged commit 99fa943 into main Mar 5, 2026
2 checks passed
@heznpc heznpc deleted the feat/sidebar-ui-overhaul branch March 5, 2026 01:08
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.

1 participant