From 29a28ce6d777f96b516a0a5bb1a0fab9598ad221 Mon Sep 17 00:00:00 2001 From: interlope Date: Tue, 2 Jun 2026 00:08:11 +0200 Subject: [PATCH] Add inline SVG icons for UI and theme picker This commit introduces a new PHP file `icons.php` that defines a set of inline SVG icons to replace the Bootstrap Icons webfont. The icons include common UI elements such as calendar, clock, folder, and tag, as well as theme picker icons like sun, moon, snow, droplet, cup, and half. The SVGs are designed to scale with existing font-size rules and are accessible via the `blowdit_icon` function. Additionally, a mapping function `blowdit_theme_icon` is provided to associate theme keys with their corresponding icon names. --- .htaccess | 38 -- css/hljs/github-dark.min.css | 10 + css/hljs/github.min.css | 10 + css/style.css | 31 +- index.php | 7 + js/blowdit.js | 30 +- js/highlight.min.js | 1213 ++++++++++++++++++++++++++++++++++ php/head.php | 12 +- php/home.php | 14 +- php/icons.php | 48 ++ php/navbar.php | 2 +- php/page.php | 8 +- 12 files changed, 1350 insertions(+), 73 deletions(-) delete mode 100644 .htaccess create mode 100644 css/hljs/github-dark.min.css create mode 100644 css/hljs/github.min.css create mode 100644 js/highlight.min.js create mode 100644 php/icons.php diff --git a/.htaccess b/.htaccess deleted file mode 100644 index cfff0b3..0000000 --- a/.htaccess +++ /dev/null @@ -1,38 +0,0 @@ -# ============================================================ -# BLOWDIT — static asset delivery (Apache) -# Scoped to the theme directory: only affects files served from -# this folder (css/js/img/fonts). Bludit's routing lives in the -# site-root .htaccess and is untouched. -# No-op on nginx / PHP's built-in server. -# ============================================================ - -# ---- Compression ---- - - AddOutputFilterByType BROTLI_COMPRESS text/css application/javascript application/json image/svg+xml application/xml - - - AddOutputFilterByType DEFLATE text/css application/javascript application/json image/svg+xml application/xml text/plain - - -# ---- Far-future caching ---- -# Safe because every asset is requested with a ?v= query string -# (see head.php / index.php), so a changed file gets a fresh URL. - - ExpiresActive On - ExpiresByType text/css "access plus 1 year" - ExpiresByType application/javascript "access plus 1 year" - ExpiresByType image/png "access plus 1 year" - ExpiresByType image/jpeg "access plus 1 year" - ExpiresByType image/gif "access plus 1 year" - ExpiresByType image/webp "access plus 1 year" - ExpiresByType image/svg+xml "access plus 1 year" - ExpiresByType image/x-icon "access plus 1 year" - ExpiresByType font/woff "access plus 1 year" - ExpiresByType font/woff2 "access plus 1 year" - - - - - Header set Cache-Control "public, max-age=31536000, immutable" - - diff --git a/css/hljs/github-dark.min.css b/css/hljs/github-dark.min.css new file mode 100644 index 0000000..03b6da8 --- /dev/null +++ b/css/hljs/github-dark.min.css @@ -0,0 +1,10 @@ +pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*! + Theme: GitHub Dark + Description: Dark theme as seen on github.com + Author: github.com + Maintainer: @Hirse + Updated: 2021-05-15 + + Outdated base version: https://github.com/primer/github-syntax-dark + Current colors taken from GitHub's CSS +*/.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#79c0ff}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-code,.hljs-comment,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c} \ No newline at end of file diff --git a/css/hljs/github.min.css b/css/hljs/github.min.css new file mode 100644 index 0000000..275239a --- /dev/null +++ b/css/hljs/github.min.css @@ -0,0 +1,10 @@ +pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*! + Theme: GitHub + Description: Light theme as seen on github.com + Author: github.com + Maintainer: @Hirse + Updated: 2021-05-15 + + Outdated base version: https://github.com/primer/github-syntax-light + Current colors taken from GitHub's CSS +*/.hljs{color:#24292e;background:#fff}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#d73a49}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#6f42c1}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#005cc5}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#032f62}.hljs-built_in,.hljs-symbol{color:#e36209}.hljs-code,.hljs-comment,.hljs-formula{color:#6a737d}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#22863a}.hljs-subst{color:#24292e}.hljs-section{color:#005cc5;font-weight:700}.hljs-bullet{color:#735c0f}.hljs-emphasis{color:#24292e;font-style:italic}.hljs-strong{color:#24292e;font-weight:700}.hljs-addition{color:#22863a;background-color:#f0fff4}.hljs-deletion{color:#b31d28;background-color:#ffeef0} \ No newline at end of file diff --git a/css/style.css b/css/style.css index bea9b8e..215bc6e 100644 --- a/css/style.css +++ b/css/style.css @@ -502,7 +502,8 @@ blockquote { color: var(--chrome-text-hover) !important; } -.navbar .nav-link .bi { +.navbar .nav-link .bi, +.navbar .nav-link .bd-icon { font-size: 1.15rem; margin-right: 0; vertical-align: -0.05em; @@ -543,7 +544,8 @@ img.nav-svg-icon { color: #ffffff !important; } -.theme-toggle .bi { +.theme-toggle .bi, +.theme-toggle .bd-icon { font-size: 1.1rem; margin-right: 0; } @@ -797,7 +799,8 @@ img.nav-svg-icon { white-space: nowrap; } -.post-list-meta .bi { +.post-list-meta .bi, +.post-list-meta .bd-icon { margin-right: 0.25rem; } @@ -865,7 +868,8 @@ img.nav-svg-icon { align-items: center; } -.metadata i { +.metadata i, +.metadata .bd-icon { color: var(--text-muted); margin-right: 0.35rem; } @@ -896,12 +900,14 @@ img.nav-svg-icon { text-decoration: none; } -.btn-primary-gradient .bi { +.btn-primary-gradient .bi, +.btn-primary-gradient .bd-icon { margin-right: 0; transition: transform 0.2s ease; } -.btn-primary-gradient:hover .bi { +.btn-primary-gradient:hover .bi, +.btn-primary-gradient:hover .bd-icon { transform: translateX(3px); } @@ -928,7 +934,8 @@ img.nav-svg-icon { transition: all 0.2s ease; } -.taxonomy-badge .bi { +.taxonomy-badge .bi, +.taxonomy-badge .bd-icon { margin-right: 0.35rem; font-size: 0.85em; } @@ -1207,10 +1214,18 @@ footer.footer-modern a:hover { /* ======================================== ICON SPACING ======================================== */ -.bi { +.bi, +.bd-icon { margin-right: 0.4rem; } +/* Inline SVG icons: sized to 1em via their width/height attrs, aligned like + the old icon font, and never shrink inside flex rows. */ +.bd-icon { + vertical-align: -0.125em; + flex: 0 0 auto; +} + /* ======================================== TABBED CODE BLOCKS (```tabs fences) ======================================== */ diff --git a/index.php b/index.php index 6b4032d..a88010d 100644 --- a/index.php +++ b/index.php @@ -1,4 +1,8 @@