luisgulo/photoprism
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

UX: Restructure main navigation and change video icon #859 #935

Browse source
This commit is contained in:
Michael Mayer 2021-01-21 13:17:09 +01:00
parent a5e7e02f18
commit 802709e48c
9 changed files with 2276 additions and 400 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontend/src/common/viewer.js
View file

@ -129,7 +129,7 @@ class Viewer {
if (item.playable) {
captionEl.children[0].innerHTML +=
' <i aria-hidden="true" class="v-icon material-icons theme--dark">movie_creation</i>';
' <i aria-hidden="true" class="v-icon material-icons theme--dark" title="Play">play_arrow</i>';
}
if (item.description) {

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

@ -61,7 +61,7 @@
<v-list-tile v-if="isMini" to="/browse" class="nav-browse" @click.stop="">
<v-list-tile-action :title="$gettext('Search')">
<v-icon>image_search</v-icon>
<v-icon>search</v-icon>
</v-list-tile-action>
<v-list-tile-content>
@ -71,7 +71,7 @@
</v-list-tile-content>
</v-list-tile>
<v-list-group v-if="!isMini" prepend-icon="image_search" no-action>
<v-list-group v-if="!isMini" prepend-icon="search" no-action>
<template #activator>
<v-list-tile to="/browse" class="nav-browse" @click.stop="">
<v-list-tile-content>
@ -137,7 +137,7 @@
<v-list-tile v-if="isMini && $config.feature('albums')" to="/albums" class="nav-albums" @click.stop="">
<v-list-tile-action :title="$gettext('Albums')">
<v-icon>photo_album</v-icon>
<v-icon>bookmark</v-icon>
</v-list-tile-action>
<v-list-tile-content>
@ -147,7 +147,7 @@
</v-list-tile-content>
</v-list-tile>
<v-list-group v-if="!isMini && $config.feature('albums')" prepend-icon="photo_album" no-action>
<v-list-group v-if="!isMini && $config.feature('albums')" prepend-icon="bookmark" no-action>
<template #activator>
<v-list-tile to="/albums" class="nav-albums" @click.stop="">
<v-list-tile-content>
@ -168,6 +168,19 @@
</v-list-tile>
</v-list-group>
<v-list-tile to="/videos" class="nav-video" @click.stop="">
<v-list-tile-action :title="$gettext('Videos')">
<v-icon>play_circle_fill</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>
<translate key="Videos">Videos</translate>
<span v-show="config.count.videos > 0" :class="`nav-count ${rtl ? '--rtl' : ''}`">{{ config.count.videos }}</span>
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile to="/favorites" class="nav-favorites" @click.stop="">
<v-list-tile-action :title="$gettext('Favorites')">
<v-icon>favorite</v-icon>
@ -181,28 +194,17 @@
</v-list-tile-content>
</v-list-tile>
<v-list-tile v-show="$config.feature('private')" to="/private" class="nav-private" @click.stop="">
<v-list-tile-action :title="$gettext('Private')">
<v-icon>lock</v-icon>
<v-list-tile v-show="$config.feature('moments')" :to="{ name: 'moments' }" class="nav-moments"
@click.stop="">
<v-list-tile-action :title="$gettext('Moments')">
<v-icon>star</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>
<translate key="Private">Private</translate>
<span v-show="config.count.private > 0" :class="`nav-count ${rtl ? '--rtl' : ''}`">{{ config.count.private }}</span>
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile to="/videos" class="nav-video" @click.stop="">
<v-list-tile-action :title="$gettext('Videos')">
<v-icon>movie_creation</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>
<translate key="Videos">Videos</translate>
<span v-show="config.count.videos > 0" :class="`nav-count ${rtl ? '--rtl' : ''}`">{{ config.count.videos }}</span>
<translate key="Moments">Moments</translate>
<span v-show="config.count.moments > 0"
:class="`nav-count ${rtl ? '--rtl' : ''}`">{{ config.count.moments }}</span>
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
@ -221,21 +223,6 @@
</v-list-tile-content>
</v-list-tile>
<v-list-tile v-show="$config.feature('moments')" :to="{ name: 'moments' }" class="nav-moments"
@click.stop="">
<v-list-tile-action :title="$gettext('Moments')">
<v-icon>explore</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>
<translate key="Moments">Moments</translate>
<span v-show="config.count.moments > 0"
:class="`nav-count ${rtl ? '--rtl' : ''}`">{{ config.count.moments }}</span>
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile v-if="isMini" v-show="$config.feature('places')" :to="{ name: 'places' }" class="nav-places"
@click.stop="">
<v-list-tile-action :title="$gettext('Places')">
@ -300,6 +287,19 @@
</v-list-tile-content>
</v-list-tile>
<v-list-tile v-show="$config.feature('private')" to="/private" class="nav-private" @click.stop="">
<v-list-tile-action :title="$gettext('Private')">
<v-icon>lock</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>
<translate key="Private">Private</translate>
<span v-show="config.count.private > 0" :class="`nav-count ${rtl ? '--rtl' : ''}`">{{ config.count.private }}</span>
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile v-if="isMini && $config.feature('library')" to="/library" class="nav-library" @click.stop="">
<v-list-tile-action :title="$gettext('Library')">
<v-icon>camera_roll</v-icon>

2
frontend/src/component/photo/cards.vue
View file

@ -62,7 +62,7 @@
@click.stop.prevent="openPhoto(index, true)">
<v-icon color="white" class="default-hidden action-raw" :title="$gettext('RAW')">photo_camera</v-icon>
<v-icon color="white" class="default-hidden action-live" :title="$gettext('Live')">$vuetify.icons.live_photo</v-icon>
<v-icon color="white" class="default-hidden action-play" :title="$gettext('Video')">movie</v-icon>
<v-icon color="white" class="default-hidden action-play" :title="$gettext('Video')">play_arrow</v-icon>
<v-icon color="white" class="default-hidden action-stack" :title="$gettext('Stack')">burst_mode</v-icon>
</v-btn>

2
frontend/src/component/photo/mosaic.vue
View file

@ -61,7 +61,7 @@
@click.stop.prevent="openPhoto(index, true)">
<v-icon color="white" class="default-hidden action-raw" :title="$gettext('RAW')">photo_camera</v-icon>
<v-icon color="white" class="default-hidden action-live" :title="$gettext('Live')">$vuetify.icons.live_photo</v-icon>
<v-icon color="white" class="default-hidden action-play" :title="$gettext('Video')">movie</v-icon>
<v-icon color="white" class="default-hidden action-play" :title="$gettext('Video')">play_arrow</v-icon>
<v-icon color="white" class="default-hidden action-stack" :title="$gettext('Stack')">burst_mode</v-icon>
</v-btn>

BIN
frontend/src/locales/en.mo
View file

Binary file not shown.

2590
frontend/src/locales/en.po
View file

File diff suppressed because it is too large Load diff

2
frontend/src/locales/translations.json
View file

File diff suppressed because one or more lines are too long

2
frontend/src/share/photo/cards.vue
View file

@ -58,7 +58,7 @@
@click.stop.prevent="openPhoto(index, true)">
<v-icon color="white" class="default-hidden action-raw" :title="$gettext('RAW')">photo_camera</v-icon>
<v-icon color="white" class="default-hidden action-live" :title="$gettext('Live')">$vuetify.icons.live_photo</v-icon>
<v-icon color="white" class="default-hidden action-play" :title="$gettext('Video')">movie</v-icon>
<v-icon color="white" class="default-hidden action-play" :title="$gettext('Video')">play_arrow</v-icon>
<v-icon color="white" class="default-hidden action-stack" :title="$gettext('Stack')">burst_mode</v-icon>
</v-btn>

2
frontend/src/share/photo/mosaic.vue
View file

@ -57,7 +57,7 @@
@click.stop.prevent="openPhoto(index, true)">
<v-icon color="white" class="default-hidden action-raw" :title="$gettext('RAW')">photo_camera</v-icon>
<v-icon color="white" class="default-hidden action-live" :title="$gettext('Live')">$vuetify.icons.live_photo</v-icon>
<v-icon color="white" class="default-hidden action-play" :title="$gettext('Video')">movie</v-icon>
<v-icon color="white" class="default-hidden action-play" :title="$gettext('Video')">play_arrow</v-icon>
<v-icon color="white" class="default-hidden action-stack" :title="$gettext('Stack')">burst_mode</v-icon>
</v-btn>