Frontend: Improve RTL rendering

Signed-off-by: Michael Mayer <michael@photoprism.app>
This commit is contained in:
Michael Mayer 2022-12-13 01:13:11 +01:00
parent a2ab1fd168
commit 3a1293d5d4
3 changed files with 22 additions and 16 deletions

View file

@ -490,18 +490,6 @@
</v-list-group>
</template>
<v-list-tile v-show="!auth" :to="{ name: 'login' }" class="nav-login" @click.stop="">
<v-list-tile-action :title="$gettext('Login')">
<v-icon>lock</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>
<translate key="Login">Login</translate>
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile v-show="isAdmin && !isPublic && !isDemo && !isSponsor" :to="{ name: 'upgrade' }" class="nav-upgrade" @click.stop="">
<v-list-tile-action :title="$gettext('Upgrade')">
<v-icon>diamond</v-icon>
@ -513,6 +501,18 @@
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
<v-list-tile v-show="!auth" :to="{ name: 'login' }" class="nav-login" @click.stop="">
<v-list-tile-action :title="$gettext('Login')">
<v-icon>lock</v-icon>
</v-list-tile-action>
<v-list-tile-content>
<v-list-tile-title>
<translate key="Login">Login</translate>
</v-list-tile-title>
</v-list-tile-content>
</v-list-tile>
</v-list>
<v-list class="p-user-box">

View file

@ -2,7 +2,9 @@
<div class="p-page p-page-upgrade">
<v-toolbar flat color="secondary" :dense="$vuetify.breakpoint.smAndDown">
<v-toolbar-title>
<a href="https://link.photoprism.app/membership" target="_blank"><translate>Upgrade</translate></a> <v-icon>navigate_next</v-icon>
<translate>Upgrade</translate>
<v-icon v-if="rtl">navigate_before</v-icon>
<v-icon v-else>navigate_next</v-icon>
<span v-if="busy">
<translate>Busy, please wait</translate>
</span>
@ -95,7 +97,8 @@
:disabled="busy"
@click.stop="upgrade">
<translate>Proceed</translate>
<v-icon :right="!rtl" :left="rtl" dark>navigate_next</v-icon>
<v-icon v-if="rtl" left dark>navigate_before</v-icon>
<v-icon v-else right dark>navigate_next</v-icon>
</v-btn>
<v-btn v-else color="primary-button" :block="$vuetify.breakpoint.xsOnly"
class="white--text ml-0"
@ -103,7 +106,8 @@
:disabled="busy || form.token.length !== tokenMask.length"
@click.stop="activate">
<translate>Activate</translate>
<v-icon :right="!rtl" :left="rtl" dark>navigate_next</v-icon>
<v-icon v-if="rtl" left dark>navigate_before</v-icon>
<v-icon v-else right dark>navigate_next</v-icon>
</v-btn>
</v-flex>
<v-flex xs12 class="px-2 pt-3 pb-0">
@ -141,6 +145,7 @@
:disabled="busy"
@click.stop="compare">
<translate>Compare Editions</translate>
<v-icon :right="!rtl" :left="rtl" dark>compare_arrows</v-icon>
</v-btn>
</v-flex>
</v-layout>

View file

@ -57,7 +57,8 @@
:block="$vuetify.breakpoint.xsOnly"
class="white--text action-confirm ra-6 py-2 px-3" @click.stop.prevent="login">
<translate>Sign in</translate>
<v-icon dark>navigate_next</v-icon>
<v-icon v-if="rtl" left dark>navigate_before</v-icon>
<v-icon v-else right dark>navigate_next</v-icon>
</v-btn>
</div>
</v-flex>