Client - update user preferences display

This commit is contained in:
Sam 2023-12-13 18:07:30 +01:00
parent 13e31f8680
commit 13b8dd04f8
5 changed files with 32 additions and 0 deletions

View File

@ -1,5 +1,6 @@
<template> <template>
<div id="user-preferences" class="description-list"> <div id="user-preferences" class="description-list">
<div class="preferences-section">{{ $t('user.PROFILE.INTERFACE') }}</div>
<dl> <dl>
<dt>{{ $t('user.PROFILE.LANGUAGE') }}:</dt> <dt>{{ $t('user.PROFILE.LANGUAGE') }}:</dt>
<dd>{{ userLanguage }}</dd> <dd>{{ userLanguage }}</dd>
@ -9,6 +10,9 @@
<dd>{{ getDateFormat(date_format, appLanguage) }}</dd> <dd>{{ getDateFormat(date_format, appLanguage) }}</dd>
<dt>{{ $t('user.PROFILE.FIRST_DAY_OF_WEEK') }}:</dt> <dt>{{ $t('user.PROFILE.FIRST_DAY_OF_WEEK') }}:</dt>
<dd>{{ $t(`user.PROFILE.${fistDayOfWeek}`) }}</dd> <dd>{{ $t(`user.PROFILE.${fistDayOfWeek}`) }}</dd>
</dl>
<div class="preferences-section">{{ $t('workouts.WORKOUT', 0) }}</div>
<dl>
<dt>{{ $t('user.PROFILE.UNITS.LABEL') }}:</dt> <dt>{{ $t('user.PROFILE.UNITS.LABEL') }}:</dt>
<dd> <dd>
{{ {{
@ -92,3 +96,17 @@
props.user.display_ascent ? 'DISPLAYED' : 'HIDDEN' props.user.display_ascent ? 'DISPLAYED' : 'HIDDEN'
) )
</script> </script>
<style lang="scss" scoped>
@import '~@/scss/vars.scss';
#user-preferences {
.preferences-section {
font-weight: bold;
text-transform: uppercase;
border-bottom: 1px solid var(--card-border-color);
}
.raw-speed-help {
margin-top: -$default-margin * 0.5;
}
}
</style>

View File

@ -3,6 +3,9 @@
<div class="profile-form form-box"> <div class="profile-form form-box">
<ErrorMessage :message="errorMessages" v-if="errorMessages" /> <ErrorMessage :message="errorMessages" v-if="errorMessages" />
<form @submit.prevent="updateProfile"> <form @submit.prevent="updateProfile">
<div class="preferences-section">
{{ $t('user.PROFILE.INTERFACE') }}
</div>
<label class="form-items"> <label class="form-items">
{{ $t('user.PROFILE.LANGUAGE') }} {{ $t('user.PROFILE.LANGUAGE') }}
<select id="language" v-model="userForm.language" :disabled="loading"> <select id="language" v-model="userForm.language" :disabled="loading">
@ -59,6 +62,7 @@
</label> </label>
</div> </div>
</div> </div>
<div class="preferences-section">{{ $t('workouts.WORKOUT', 0) }}</div>
<div class="form-items form-checkboxes"> <div class="form-items form-checkboxes">
<span class="checkboxes-label"> <span class="checkboxes-label">
{{ $t('user.PROFILE.UNITS.LABEL') }} {{ $t('user.PROFILE.UNITS.LABEL') }}
@ -327,6 +331,13 @@
} }
} }
.preferences-section {
font-weight: bold;
text-transform: uppercase;
border-bottom: 1px solid var(--card-border-color);
margin-bottom: $default-padding * 0.5;
}
#language, #language,
#date_format { #date_format {
padding: $default-padding * 0.5; padding: $default-padding * 0.5;

View File

@ -74,5 +74,6 @@
justify-content: center; justify-content: center;
flex-wrap: wrap; flex-wrap: wrap;
gap: $default-margin * 0.5; gap: $default-margin * 0.5;
margin-bottom: $default-margin;
} }
</style> </style>

View File

@ -79,6 +79,7 @@
"ERRORED_EMAIL_UPDATE": "Please {0} to change your email address again or contact the administrator", "ERRORED_EMAIL_UPDATE": "Please {0} to change your email address again or contact the administrator",
"FIRST_DAY_OF_WEEK": "First day of week", "FIRST_DAY_OF_WEEK": "First day of week",
"FIRST_NAME": "First name", "FIRST_NAME": "First name",
"INTERFACE": "Interface",
"LANGUAGE": "Language", "LANGUAGE": "Language",
"LAST_NAME": "Last name", "LAST_NAME": "Last name",
"LOCATION": "Location", "LOCATION": "Location",

View File

@ -79,6 +79,7 @@
"ERRORED_EMAIL_UPDATE": "Veuillez vous {0} pour changer de nouveau votre adresse électronique ou contacter l'administrateur", "ERRORED_EMAIL_UPDATE": "Veuillez vous {0} pour changer de nouveau votre adresse électronique ou contacter l'administrateur",
"FIRST_DAY_OF_WEEK": "Premier jour de la semaine", "FIRST_DAY_OF_WEEK": "Premier jour de la semaine",
"FIRST_NAME": "Prénom", "FIRST_NAME": "Prénom",
"INTERFACE": "Interface",
"LANGUAGE": "Langue", "LANGUAGE": "Langue",
"LAST_NAME": "Nom", "LAST_NAME": "Nom",
"LOCATION": "Lieu", "LOCATION": "Lieu",