diff options
author | Maksim Zakharov <m.zakharov@IBS.RU> | 2022-04-27 14:59:55 +0300 |
---|---|---|
committer | Maksim Zakharov <m.zakharov@IBS.RU> | 2022-04-28 15:27:48 +0300 |
commit | 3f9ce4eaf391733e8769caec8da84302c012b21e (patch) | |
tree | e63a6e7e84ffabf77b905d2307716b7f27dd100e /src/views | |
parent | 87161635e7e7b6cd5d625b23cbd85730362f164f (diff) | |
download | webui-vue-3f9ce4eaf391733e8769caec8da84302c012b21e.tar.xz |
restyled login page
Diffstat (limited to 'src/views')
-rw-r--r-- | src/views/Login/Login.vue | 78 | ||||
-rw-r--r-- | src/views/Login/index.js | 3 |
2 files changed, 62 insertions, 19 deletions
diff --git a/src/views/Login/Login.vue b/src/views/Login/Login.vue index 8d96573a..872950ea 100644 --- a/src/views/Login/Login.vue +++ b/src/views/Login/Login.vue @@ -5,15 +5,30 @@ {{ $t('pageLogin.alert.message') }} </p> </alert> - <b-form-group label-for="language" :label="$t('pageLogin.language')"> + <!-- <b-form-group label-for="language" :label="$t('pageLogin.language')"> <b-form-select id="language" v-model="$i18n.locale" :options="languages" data-test-id="login-select-language" ></b-form-select> - </b-form-group> - <b-form-group label-for="username" :label="$t('pageLogin.username')"> + </b-form-group> --> + <b-form-group + class="text__h1" + label-for="auth" + :label="$t('pageLogin.auth')" + ></b-form-group> + + <b-form-group + label-for="auth" + class="auth-description" + :label="$t('pageLogin.authDescription')" + ></b-form-group> + + <b-form-group> + <label class="text-login" for="username">{{ + $t('pageLogin.username') + }}</label> <b-form-input id="username" v-model="userInfo.username" @@ -22,6 +37,7 @@ type="text" autofocus="autofocus" data-test-id="login-input-username" + class="form-control-with-button username-input" @input="$v.userInfo.username.$touch()" > </b-form-input> @@ -31,9 +47,12 @@ </template> </b-form-invalid-feedback> </b-form-group> - <div class="login-form__section mb-3"> - <label for="password">{{ $t('pageLogin.password') }}</label> + + <b-form-group> <input-password-toggle> + <label class="text-login" for="password">{{ + $t('pageLogin.password') + }}</label> <b-form-input id="password" v-model="userInfo.password" @@ -41,19 +60,20 @@ :state="getValidationState($v.userInfo.password)" type="password" data-test-id="login-input-password" - class="form-control-with-button" + class="form-control-with-button password-input" @input="$v.userInfo.password.$touch()" > </b-form-input> + <b-form-invalid-feedback id="password-required" role="alert"> + <template v-if="!$v.userInfo.password.required"> + {{ $t('global.form.fieldRequired') }} + </template> + </b-form-invalid-feedback> </input-password-toggle> - <b-form-invalid-feedback id="password-required" role="alert"> - <template v-if="!$v.userInfo.password.required"> - {{ $t('global.form.fieldRequired') }} - </template> - </b-form-invalid-feedback> - </div> + </b-form-group> + <b-button - class="mt-3" + class="login-button" type="submit" variant="primary" data-test-id="login-button-submit" @@ -83,6 +103,10 @@ export default { disableSubmitButton: false, languages: [ { + value: 'ru-RU', + text: 'Русский', + }, + { value: 'en-US', text: 'English', }, @@ -90,10 +114,6 @@ export default { value: 'es', text: 'Español', }, - { - value: 'ru-RU', - text: 'Русский', - }, ], }; }, @@ -132,6 +152,7 @@ export default { ); }) .then((passwordChangeRequired) => { + console.log(passwordChangeRequired); if (passwordChangeRequired) { this.$router.push('/change-password'); } else { @@ -144,3 +165,26 @@ export default { }, }; </script> +<style scoped> +.username-input, +.password-input { + height: 56px; + margin: -30px 0 0 0; + padding-top: 30px; + font-family: Inter; + font-size: 14px; + font-weight: 500; + line-height: 20px; + letter-spacing: 0em; +} + +.text-input { + margin: 0 0 0 50px; + padding: 0 0 0 5px; +} + +.login-button { + height: 36px; + width: 380px; +} +</style> diff --git a/src/views/Login/index.js b/src/views/Login/index.js index 8fe0250d..3eac6cc0 100644 --- a/src/views/Login/index.js +++ b/src/views/Login/index.js @@ -1,2 +1 @@ -import Login from './Login.vue'; -export default Login; +export { default } from './Login.vue'; |