fix(core): keep app menu settings icon legible on light backgrounds

Signed-off-by: Peter Ringelmann <peter.ringelmann@nextcloud.com>
Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>

Author: pringelmann

core/src/components/AppMenu.vue

@@ -54,10 +54,17 @@
 			:aria-expanded="opened ? 'true' : 'false'"
 			@click="onTriggerClick('currentApp')">
 			<template #icon>
+				<!-- Settings sub-sections share one generic cog. An inline MDI icon
+					inherits the button's currentColor (--color-background-plain-text),
+					so it stays legible on both bright and dark headers without a filter. -->
+				<IconCog
+					v-if="currentApp.type === 'settings'"
+					class="app-menu__current-app-cog"
+					:size="20" />
 				<img
+					v-else
 					class="app-menu__current-app-icon"
-					:class="{ 'app-menu__current-app-icon--settings': currentApp.type === 'settings' }"
-					:src="displayIcon"
+					:src="currentApp.icon"
 					alt=""
 					aria-hidden="true">
 			</template>
@@ -79,6 +86,7 @@ import { generateUrl, imagePath } from '@nextcloud/router'
 import { defineComponent, ref } from 'vue'
 import NcButton from '@nextcloud/vue/components/NcButton'
 import NcPopover from '@nextcloud/vue/components/NcPopover'
+import IconCog from 'vue-material-design-icons/Cog.vue'
 import IconDotsGrid from 'vue-material-design-icons/DotsGrid.vue'
 import AppItem from './AppItem.vue'
 import logger from '../logger.js'
@@ -91,6 +99,7 @@ export default defineComponent({
 
 	components: {
 		AppItem,
+		IconCog,
 		IconDotsGrid,
 		NcButton,
 		NcPopover,
@@ -172,17 +181,6 @@ export default defineComponent({
 				: this.currentApp.name
 		},
 
-		// Match the collapsed label: a generic cog for any settings
-		// sub-section instead of the per-section icon.
-		displayIcon(): string {
-			if (!this.currentApp) {
-				return ''
-			}
-			return this.currentApp.type === 'settings'
-				? imagePath('core', 'actions/settings-dark.svg')
-				: this.currentApp.icon
-		},
-
 		// aria-label overrides the inner span text, so the displayed name
 		// has to be duplicated here for screen readers.
 		currentAppLabel(): string {
@@ -466,12 +464,10 @@ export default defineComponent({
 		// Theme-aware inversion + vertical alpha fade via --header-menu-icon-mask.
 		filter: var(--background-image-invert-if-bright);
 		mask: var(--header-menu-icon-mask);
+	}
 
-		// Settings icons ship dark (designed for the white settings sidebar);
-		// force-white so they read against the themed header.
-		&--settings {
-			filter: brightness(0) invert(1);
-		}
+	&__current-app-cog {
+		mask: var(--header-menu-icon-mask);
 	}
 
 	&__current-app-name {

…ActivityCommentAction-BqoKcCNg.chunk.mjs …ActivityCommentAction-0v6GKlTu.chunk.mjsdist/ActivityCommentAction-BqoKcCNg.chunk.mjs renamed to dist/ActivityCommentAction-0v6GKlTu.chunk.mjs dist/ActivityCommentAction-BqoKcCNg.chunk.mjs renamed to dist/ActivityCommentAction-0v6GKlTu.chunk.mjs

@@ -1,2 +1,2 @@
-import{a as t}from"./index-C1xmmKTZ-CeESs0Yi.chunk.mjs";import{t as e}from"./translation-DoG5ZELJ-DGHp0fUA.chunk.mjs";import{C as m,a}from"./CommentView-BT4knYtH.chunk.mjs";import{l as p}from"./activity-CgsVnLJG.chunk.mjs";import{b as i,r as s,o as n,c,m as u}from"./Web-CVG0oWkS.chunk.mjs";import{_ as l}from"./public-C1mLBHT3.chunk.mjs";import"./index-BwhGLTdD.chunk.mjs";import"./NcModal-DyOZxq9E-DJ8lRVba.chunk.mjs";import"./logger-D3RVzcfQ-Bkys46hi.chunk.mjs";import"./createElementId-DhjFt1I9-BR-WXAA3.chunk.mjs";import"./index-B-dGqfIG.chunk.mjs";import"./TrashCanOutline-ImpP8zID.chunk.mjs";import"./mdi-BsuzcJkY.chunk.mjs";import"./pinia-Dn16KcVd.chunk.mjs";import"./PencilOutline-CVTKhaas.chunk.mjs";/* empty css                                          */import"./NcAvatar-QYahYt2p-B6sbjze-.chunk.mjs";import"./index-BrNm47xe.chunk.mjs";import"./util-Alk1iwuj.chunk.mjs";import"./ArrowRight-CLsEMAPw.chunk.mjs";import"./colors-2YFh1g7z-Esf5_Pnk.chunk.mjs";import"./NcUserStatusIcon-CNh1vXUF-BrBSNJ0h.chunk.mjs";import"./NcDateTime.vue_vue_type_script_setup_true_lang-B4upiZjL-GKzS94MD.chunk.mjs";import"./NcUserBubble-BnaGHDoD-CXGIMXGu.chunk.mjs";import"./GetComments-DSuBVNUT.chunk.mjs";import"./index-DscLWkdM.chunk.mjs";const d=i({components:{Comment:a},mixins:[m],props:{reloadCallback:{type:Function,required:!0}},methods:{onNewComment(){try{this.reloadCallback()}catch(o){t(e("comments","Could not reload comments")),p.error("Could not reload comments",{error:o})}}}});function C(o,f,y,w,D,N){const r=s("Comment");return n(),c(r,u(o.editorData,{autoComplete:o.autoComplete,resourceType:o.resourceType,editor:!0,userData:o.userData,resourceId:o.resourceId,class:"comments-action",onNew:o.onNewComment}),null,16,["autoComplete","resourceType","userData","resourceId","onNew"])}const S=l(d,[["render",C],["__scopeId","data-v-29a1e244"]]);export{S as default};
-//# sourceMappingURL=ActivityCommentAction-BqoKcCNg.chunk.mjs.map
+import{a as t}from"./index-C1xmmKTZ-LVyp88UA.chunk.mjs";import{t as e}from"./translation-DoG5ZELJ-DGHp0fUA.chunk.mjs";import{C as m,a}from"./CommentView-Byb88Ac-.chunk.mjs";import{l as p}from"./activity-CgsVnLJG.chunk.mjs";import{b as i,r as s,o as n,c,m as u}from"./Web-CVG0oWkS.chunk.mjs";import{_ as l}from"./public-C1mLBHT3.chunk.mjs";import"./index-BwhGLTdD.chunk.mjs";import"./NcModal-DyOZxq9E-DJ8lRVba.chunk.mjs";import"./logger-D3RVzcfQ-Bkys46hi.chunk.mjs";import"./createElementId-DhjFt1I9-BR-WXAA3.chunk.mjs";import"./index-B-dGqfIG.chunk.mjs";import"./TrashCanOutline-ImpP8zID.chunk.mjs";import"./mdi-BsuzcJkY.chunk.mjs";import"./pinia-Dn16KcVd.chunk.mjs";import"./PencilOutline-CVTKhaas.chunk.mjs";/* empty css                                          */import"./NcAvatar-QYahYt2p-B6sbjze-.chunk.mjs";import"./index-BrNm47xe.chunk.mjs";import"./util-Alk1iwuj.chunk.mjs";import"./ArrowRight-CLsEMAPw.chunk.mjs";import"./colors-2YFh1g7z-Esf5_Pnk.chunk.mjs";import"./NcUserStatusIcon-CNh1vXUF-BrBSNJ0h.chunk.mjs";import"./NcDateTime.vue_vue_type_script_setup_true_lang-B4upiZjL-GKzS94MD.chunk.mjs";import"./NcUserBubble-BnaGHDoD-CXGIMXGu.chunk.mjs";import"./GetComments-DSuBVNUT.chunk.mjs";import"./index-DscLWkdM.chunk.mjs";const d=i({components:{Comment:a},mixins:[m],props:{reloadCallback:{type:Function,required:!0}},methods:{onNewComment(){try{this.reloadCallback()}catch(o){t(e("comments","Could not reload comments")),p.error("Could not reload comments",{error:o})}}}});function C(o,f,y,w,D,N){const r=s("Comment");return n(),c(r,u(o.editorData,{autoComplete:o.autoComplete,resourceType:o.resourceType,editor:!0,userData:o.userData,resourceId:o.resourceId,class:"comments-action",onNew:o.onNewComment}),null,16,["autoComplete","resourceType","userData","resourceId","onNew"])}const S=l(d,[["render",C],["__scopeId","data-v-29a1e244"]]);export{S as default};
+//# sourceMappingURL=ActivityCommentAction-0v6GKlTu.chunk.mjs.map

…CommentAction-BqoKcCNg.chunk.mjs.license …CommentAction-0v6GKlTu.chunk.mjs.licensedist/ActivityCommentAction-BqoKcCNg.chunk.mjs.license renamed to dist/ActivityCommentAction-0v6GKlTu.chunk.mjs.license dist/ActivityCommentAction-BqoKcCNg.chunk.mjs.license renamed to dist/ActivityCommentAction-0v6GKlTu.chunk.mjs.license

@@ -1,2 +1,2 @@
-import{t as s}from"./translation-DoG5ZELJ-DGHp0fUA.chunk.mjs";import{C as p,a}from"./CommentView-BT4knYtH.chunk.mjs";import{_ as i}from"./public-C1mLBHT3.chunk.mjs";import{r as n,o as c,c as u,m as l}from"./Web-CVG0oWkS.chunk.mjs";import"./index-B-dGqfIG.chunk.mjs";import"./pinia-Dn16KcVd.chunk.mjs";import"./PencilOutline-CVTKhaas.chunk.mjs";import"./logger-D3RVzcfQ-Bkys46hi.chunk.mjs";import"./createElementId-DhjFt1I9-BR-WXAA3.chunk.mjs";import"./NcModal-DyOZxq9E-DJ8lRVba.chunk.mjs";/* empty css                                          */import"./NcAvatar-QYahYt2p-B6sbjze-.chunk.mjs";import"./index-BrNm47xe.chunk.mjs";import"./util-Alk1iwuj.chunk.mjs";import"./ArrowRight-CLsEMAPw.chunk.mjs";import"./colors-2YFh1g7z-Esf5_Pnk.chunk.mjs";import"./NcUserStatusIcon-CNh1vXUF-BrBSNJ0h.chunk.mjs";import"./NcDateTime.vue_vue_type_script_setup_true_lang-B4upiZjL-GKzS94MD.chunk.mjs";import"./TrashCanOutline-ImpP8zID.chunk.mjs";import"./NcUserBubble-BnaGHDoD-CXGIMXGu.chunk.mjs";import"./index-C1xmmKTZ-CeESs0Yi.chunk.mjs";import"./index-BwhGLTdD.chunk.mjs";import"./mdi-BsuzcJkY.chunk.mjs";import"./activity-CgsVnLJG.chunk.mjs";import"./GetComments-DSuBVNUT.chunk.mjs";import"./index-DscLWkdM.chunk.mjs";const d={name:"ActivityCommentEntry",components:{Comment:a},mixins:[p],props:{comment:{type:Object,required:!0},reloadCallback:{type:Function,required:!0}},data(){return{commentMessage:""}},watch:{comment(){this.commentMessage=this.comment.props.message}},mounted(){this.commentMessage=this.comment.props.message},methods:{t:s}};function g(t,e,o,f,m,C){const r=n("Comment");return c(),u(r,l({ref:"comment",tag:"li"},o.comment.props,{autoComplete:t.autoComplete,resourceType:t.resourceType,message:m.commentMessage,resourceId:t.resourceId,userData:t.genMentionsData(o.comment.props.mentions),class:"comments-activity",onDelete:e[0]||(e[0]=y=>o.reloadCallback())}),null,16,["autoComplete","resourceType","message","resourceId","userData"])}const Q=i(d,[["render",g],["__scopeId","data-v-afc310f1"]]);export{Q as default};
-//# sourceMappingURL=ActivityCommentEntry-Ckeq2NDx.chunk.mjs.map
+import{t as s}from"./translation-DoG5ZELJ-DGHp0fUA.chunk.mjs";import{C as p,a}from"./CommentView-Byb88Ac-.chunk.mjs";import{_ as i}from"./public-C1mLBHT3.chunk.mjs";import{r as n,o as c,c as u,m as l}from"./Web-CVG0oWkS.chunk.mjs";import"./index-B-dGqfIG.chunk.mjs";import"./pinia-Dn16KcVd.chunk.mjs";import"./PencilOutline-CVTKhaas.chunk.mjs";import"./logger-D3RVzcfQ-Bkys46hi.chunk.mjs";import"./createElementId-DhjFt1I9-BR-WXAA3.chunk.mjs";import"./NcModal-DyOZxq9E-DJ8lRVba.chunk.mjs";/* empty css                                          */import"./NcAvatar-QYahYt2p-B6sbjze-.chunk.mjs";import"./index-BrNm47xe.chunk.mjs";import"./util-Alk1iwuj.chunk.mjs";import"./ArrowRight-CLsEMAPw.chunk.mjs";import"./colors-2YFh1g7z-Esf5_Pnk.chunk.mjs";import"./NcUserStatusIcon-CNh1vXUF-BrBSNJ0h.chunk.mjs";import"./NcDateTime.vue_vue_type_script_setup_true_lang-B4upiZjL-GKzS94MD.chunk.mjs";import"./TrashCanOutline-ImpP8zID.chunk.mjs";import"./NcUserBubble-BnaGHDoD-CXGIMXGu.chunk.mjs";import"./index-C1xmmKTZ-LVyp88UA.chunk.mjs";import"./index-BwhGLTdD.chunk.mjs";import"./mdi-BsuzcJkY.chunk.mjs";import"./activity-CgsVnLJG.chunk.mjs";import"./GetComments-DSuBVNUT.chunk.mjs";import"./index-DscLWkdM.chunk.mjs";const d={name:"ActivityCommentEntry",components:{Comment:a},mixins:[p],props:{comment:{type:Object,required:!0},reloadCallback:{type:Function,required:!0}},data(){return{commentMessage:""}},watch:{comment(){this.commentMessage=this.comment.props.message}},mounted(){this.commentMessage=this.comment.props.message},methods:{t:s}};function g(t,e,o,f,m,C){const r=n("Comment");return c(),u(r,l({ref:"comment",tag:"li"},o.comment.props,{autoComplete:t.autoComplete,resourceType:t.resourceType,message:m.commentMessage,resourceId:t.resourceId,userData:t.genMentionsData(o.comment.props.mentions),class:"comments-activity",onDelete:e[0]||(e[0]=y=>o.reloadCallback())}),null,16,["autoComplete","resourceType","message","resourceId","userData"])}const Q=i(d,[["render",g],["__scopeId","data-v-afc310f1"]]);export{Q as default};
+//# sourceMappingURL=ActivityCommentEntry-HHU3a6o5.chunk.mjs.map