ramon
/
skillbox
1
0
Fork 0
Code Issues 1 Pull Requests 1 Packages Projects 1 Releases 1 Wiki Activity

Style default layout, style login

This commit is contained in:
Christian Cueni 2019-10-02 16:46:10 +02:00
parent 9783bd802a
commit 57224d228a
5 changed files with 40 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
client/src/components/profile/PasswordChangeForm.vue
View File

@ -82,35 +82,4 @@
} }
} }
.sbform-input {
margin-bottom: 20px;
font-family: $sans-serif-font-family;
&__label {
margin-bottom: 10px;
display: inline-block;
}
&__input {
width: 100%;
&--error {
border-color: $color-error;
}
}
&__error {
margin-top: 10px;
color: $color-error;
display: inline-block;
}
&__hint {
margin-top: $small-spacing;
font-family: $sans-serif-font-family;
color: $color-silver-dark;
}
}
</style> </style>

7
client/src/layouts/PublicLayout.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div class="container skillbox"> <div class="skillbox public">
<logo></logo> <logo></logo>
<router-view class="skillbox__content"></router-view> <router-view class="skillbox__content"></router-view>
<footer class="skillbox__footer">Footer</footer> <footer class="skillbox__footer">Footer</footer>
@ -20,4 +20,9 @@ import Logo from '@/components/icons/Logo';
@import "@/styles/_mixins.scss"; @import "@/styles/_mixins.scss";
@import "@/styles/_default-layout.scss"; @import "@/styles/_default-layout.scss";
.public {
max-width: 800px;
min-width: 320px;
}
</style> </style>

35
client/src/pages/login.vue
View File

@ -52,7 +52,7 @@
data-cy="password-remote-errors" data-cy="password-remote-errors"
>{{ error }}</small> >{{ error }}</small>
</div> </div>
<div class="login-error"> <div class="sbform-input">
<small class="sbform-input__error" v-if="loginError">{{loginError}}</small> <small class="sbform-input__error" v-if="loginError">{{loginError}}</small>
</div> </div>
<button class="button button--primary change-form__submit" data-cy="change-password-button">Anmelden</button> <button class="button button--primary change-form__submit" data-cy="change-password-button">Anmelden</button>
@ -119,42 +119,13 @@ export default {
password: '', password: '',
emailErrors: [], emailErrors: [],
passwordErrors: [], passwordErrors: [],
loginError: '' loginError: '',
submitted: false
}; };
} }
}; };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
@import "@/styles/_variables.scss";
@import "@/styles/_buttons.scss";
.sbform-input {
margin-bottom: 20px;
font-family: $sans-serif-font-family;
&__label {
margin-bottom: 10px;
display: inline-block;
}
&__input {
width: 100%;
&--error {
border-color: $color-error;
}
}
&__error {
margin-top: 10px;
color: $color-error;
display: inline-block;
}
&__hint {
margin-top: $small-spacing;
font-family: $sans-serif-font-family;
color: $color-silver-dark;
}
}
</style> </style>

30
client/src/styles/_password_forms.scss Normal file
View File

@ -0,0 +1,30 @@
.sbform-input {
margin-bottom: 20px;
font-family: $sans-serif-font-family;
&__label {
margin-bottom: 10px;
display: inline-block;
}
&__input {
width: 100%;
&--error {
border-color: $color-error;
}
}
&__error {
margin-top: 10px;
color: $color-error;
display: inline-block;
}
&__hint {
margin-top: $small-spacing;
font-family: $sans-serif-font-family;
color: $color-silver-dark;
}
}

1
client/src/styles/main.scss
View File

@ -18,3 +18,4 @@
@import "survey"; @import "survey";
@import "visibility"; @import "visibility";
@import "solutions"; @import "solutions";
@import "password_forms";