feat(frontend): rename inj roles to sys-front-*, add sys-svc-cdn, cache-busting lookup

Introduce sys-svc-cdn (cdn_paths/cdn_urls/cdn_dirs) and ensure CDN directories + latest symlink.

Rename sys-srv-web-inj-* → sys-front-inj-*; update includes/templates; serve shared/per-app CSS & JS via CDN.

Add lookup_plugins/local_mtime_qs.py for mtime-based cache busting; split CSS into default.css/bootstrap.css + optional per-app style.css.

CSP: use style-src-elem; drop unsafe-inline for styles. Services: fix SYS_SERVICE_ALL_ENABLED bool and controlled flush.

BREAKING CHANGE: role names changed; replace includes and references accordingly.

Conversation: https://chatgpt.com/share/68b55494-9ec4-800f-b559-44707029141d
This commit is contained in:
2025-09-01 10:10:23 +02:00
parent 3f8e7c1733
commit 231fd567b3
123 changed files with 1789 additions and 1393 deletions

View File

@@ -3,7 +3,7 @@ server {
{% include 'roles/srv-letsencrypt/templates/ssl_header.j2' %}
{% include 'roles/sys-srv-web-inj-compose/templates/server.conf.j2'%}
{% include 'roles/sys-front-inj-all/templates/server.conf.j2'%}
{% include 'roles/srv-proxy-core/templates/headers/content_security_policy.conf.j2' %}

View File

@@ -0,0 +1,38 @@
body#custom-css {
--mainColor: var(--color-01-60); /* Original tone: hsl(24, 90%, 50%) vibrant orange */
--mainColorLighter: var(--color-01-70); /* Original tone: #f5873d lighter orange */
--mainColorLightest: var(--color-01-90); /* Original tone: #fce1cf very light orange/beige */
--mainColorVeryLight: var(--color-01-95); /* Original tone: #fff5eb almost white */
--mainHoverColor: var(--color-01-64); /* Original tone: #f47825 hover orange */
--mainBackgroundHoverColor: var(--color-01-92); /* Original tone: #e9ecef light gray */
--mainBackgroundColor: var(--color-01-99); /* Original tone: #fff white */
--mainForegroundColor: var(--color-01-10); /* Original tone: #212529 dark gray/black */
--greyForegroundColor: var(--color-01-50); /* Original tone: #585858 medium gray */
--greyBackgroundColor: var(--color-01-90); /* Original tone: #E5E5E5 light gray */
--greySecondaryBackgroundColor: var(--color-01-91); /* Original tone: #EFEFEF very light gray */
--menuBackgroundColor: var(--color-01-82); /* Original tone: #000 black */
--menuForegroundColor: var(--color-01-99); /* Original tone: #fff white */
--submenuBackgroundColor: var(--color-01-95); /* Original tone: #F7F7F7 off-white/light gray */
--channelBackgroundColor: var(--color-01-93); /* Original tone: #f6ede8 warm light beige */
--inputForegroundColor: var(--color-01-10); /* Original tone: #212529 dark gray */
--inputBackgroundColor: var(--color-01-99); /* Original tone: #fff white */
--inputPlaceholderColor: var(--color-01-55); /* Original tone: #797676 medium gray */
--inputBorderColor: var(--color-01-80); /* Original tone: #C6C6C6 light gray */
--textareaForegroundColor: var(--color-01-10); /* Original tone: #212529 dark gray */
--textareaBackgroundColor: var(--color-01-99); /* Original tone: #fff white */
--markdownTextareaBackgroundColor: var(--color-01-91); /* Original tone: #EFEFEF very light gray */
--actionButtonColor: var(--color-01-50); /* Original tone: #585858 medium gray */
--supportButtonColor: var(--actionButtonColor); /* Original tone: same as actionButtonColor (#585858) */
--activatedActionButtonColor: var(--color-01-10); /* Original tone: #212529 dark gray */
color: var(--mainForegroundColor);
background-color: var(--mainBackgroundColor);
}
div.searchbox input.autocomplete-input{
background-position: 12px;
background-repeat: no-repeat;
}
html[native-dark-active] my-app button, button {
background-color: transparent;
}