diff options
| author | Ferdinand Thiessen <opensource@fthiessen.de> | 2023-12-20 14:47:33 +0100 |
|---|---|---|
| committer | backportbot-nextcloud[bot] <backportbot-nextcloud[bot]@users.noreply.github.com> | 2023-12-20 15:25:05 +0000 |
| commit | a46e34c56c30d5c840ac17446c11e67991611812 (patch) | |
| tree | 11089bf0c04fd0975d22d619884424ec6e56bcb5 | |
| parent | 8c062b046e87c9e141c9f8b9606609b390a7dd58 (diff) | |
| download | nextcloud-server-a46e34c56c30d5c840ac17446c11e67991611812.tar.gz nextcloud-server-a46e34c56c30d5c840ac17446c11e67991611812.zip | |
fix: Adjust colors of app menu and dashboard
Those elements are shown directly on the background which has the `color-primary`,
so they need to use `color-primary-text` instead of `color-primary-element-text` for guranteed contrast.
Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>
| -rw-r--r-- | apps/dashboard/src/DashboardApp.vue | 3 | ||||
| -rw-r--r-- | core/src/components/AppMenu.vue | 8 |
2 files changed, 7 insertions, 4 deletions
diff --git a/apps/dashboard/src/DashboardApp.vue b/apps/dashboard/src/DashboardApp.vue index ffdf368cb2c..733ce104569 100644 --- a/apps/dashboard/src/DashboardApp.vue +++ b/apps/dashboard/src/DashboardApp.vue @@ -465,7 +465,8 @@ export default { background-attachment: fixed; > h2 { - color: var(--color-primary-element-text); + // this is shown directly on the background which has `color-primary`, so we need `color-primary-text` + color: var(--color-primary-text); text-align: center; font-size: 32px; line-height: 130%; diff --git a/core/src/components/AppMenu.vue b/core/src/components/AppMenu.vue index 8709cd5e5fc..7285c1fb437 100644 --- a/core/src/components/AppMenu.vue +++ b/core/src/components/AppMenu.vue @@ -160,7 +160,7 @@ $header-icon-size: 20px; width: 12px; height: 5px; border-radius: 3px; - background-color: var(--color-primary-element-text); + background-color: var(--color-primary-text); left: 50%; bottom: 6px; display: block; @@ -177,7 +177,8 @@ $header-icon-size: 20px; width: calc(100% - 4px); height: calc(100% - 4px); margin: 2px; - color: var(--color-primary-element-text); + // this is shown directly on the background which has `color-primary`, so we need `color-primary-text` + color: var(--color-primary-text); position: relative; } @@ -194,7 +195,8 @@ $header-icon-size: 20px; opacity: 0; position: absolute; font-size: 12px; - color: var(--color-primary-element-text); + // this is shown directly on the background which has `color-primary`, so we need `color-primary-text` + color: var(--color-primary-text); text-align: center; left: 50%; top: 45%; |