pub / ktistec-tweaks

commit 91fb3536d1fae70f477086f93b7be83bd7cd914b
parent 8497ed572c2b8f00858d454d1b4027acb7eb10ec
Author: JayVii <jayvii[AT]posteo[DOT]de>
Date:   Sun, 31 Aug 2025 12:30:41 +0200

fix: ensure marking of external domains functions properly

Diffstat:
M
README.md
 | 
10
++++++++++
M
css/visibility.css
 | 
6
++++--
M
css/visibility.min.css
 | 
4
++--

3 files changed, 16 insertions(+), 4 deletions(-)
diff --git a/README.md b/README.md
@@ -60,6 +60,16 @@ Currently, the `./css/` directory contains three theming tweaks:
 
 ![A post thread with several layers. The grey borders on the left side indicate layer depth.](https://paste.jayvii.de/37bfe0f3cdad3497f4b315b38962281008be756c72a7a89fd44b2e0da7404fff)
 
+The *Visibility* CSS rules also mark all external URLs with an arrow-icon. For
+this to work properly, you have to inject your ktistec's domain into the CSS
+file. For example, if your ktistec is running under `social.example.com`, run
+following command before deploying the CSS file to your ktistec instance:
+
+```bash
+sed -e 's/\/\/localhost/\/\/social.example.com/g' -i css/visibility.css
+sed -e 's/\/\/localhost/\/\/social.example.com/g' -i css/visibility.min.css
+```
+
 **Minify CSS:**
 
 ```bash
diff --git a/css/visibility.css b/css/visibility.css
@@ -1,9 +1,11 @@
 /* External Websites -------------------------------------------------------- */
 
 /* Mark anchors hat refer to external websites
- * Internal links ALWAYS start with "/" or "?"
+ * "localhost" can be replaced by the ktistec instance's domain:
+ * sed -e 's/\/\/localhost/\/\/social.example.com/g' -i visibility.css
  */
-a[href^="https"]:after {
+a:not([href^="/"]):not([href^="#"]):not([href^="?"]):not([href*="//localhost"]):after
+{
   content: "︎ ↗";
 }
 
diff --git a/css/visibility.min.css b/css/visibility.min.css
@@ -1 +1 @@
-a[href^="https"]:after{content:"︎ ↗";}.ui.feed>.event img.extra.image,.ui.feed>.event video.extra.video,.ui.feed>.event div.extra.text figure img.ui.image,.ui.feed>.event div.extra.text figure vid.ui.video{width:100%;height:auto;max-height:400px !important;min-height:100px;}img.ui.extra.attachment.image,.extra.media img.ui.attachment.image,video.ui.extra.attachment.video,.extra.media video.ui.attachment.video,.ui.feed>.event div.extra.text figure img.ui.image,.ui.feed>.event div.extra.text figure vid.ui.video,.lg-image{border-style:solid;border-width:1px;border-color:#808080;}.lg-backdrop.in{opacity:0.9 !important;}.lg-components{max-height:25vh;overflow-y:scroll;}.lg-components{bottom:0 !important;}.threaded:not(.depth-0){border-left-style:solid !important;border-left-width:2px !important;border-left-color:#808080;padding-left:1em !important;margin-right:0;}.ui.feed>.event img.extra.image,.ui.feed>.event video.extra.video,.ui.feed>.event div.extra.text figure img.ui.image,.ui.feed>.event div.extra.text figure vid.ui.video{width:100%;height:auto;max-height:800px;}img.ui.extra.attachment.image,.extra.media img.ui.attachment.image,video.ui.extra.attachment.video,.extra.media video.ui.attachment.video,.ui.feed>.event div.extra.text figure img.ui.image,.ui.feed>.event div.extra.text figure vid.ui.video,.lg-image{border-style:solid;border-width:1px;border-color:#808080;}.lg-backdrop.in{opacity:0.8 !important;}.threaded:not(.depth-0){border-left-style:solid;border-left-width:2px;border-left-color:#80808080;margin-right:0;padding-right:1em !important;}
-\ No newline at end of file
+a:not([href^="/"]):not([href^="#"]):not([href^="?"]):not([href*="//localhost"]):after{content:"︎ ↗";}.ui.feed>.event img.extra.image,.ui.feed>.event video.extra.video,.ui.feed>.event div.extra.text figure img.ui.image,.ui.feed>.event div.extra.text figure vid.ui.video{width:100%;height:auto;max-height:400px !important;min-height:100px;}img.ui.extra.attachment.image,.extra.media img.ui.attachment.image,video.ui.extra.attachment.video,.extra.media video.ui.attachment.video,.ui.feed>.event div.extra.text figure img.ui.image,.ui.feed>.event div.extra.text figure vid.ui.video,.lg-image{border-style:solid;border-width:1px;border-color:#808080;}.lg-backdrop.in{opacity:0.9 !important;}.lg-components{max-height:25vh;overflow-y:scroll;}.lg-components{bottom:0 !important;}.threaded:not(.depth-0){border-left-style:solid !important;border-left-width:2px !important;border-left-color:#808080;padding-left:1em !important;margin-right:0;}.ui.feed>.event img.extra.image,.ui.feed>.event video.extra.video,.ui.feed>.event div.extra.text figure img.ui.image,.ui.feed>.event div.extra.text figure vid.ui.video{width:100%;height:auto;max-height:800px;}img.ui.extra.attachment.image,.extra.media img.ui.attachment.image,video.ui.extra.attachment.video,.extra.media video.ui.attachment.video,.ui.feed>.event div.extra.text figure img.ui.image,.ui.feed>.event div.extra.text figure vid.ui.video,.lg-image{border-style:solid;border-width:1px;border-color:#808080;}.lg-backdrop.in{opacity:0.8 !important;}.threaded:not(.depth-0){border-left-style:solid;border-left-width:2px;border-left-color:#80808080;margin-right:0;padding-right:1em !important;}
+\ No newline at end of file