From 526b43eba66c597c78857da6ded3c7f672f96e49 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Tue, 28 Jan 2020 01:29:20 +0200 Subject: [PATCH] Kenomo (see: #624) theme. Ability to define link color for post contents. Fixes --- src/components/emoji_input/emoji_input.vue | 2 + .../notifications/notifications.scss | 3 + src/components/popper/popper.scss | 2 + src/components/status/status.vue | 7 ++ .../style_switcher/style_switcher.vue | 17 +++++ src/components/user_card/user_card.vue | 5 ++ src/services/theme_data/pleromafe.js | 34 +++++++++ static/themes/kenomo.json | 71 +++++++++++++++++++ 8 files changed, 141 insertions(+) create mode 100644 static/themes/kenomo.json diff --git a/src/components/emoji_input/emoji_input.vue b/src/components/emoji_input/emoji_input.vue index 94eae560..e9ac09c3 100644 --- a/src/components/emoji_input/emoji_input.vue +++ b/src/components/emoji_input/emoji_input.vue @@ -116,6 +116,8 @@ --faint: var(--popoverFaintText, $fallback--faint); --faintLink: var(--popoverFaintLink, $fallback--faint); --lightText: var(--popoverLightText, $fallback--lightText); + --postLink: var(--popoverPostLink, $fallback--link); + --postFaintLink: var(--popoverPostFaintLink, $fallback--link); --icon: var(--popoverIcon, $fallback--icon); } } diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss index 71876b14..ca762432 100644 --- a/src/components/notifications/notifications.scss +++ b/src/components/notifications/notifications.scss @@ -68,6 +68,9 @@ a { color: var(--faintLink); } + .status-content a { + color: var(--postFaintLink); + } } padding: 0; .media-body { diff --git a/src/components/popper/popper.scss b/src/components/popper/popper.scss index 341416c1..8e2dcd55 100644 --- a/src/components/popper/popper.scss +++ b/src/components/popper/popper.scss @@ -15,6 +15,8 @@ --faint: var(--popoverFaintText, $fallback--faint); --faintLink: var(--popoverFaintLink, $fallback--faint); --lightText: var(--popoverLightText, $fallback--lightText); + --postLink: var(--popoverPostLink, $fallback--link); + --postFaintLink: var(--popoverPostFaintLink, $fallback--link); --icon: var(--popoverIcon, $fallback--icon); } diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 1997e187..b1048832 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -451,6 +451,8 @@ $status-margin: 0.75em; --lightText: var(--selectedPostLightText, $fallback--light); --faint: var(--selectedPostFaintText, $fallback--faint); --faintLink: var(--selectedPostFaintLink, $fallback--faint); + --postLink: var(--selectedPostPostLink, $fallback--faint); + --postFaintLink: var(--selectedPostFaintPostLink, $fallback--faint); --icon: var(--selectedPostIcon, $fallback--icon); } @@ -640,6 +642,11 @@ $status-margin: 0.75em; line-height: 1.4em; white-space: pre-wrap; + a { + color: $fallback--link; + color: var(--postLink, $fallback--link); + } + img, video { max-width: 100%; max-height: 400px; diff --git a/src/components/style_switcher/style_switcher.vue b/src/components/style_switcher/style_switcher.vue index 6e38bd8e..0b3b0fbf 100644 --- a/src/components/style_switcher/style_switcher.vue +++ b/src/components/style_switcher/style_switcher.vue @@ -248,6 +248,23 @@
+

{{ $t('settings.style.advanced_colors.post') }}

+ + + +

{{ $t('settings.style.advanced_colors.alert') }}

brightness(20 * mod, text).rgb }, + postLink: { + depends: ['link'] + }, + border: { depends: ['fg'], opacity: 'border', diff --git a/static/themes/kenomo.json b/static/themes/kenomo.json new file mode 100644 index 00000000..98ddf974 --- /dev/null +++ b/static/themes/kenomo.json @@ -0,0 +1,71 @@ +{ + "_pleroma_theme_version": 2, + "name": "Kenomo", + "source": { + "themeEngineVersion": 3, + "fonts": {}, + "shadows": { + "panel": [], + "topBar": [], + "button": [ + { + "x": 0, + "y": 1, + "blur": 0, + "spread": 0, + "color": "#FFFFFF", + "alpha": 0.2, + "inset": true + }, + { + "x": 0, + "y": -1, + "blur": 0, + "spread": 0, + "color": "#000000", + "alpha": 0.2, + "inset": true + } + ], + "input": [ + { + "x": 0, + "y": "0", + "blur": 0, + "spread": "1", + "color": "#576574", + "alpha": "1", + "inset": true + } + ] + }, + "opacity": { + "underlay": "1", + "border": "0" + }, + "colors": { + "bg": "#ffffff", + "fg": "#f6f6f6", + "text": "#494949", + "underlay": "#ffffff", + "link": "#818181", + "accent": "#818181", + "cBlue": "#2e86de", + "cRed": "#c96248", + "cGreen": "#0fa00f", + "cOrange": "#aa7623", + "postLink": "#2e86de", + "border": "#ffffff", + "icon": "#8a8a8a", + "panel": "transparent", + "topBarText": "#4b4b4b", + "tab": "--btn,-30", + "btn": "#576574" + }, + "radii": { + "panel": "0", + "avatar": "6", + "avatarAlt": "6" + } + } +}