Mirrors/photoprism
1
0
Fork 0
mirror of https://github.com/photoprism/photoprism.git synced 2026-07-18 09:05:25 +00:00
Code Issues Projects Releases Wiki Activity

Frontend: Switch menu/action icons from vertical to horizontal dots

Browse source 
Replaces mdi-dots-vertical with mdi-dots-horizontal for the navigation
mobile menu trigger and the p-action-menu default icon, and rotates the
lightbox PhotoSwipe menu-button SVG to match (kept centered in its 16x16
viewBox).
This commit is contained in:
Michael Mayer 2026-06-08 23:08:36 +00:00
parent f3f358b766
commit c13c26002e
4 changed files with 5 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

2
frontend/src/component/action/menu.vue
View file

@ -54,7 +54,7 @@ export default {
},
buttonIcon: {
type: String,
default: "mdi-dots-vertical",
default: "mdi-dots-horizontal",
},
},
emits: ["show", "hide"],

2
frontend/src/component/lightbox.vue
View file

@ -1443,7 +1443,7 @@ export default {
isButton: true,
html: {
isCustomSVG: true,
inner: `<path d="M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z" id="pswp__icn-menu-button" />`,
inner: `<path d="M4.5 8a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm5 0a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm5 0a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z" id="pswp__icn-menu-button" />`,
outlineID: "pswp__icn-menu-button", // Add this to the <path> in the inner property.
size: 16, // Depends on the original SVG viewBox, e.g. use 24 for viewBox="0 0 24 24".
},

4
frontend/src/component/navigation.vue
View file

@ -10,7 +10,7 @@
<span :class="{ clickable: auth }" @click.stop.prevent.self="toggleDrawer">{{ page.title }}</span>
</v-toolbar-title>
<v-btn
icon="mdi-dots-vertical"
icon="mdi-dots-horizontal"
variant="text"
class="nav-mobile-menu-trigger elevation-0"
:ripple="false"
@ -27,7 +27,7 @@
{{ page.title }}
</v-toolbar-title>
<v-btn
icon="mdi-dots-vertical"
icon="mdi-dots-horizontal"
variant="text"
class="nav-mobile-menu-trigger elevation-0"
:ripple="false"

2
frontend/tests/vitest/component/photo/people-tab.test.js
View file

@ -210,7 +210,7 @@ describe("PTabPhotoPeople face actions", () => {
expect(actionMenu.exists()).toBe(true);
// Check props
expect(actionMenu.props("buttonIcon")).toBe("mdi-dots-vertical");
expect(actionMenu.props("buttonIcon")).toBe("mdi-dots-horizontal");
expect(actionMenu.props("buttonClass")).toBe("input-menu");
expect(actionMenu.props("items")).toBeInstanceOf(Function);