Frontend: Use theme colors for buttons and icons

Signed-off-by: Michael Mayer <michael@liquidbytes.net>
This commit is contained in:
Michael Mayer 2020-06-30 12:32:26 +02:00
parent a28122ee02
commit f7a12f0413
8 changed files with 30 additions and 30 deletions

View file

@ -4,7 +4,7 @@
<v-card-title primary-title>
<v-layout row wrap v-if="scope === 'sharing'">
<v-flex xs9>
<h3 class="headline mb-0">{{ $gettext('Upload') }}</h3>
<h3 class="headline mx-2 my-0">{{ $gettext('Upload') }}</h3>
</v-flex>
<v-flex xs3 text-xs-right>
<v-switch
@ -12,9 +12,9 @@
color="secondary-dark"
:true-value="true"
:false-value="false"
:label="model.AccShare ? label.enable : label.disable"
:label="model.AccShare ? label.enabled : label.disabled"
:disabled="model.AccType !== 'webdav'"
class="mt-0 hidden-xs-only"
class="ma-0 hidden-xs-only"
hide-details
></v-switch>
<v-switch
@ -23,14 +23,14 @@
:true-value="true"
:false-value="false"
:disabled="model.AccType !== 'webdav'"
class="mt-0 hidden-sm-and-up"
class="ma-0 hidden-sm-and-up"
hide-details
></v-switch>
</v-flex>
</v-layout>
<v-layout row wrap v-else-if="scope === 'sync'">
<v-flex xs9>
<h3 class="headline mb-0">{{ $gettext('Remote Sync') }}</h3>
<h3 class="headline mx-2 my-0">{{ $gettext('Remote Sync') }}</h3>
</v-flex>
<v-flex xs3 text-xs-right>
<v-switch
@ -38,7 +38,7 @@
color="secondary-dark"
:true-value="true"
:false-value="false"
:label="model.AccSync ? label.enable : label.disable"
:label="model.AccSync ? label.enabled : label.disabled"
:disabled="model.AccType !== 'webdav'"
class="mt-0 hidden-xs-only"
hide-details
@ -56,7 +56,7 @@
</v-layout>
<v-layout row wrap v-else>
<v-flex xs10>
<h3 class="headline mb-0">{{ $gettext('Edit Account') }}</h3>
<h3 class="headline mx-2 my-0">{{ $gettext('Edit Account') }}</h3>
</v-flex>
<v-flex xs2 text-xs-right>
<v-btn icon flat :ripple="false"
@ -68,7 +68,7 @@
</v-layout>
<h3 class="headline mb-0" v-else>{{ $gettext('Edit Account') }}</h3>
</v-card-title>
<v-container fluid class="pt-0 pb-2 pr-2 pl-2">
<v-card-text class="pt-0">
<v-layout row wrap v-if="scope === 'sharing'">
<v-flex xs12 class="pa-2">
<v-autocomplete
@ -252,7 +252,7 @@
</v-flex>
</v-layout>
<v-layout row wrap>
<v-flex xs12 text-xs-right class="pt-3">
<v-flex xs12 text-xs-right class="pt-3 pb-0">
<v-btn @click.stop="cancel" depressed color="secondary-light"
class="action-cancel">
<span>{{ label.cancel }}</span>
@ -263,7 +263,7 @@
</v-btn>
</v-flex>
</v-layout>
</v-container>
</v-card-text>
</v-card>
</v-dialog>
</template>
@ -335,8 +335,8 @@
cancel: this.$gettext("Cancel"),
confirm: this.$gettext("Save"),
save: this.$gettext("Save"),
enable: this.$gettext("Enable"),
disable: this.$gettext("Disable"),
enabled: this.$gettext("Enabled"),
disabled: this.$gettext("Disabled"),
name: this.$gettext("Name"),
url: this.$gettext("Service URL"),
user: this.$gettext("Username"),

View file

@ -4,7 +4,7 @@
<v-container fluid class="pb-2 pr-2 pl-2">
<v-layout row wrap>
<v-flex xs3 text-xs-center>
<v-icon size="54" color="grey lighten-1">delete_outline</v-icon>
<v-icon size="54" color="secondary-dark lighten-1">delete_outline</v-icon>
</v-flex>
<v-flex xs9 text-xs-left align-self-center>
<div class="subheading pr-1"><translate key="Are you sure you want to delete this account?">Are you sure you want to delete this account?</translate></div>

View file

@ -4,16 +4,16 @@
<v-container fluid class="pb-2 pr-2 pl-2">
<v-layout row wrap>
<v-flex xs3 text-xs-center>
<v-icon size="54" color="grey lighten-1">delete_outline</v-icon>
<v-icon size="54" color="secondary-dark lighten-1">delete_outline</v-icon>
</v-flex>
<v-flex xs9 text-xs-left align-self-center>
<div class="subheading pr-1"><translate key="Are you sure you want to delete these albums?">Are you sure you want to delete these albums?</translate></div>
</v-flex>
<v-flex xs12 text-xs-right class="pt-3">
<v-btn @click.stop="cancel" depressed color="grey lighten-3" class="p-photo-dialog-cancel">
<v-btn @click.stop="cancel" depressed color="secondary-light" class="p-photo-dialog-cancel">
<translate key="Cancel">Cancel</translate>
</v-btn>
<v-btn color="blue-grey lighten-2" depressed dark @click.stop="confirm"
<v-btn color="secondary-dark" depressed dark @click.stop="confirm"
class="p-photo-dialog-confirm"><translate key="Delete">Delete</translate>
</v-btn>
</v-flex>

View file

@ -4,16 +4,16 @@
<v-container fluid class="pb-2 pr-2 pl-2">
<v-layout row wrap>
<v-flex xs3 text-xs-center>
<v-icon size="54" color="grey lighten-1">delete_outline</v-icon>
<v-icon size="54" color="secondary-dark lighten-1">delete_outline</v-icon>
</v-flex>
<v-flex xs9 text-xs-left align-self-center>
<div class="subheading pr-1"><translate key="Are you sure you want to delete these labels?">Are you sure you want to delete these labels?</translate></div>
</v-flex>
<v-flex xs12 text-xs-right class="pt-3">
<v-btn @click.stop="cancel" depressed color="grey lighten-3" class="p-photo-dialog-cancel">
<v-btn @click.stop="cancel" depressed color="secondary-light" class="p-photo-dialog-cancel">
<translate key="Cancel">Cancel</translate>
</v-btn>
<v-btn color="blue-grey lighten-2" depressed dark @click.stop="confirm"
<v-btn color="secondary-dark" depressed dark @click.stop="confirm"
class="p-photo-dialog-confirm"><translate key="Delete">Delete</translate>
</v-btn>
</v-flex>

View file

@ -4,8 +4,8 @@
<v-container fluid class="pb-2 pr-2 pl-2">
<v-layout row wrap>
<v-flex xs3 text-xs-center>
<v-icon size="54" color="grey lighten-1" v-if="newAlbum">create_new_folder</v-icon>
<v-icon size="54" color="grey lighten-1" v-else>folder</v-icon>
<v-icon size="54" color="secondary-dark lighten-1" v-if="newAlbum">create_new_folder</v-icon>
<v-icon size="54" color="secondary-dark lighten-1" v-else>folder</v-icon>
</v-flex>
<v-flex xs9 text-xs-left align-self-center>
<v-autocomplete

View file

@ -4,17 +4,17 @@
<v-container fluid class="pb-2 pr-2 pl-2">
<v-layout row wrap>
<v-flex xs3 text-xs-center>
<v-icon size="54" color="grey lighten-1">archive</v-icon>
<v-icon size="54" color="secondary-dark lighten-1">archive</v-icon>
</v-flex>
<v-flex xs9 text-xs-left align-self-center>
<div class="subheading pr-1"><translate key="Are you sure">Are you sure you want to archive these photos?</translate></div>
<div class="subheading pr-1"><translate>Are you sure you want to archive these photos?</translate></div>
</v-flex>
<v-flex xs12 text-xs-right class="pt-3">
<v-btn @click.stop="cancel" depressed color="secondary-light" class="action-cancel">
<translate key="Cancel">Cancel</translate>
<translate>Cancel</translate>
</v-btn>
<v-btn color="secondary-dark" depressed dark @click.stop="confirm"
class="action-confirm"><translate key="Archive">Archive</translate>
class="action-confirm"><translate>Archive</translate>
</v-btn>
</v-flex>
</v-layout>

View file

@ -49,14 +49,14 @@
</v-autocomplete>
</v-flex>
<v-flex xs12 text-xs-right class="pt-4">
<v-btn @click.stop="cancel" depressed color="grey lighten-3" class="action-cancel ml-0 mt-0 mb-0 mr-2">
<v-btn @click.stop="cancel" depressed color="secondary-light" class="action-cancel ml-0 mt-0 mb-0 mr-2">
<translate key="Cancel">Cancel</translate>
</v-btn>
<v-btn color="blue-grey lighten-2" depressed dark @click.stop="setup"
<v-btn color="secondary-dark" depressed dark @click.stop="setup"
class="action-setup ma-0" v-if="noAccounts">
<span>{{ labels.setup }}</span>
</v-btn>
<v-btn color="blue-grey lighten-2" depressed dark @click.stop="confirm"
<v-btn color="secondary-dark" depressed dark @click.stop="confirm"
class="action-upload ma-0" v-else>
<span>{{ labels.upload }}</span>
</v-btn>

View file

@ -3,9 +3,9 @@
"application": "#fafafa",
"form": "#fafafa",
"primary": "#c7ceea",
"secondary-dark": "#6a6a60",
"secondary-dark": "#7a7a7a",
"secondary": "#e0e0e0",
"secondary-light": "#eeeeee",
"secondary-light": "#eaeaea",
"accent": "#9e9e9e",
"error": "#e57373",
"info": "#00acc1",