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

Style inputs, make registration page public

This commit is contained in:
Christian Cueni 2019-10-23 10:56:42 +02:00
parent f3ae0fec7e
commit 836cd63cfd
4 changed files with 65 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
client/package-lock.json generated
View File

@ -11428,7 +11428,8 @@
"ansi-regex": { "ansi-regex": {
"version": "2.1.1", "version": "2.1.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"aproba": { "aproba": {
"version": "1.2.0", "version": "1.2.0",
@ -11456,6 +11457,7 @@
"version": "1.1.11", "version": "1.1.11",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"balanced-match": "^1.0.0", "balanced-match": "^1.0.0",
"concat-map": "0.0.1" "concat-map": "0.0.1"
@ -11470,7 +11472,8 @@
"code-point-at": { "code-point-at": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"concat-map": { "concat-map": {
"version": "0.0.1", "version": "0.0.1",
@ -11481,7 +11484,8 @@
"console-control-strings": { "console-control-strings": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"core-util-is": { "core-util-is": {
"version": "1.0.2", "version": "1.0.2",
@ -11598,7 +11602,8 @@
"inherits": { "inherits": {
"version": "2.0.3", "version": "2.0.3",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"ini": { "ini": {
"version": "1.3.5", "version": "1.3.5",
@ -11610,6 +11615,7 @@
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"number-is-nan": "^1.0.0" "number-is-nan": "^1.0.0"
} }
@ -11624,6 +11630,7 @@
"version": "3.0.4", "version": "3.0.4",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"brace-expansion": "^1.1.7" "brace-expansion": "^1.1.7"
} }
@ -11631,12 +11638,14 @@
"minimist": { "minimist": {
"version": "0.0.8", "version": "0.0.8",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"minipass": { "minipass": {
"version": "2.3.5", "version": "2.3.5",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"safe-buffer": "^5.1.2", "safe-buffer": "^5.1.2",
"yallist": "^3.0.0" "yallist": "^3.0.0"
@ -11655,6 +11664,7 @@
"version": "0.5.1", "version": "0.5.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"minimist": "0.0.8" "minimist": "0.0.8"
} }
@ -11735,7 +11745,8 @@
"number-is-nan": { "number-is-nan": {
"version": "1.0.1", "version": "1.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"object-assign": { "object-assign": {
"version": "4.1.1", "version": "4.1.1",
@ -11747,6 +11758,7 @@
"version": "1.4.0", "version": "1.4.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"wrappy": "1" "wrappy": "1"
} }
@ -11832,7 +11844,8 @@
"safe-buffer": { "safe-buffer": {
"version": "5.1.2", "version": "5.1.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"safer-buffer": { "safer-buffer": {
"version": "2.1.2", "version": "2.1.2",
@ -11868,6 +11881,7 @@
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"code-point-at": "^1.0.0", "code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0", "is-fullwidth-code-point": "^1.0.0",
@ -11887,6 +11901,7 @@
"version": "3.0.1", "version": "3.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"ansi-regex": "^2.0.0" "ansi-regex": "^2.0.0"
} }
@ -11930,12 +11945,14 @@
"wrappy": { "wrappy": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"yallist": { "yallist": {
"version": "3.0.3", "version": "3.0.3",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
} }
} }
}, },

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

@ -59,10 +59,11 @@
<button class="button button--primary button--big actions__submit" data-cy="login-button">Anmelden</button> <button class="button button--primary button--big actions__submit" data-cy="login-button">Anmelden</button>
<a class="actions__reset text-link" href="/accounts/password_reset/">Passwort vergessen?</a> <a class="actions__reset text-link" href="/accounts/password_reset/">Passwort vergessen?</a>
</div> </div>
<!--div class="registration"> <div class="registration">
<p class="registration__text">Haben Sie noch kein Konto?</p> <p class="registration__text">Haben Sie noch kein Konto?</p>
<a class="registration__link text-link" href="/accounts/password_reset/">Jetzt registrieren</a> <router-link class="registration__link text-link" :to="{name: 'registration'}">Jetzt registrieren
</div--> </router-link>
</div>
</form> </form>
</div> </div>
</template> </template>

53
client/src/pages/registration.vue
View File

@ -2,8 +2,8 @@
<div class="registration"> <div class="registration">
<h1 class="registration__title">Registrieren Sie ihr persönliches Konto.</h1> <h1 class="registration__title">Registrieren Sie ihr persönliches Konto.</h1>
<form class="registration__form registration-form" novalidate @submit.prevent="validateBeforeSubmit"> <form class="registration__form registration-form" novalidate @submit.prevent="validateBeforeSubmit">
<div class="registration-form__field sbform-input"> <div class="registration-form__field skillboxform-input">
<label for="firstname" class="sbform-input__label">Vorname</label> <label for="firstname" class="skillboxform-input__label">Vorname</label>
<input <input
id="firstname" id="firstname"
name="firstname" name="firstname"
@ -11,25 +11,25 @@
v-model="firstname" v-model="firstname"
data-vv-as="Vorname" data-vv-as="Vorname"
v-validate="'required'" v-validate="'required'"
:class="{ 'sbform-input__input--error': errors.has('firstname') }" :class="{ 'skillboxform-input__input--error': errors.has('firstname') }"
class="change-form__firstname skillbox-input sbform-input__input" class="change-form__firstname skillbox-input skillboxform-input__input"
autocomplete="off" autocomplete="off"
data-cy="firstname-input" data-cy="firstname-input"
/> />
<small <small
v-if="errors.has('firstname') && submitted" v-if="errors.has('firstname') && submitted"
class="sbform-input__error" class="skillboxform-input__error"
data-cy="firstname-local-errors" data-cy="firstname-local-errors"
>{{ errors.first('firstname') }}</small> >{{ errors.first('firstname') }}</small>
<small <small
v-for="error in firstnameErrors" v-for="error in firstnameErrors"
:key="error" :key="error"
class="sbform-input__error" class="skillboxform-input__error"
data-cy="firstname-remote-errors" data-cy="firstname-remote-errors"
>{{ error }}</small> >{{ error }}</small>
</div> </div>
<div class="change-form__field sbform-input"> <div class="change-form__field skillboxform-input">
<label for="lastname" class="sbform-input__label">Nachname</label> <label for="lastname" class="skillboxform-input__label">Nachname</label>
<input <input
id="lastname" id="lastname"
name="lastname" name="lastname"
@ -37,25 +37,25 @@
v-model="lastname" v-model="lastname"
data-vv-as="Nachname" data-vv-as="Nachname"
v-validate="'required'" v-validate="'required'"
:class="{ 'sbform-input__input--error': errors.has('lastname') }" :class="{ 'skillboxform-input__input--error': errors.has('lastname') }"
class="change-form__new skillbox-input sbform-input__input" class="change-form__new skillbox-input skillboxform-input__input"
autocomplete="off" autocomplete="off"
data-cy="lastname-input" data-cy="lastname-input"
/> />
<small <small
v-if="errors.has('lastname') && submitted" v-if="errors.has('lastname') && submitted"
class="sbform-input__error" class="skillboxform-input__error"
data-cy="lastname-local-errors" data-cy="lastname-local-errors"
>{{ errors.first('lastname') }}</small> >{{ errors.first('lastname') }}</small>
<small <small
v-for="error in lastnameErrors" v-for="error in lastnameErrors"
:key="error" :key="error"
class="sbform-input__error" class="skillboxform-input__error"
data-cy="lastname-remote-errors" data-cy="lastname-remote-errors"
>{{ error }}</small> >{{ error }}</small>
</div> </div>
<div class="change-form__field sbform-input"> <div class="change-form__field skillboxform-input">
<label for="email" class="sbform-input__label">E-Mail</label> <label for="email" class="skillboxform-input__label">E-Mail</label>
<input <input
id="email" id="email"
name="email" name="email"
@ -63,25 +63,25 @@
v-model="email" v-model="email"
data-vv-as="E-Mail" data-vv-as="E-Mail"
v-validate="'required|email'" v-validate="'required|email'"
:class="{ 'sbform-input__input--error': errors.has('email') }" :class="{ 'skillboxform-input__input--error': errors.has('email') }"
class="change-form__new skillbox-input sbform-input__input" class="change-form__new skillbox-input skillboxform-input__input"
autocomplete="off" autocomplete="off"
data-cy="email-input" data-cy="email-input"
/> />
<small <small
v-if="errors.has('email') && submitted" v-if="errors.has('email') && submitted"
class="sbform-input__error" class="skillboxform-input__error"
data-cy="email-local-errors" data-cy="email-local-errors"
>{{ errors.first('email') }}</small> >{{ errors.first('email') }}</small>
<small <small
v-for="error in emailErrors" v-for="error in emailErrors"
:key="error" :key="error"
class="sbform-input__error" class="skillboxform-input__error"
data-cy="email-remote-errors" data-cy="email-remote-errors"
>{{ error }}</small> >{{ error }}</small>
</div> </div>
<div class="change-form__field sbform-input"> <div class="change-form__field skillboxform-input">
<label for="licenseKey" class="sbform-input__label">Lizenz</label> <label for="licenseKey" class="skillboxform-input__label">Lizenz</label>
<input <input
id="licenseKey" id="licenseKey"
name="licenseKey" name="licenseKey"
@ -89,25 +89,25 @@
v-model="licenseKey" v-model="licenseKey"
data-vv-as="Lizenz" data-vv-as="Lizenz"
v-validate="'required'" v-validate="'required'"
:class="{ 'sbform-input__input--error': errors.has('licenseKey') }" :class="{ 'skillboxform-input__input--error': errors.has('licenseKey') }"
class="change-form__new skillbox-input sbform-input__input" class="change-form__new skillbox-input skillboxform-input__input"
autocomplete="off" autocomplete="off"
data-cy="licenseKey-input" data-cy="licenseKey-input"
/> />
<small <small
v-if="errors.has('licenseKey') && submitted" v-if="errors.has('licenseKey') && submitted"
class="sbform-input__error" class="skillboxform-input__error"
data-cy="licenseKey-local-errors" data-cy="licenseKey-local-errors"
>{{ errors.first('licenseKey') }}</small> >{{ errors.first('licenseKey') }}</small>
<small <small
v-for="error in licenseKeyErrors" v-for="error in licenseKeyErrors"
:key="error" :key="error"
class="sbform-input__error" class="skillboxform-input__error"
data-cy="licenseKey-remote-errors" data-cy="licenseKey-remote-errors"
>{{ error }}</small> >{{ error }}</small>
</div> </div>
<div class="sbform-input"> <div class="skillboxform-input">
<small class="sbform-input__error" data-cy="registration-error" v-if="registrationError">{{registrationError}}</small> <small class="skillboxform-input__error" data-cy="registration-error" v-if="registrationError">{{registrationError}}</small>
</div> </div>
<div class="actions"> <div class="actions">
<button class="button button--primary button--big actions__submit" data-cy="registration-button">Jetzt registration</button> <button class="button button--primary button--big actions__submit" data-cy="registration-button">Jetzt registration</button>
@ -229,7 +229,6 @@ export default {
} }
.registration { .registration {
margin-top: $large-spacing;
&__text { &__text {
font-family: $sans-serif-font-family; font-family: $sans-serif-font-family;
margin-bottom: $small-spacing; margin-bottom: $small-spacing;

10
client/src/router/index.js
View File

@ -118,7 +118,15 @@ const routes = [
props: true, props: true,
meta: {layout: 'simple'} meta: {layout: 'simple'}
}, },
{path: '/register', component: registration}, {
path: '/register',
component: registration,
name: 'registration',
meta: {
public: true,
layout: 'public',
}
},
{path: '/styleguide', component: styleGuidePage}, {path: '/styleguide', component: styleGuidePage},
{path: '*', component: p404} {path: '*', component: p404}
]; ];