fix(settings): Invert app nav icons when active

Signed-off-by: Christopher Ng <chrng8@gmail.com>

diff --git a/apps/settings/src/components/GroupListItem.vue b/apps/settings/src/components/GroupListItem.vue
index 233335830009ac1e6999020ecd6e661a6e7369eb..7cfe80a66f82caae69d6a85d089001634ea1e943 100644 (file)
--- a/apps/settings/src/components/GroupListItem.vue
+++ b/apps/settings/src/components/GroupListItem.vue
@@ -25,10 +25,12 @@
                :exact="true"
                :name="name"
                :to="{ name: 'group', params: { selectedGroup: encodeURIComponent(id) } }"
-               icon="icon-group"
                :loading="loadingRenameGroup"
                :menu-open="openGroupMenu"
                @update:menuOpen="handleGroupMenuOpen">
+               <template #icon>
+                       <AccountGroup :size="20" />
+               </template>
                <template #counter>
                        <NcCounterBubble v-if="count"
                                :type="active ? 'highlighted' : undefined">
@@ -54,18 +56,21 @@
 </template>
 
 <script>
-import NcActionInput from '@nextcloud/vue/dist/Components/NcActionInput.js'
 import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js'
-import NcCounterBubble from '@nextcloud/vue/dist/Components/NcCounterBubble.js'
+import NcActionInput from '@nextcloud/vue/dist/Components/NcActionInput.js'
 import NcAppNavigationItem from '@nextcloud/vue/dist/Components/NcAppNavigationItem.js'
+import NcCounterBubble from '@nextcloud/vue/dist/Components/NcCounterBubble.js'
+
+import AccountGroup from 'vue-material-design-icons/AccountGroup.vue'
 
 export default {
        name: 'GroupListItem',
        components: {
-               NcActionInput,
+               AccountGroup,
                NcActionButton,
-               NcCounterBubble,
+               NcActionInput,
                NcAppNavigationItem,
+               NcCounterBubble,
        },
        props: {
                /**

diff --git a/apps/settings/src/views/Users.vue b/apps/settings/src/views/Users.vue
index ba59d38bcaea32b4f65c3adacad886ec2d964759..8323c593006e1104085f6813f5f5fda6024b863e 100644 (file)
--- a/apps/settings/src/views/Users.vue
+++ b/apps/settings/src/views/Users.vue
@@ -47,8 +47,10 @@
                                        <NcAppNavigationItem id="everyone"
                                                :exact="true"
                                                :name="t('settings', 'Active users')"
-                                               :to="{ name: 'users' }"
-                                               icon="icon-contacts-dark">
+                                               :to="{ name: 'users' }">
+                                               <template #icon>
+                                                       <AccountGroup :size="20" />
+                                               </template>
                                                <template #counter>
                                                        <NcCounterBubble :type="!selectedGroupDecoded ? 'highlighted' : undefined">
                                                                {{ userCount }}
@@ -59,8 +61,10 @@
                                                id="admin"
                                                :exact="true"
                                                :name="t('settings', 'Admins')"
-                                               :to="{ name: 'group', params: { selectedGroup: 'admin' } }"
-                                               icon="icon-user-admin">
+                                               :to="{ name: 'group', params: { selectedGroup: 'admin' } }">
+                                               <template #icon>
+                                                       <ShieldAccount :size="20" />
+                                               </template>
                                                <template v-if="adminGroupMenu.count > 0" #counter>
                                                        <NcCounterBubble :type="selectedGroupDecoded === 'admin' ? 'highlighted' : undefined">
                                                                {{ adminGroupMenu.count }}
@@ -73,8 +77,10 @@
                                                id="disabled"
                                                :exact="true"
                                                :name="t('settings', 'Disabled users')"
-                                               :to="{ name: 'group', params: { selectedGroup: 'disabled' } }"
-                                               icon="icon-disabled-users">
+                                               :to="{ name: 'group', params: { selectedGroup: 'disabled' } }">
+                                               <template #icon>
+                                                       <AccountOff :size="20" />
+                                               </template>
                                                <template v-if="disabledGroupMenu.usercount > 0" #counter>
                                                        <NcCounterBubble :type="selectedGroupDecoded === 'disabled' ? 'highlighted' : undefined">
                                                                {{ disabledGroupMenu.usercount }}
@@ -127,8 +133,11 @@ import NcAppNavigationNewItem from '@nextcloud/vue/dist/Components/NcAppNavigati
 import NcContent from '@nextcloud/vue/dist/Components/NcContent.js'
 import NcCounterBubble from '@nextcloud/vue/dist/Components/NcCounterBubble.js'
 
+import AccountGroup from 'vue-material-design-icons/AccountGroup.vue'
+import AccountOff from 'vue-material-design-icons/AccountOff.vue'
 import Cog from 'vue-material-design-icons/Cog.vue'
 import Plus from 'vue-material-design-icons/Plus.vue'
+import ShieldAccount from 'vue-material-design-icons/ShieldAccount.vue'
 
 import GroupListItem from '../components/GroupListItem.vue'
 import UserList from '../components/UserList.vue'
@@ -140,6 +149,8 @@ export default {
        name: 'Users',
 
        components: {
+               AccountGroup,
+               AccountOff,
                Cog,
                Fragment,
                GroupListItem,
@@ -152,6 +163,7 @@ export default {
                NcContent,
                NcCounterBubble,
                Plus,
+               ShieldAccount,
                UserList,
                UserSettingsDialog,
        },