Feat/refresh readme banner#13
Open
mocasus wants to merge 4 commits into
Open
Conversation
Banner sekarang match dengan desain dashboard baru: Visual changes: - Background ganti ke #0a0e1a dengan grid pattern subtle (sama seperti dashboard) plus ambient glow cyan + violet di kiri/kanan - Bot icon: rounded square frame dengan brand gradient + Lucide-style bot icon line art (sama seperti header dashboard di /admin) - Wordmark split: 'bot' putih-slate gradient + 'not' cyan-violet gradient (sama dengan header dashboard 'bot' + 'not' split) - Eyebrow tag dengan animated cyan dot — 'Auto-order · QRIS · ID' - Tagline lebih ringkas: 'Telegram + Discord bot — pelanggan scan QR, produk auto-deliver.' - 5 feature pills dengan icon mini Lucide-style: - Telegram (cyan) - Discord (violet) - KlikQRIS (emerald, QR icon) - Auto-deliver (amber, lightning) - Dashboard (pink, bar chart) - Dekorasi sparkles random di sudut-sudut Technical: - Inter font family (sama dengan UI) - Width 1280, tinggi 360 (sebelumnya 320, +40px untuk akomodasi pills) - Border 1px white/6 untuk subtle frame - Halo glow di belakang icon untuk depth
GitHub renders SVG via <img> tag using strict XML parsing. HTML entities like · and — are not valid in SVG XML (only &, <, >, ", ' are predefined) and triggered 'Error rendering embedded code: Invalid image source.' on GitHub. Fixes: - Replace · with literal · (U+00B7) - Replace — with literal — (U+2014) - Replace & in aria-label with 'and' (some sanitizers strip it) - Remove <animate> on the eyebrow dot — GitHub <img> rendering strips animation anyway and an empty self-closing element is cleaner Validated with python xml.etree.ElementTree — parses as valid XML.
Previous version still didn't render even after removing HTML entities. Likely culprit: GitHub's camo image proxy strips or breaks complex SVG features when serving via img tag. Removed potentially problematic features: - filter with feGaussianBlur (replaced with stacked rects + opacity) - pattern grid background (just solid gradient now) - radialGradient (replaced with simple ellipse + opacity) - Custom Inter font reference (system-ui fallback chain only) Replaced HTML entities with numeric XML entities: - middot -> #183 - mdash -> #8212 (numeric entities are universally valid in XML) Also simplified pill icons (text-only with consistent padding) to keep file under 4KB and reduce parsing risk. File now: ~3KB, 50 elements, no filters/patterns/scripts. Validated as valid XML.
The original logo.svg (rendered fine) used a specific structure that I deviated from. This restores the exact same structural pattern (linearGradient + pattern + filter, mascot bot icon, wordmark, chips) that GitHub camo proxy is proven to handle, just with updated content: Visual changes vs the prior original: - Background gradient: 0b1020 to 1a1438 -> 0a0e1a to 15192e (matches new dashboard background) - Wordmark split: 'bot' in white-slate gradient + 'not' in cyan-violet (consistent with dashboard header that uses same split) - Tagline updated: 'Telegram & Discord auto-order bot - pelanggan scan QR, produk auto-deliver.' - Chip labels changed from tech stack (TypeScript/Prisma/QRIS/Fastify) to features (Telegram/Discord/KlikQRIS/Auto-deliver/Dashboard) - 5 chips instead of 4 Cache busting: - Also save as assets/banner.svg (new filename) - Update README to use banner.svg instead of logo.svg - This forces GitHub camo to fetch fresh content (any cached broken version of /assets/logo.svg won't be hit) - Old logo.svg also updated for consistency (kept for backward compat) Validated: 56 elements, 4.1KB, valid XML.
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary by CodeRabbit