panel/baseui
1
0
Fork 0
Code Issues 8 Pull Requests Releases Wiki Activity

cleanup login form

Browse Source
This commit is contained in:
Anton Schubert 2017-08-30 13:25:13 +02:00
parent 60dc5e2603
commit 934376e66a
1 changed files with 31 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

147
src/views/forms/login.vue
View File

@ -1,39 +1,15 @@
<template>
<!-- <div class="LoginForm">
<h2>Login</h2>
</div> -->
<div id="login_form">
<div class="holder">
<div class="logo">
<img src="assets/images/cms_logo_white.png" alt="">
<img src="assets/images/cms_logo_white.png" valid-v-on:foo="bar" alt="">
</div>
<div class="content">
<p class="intro_text">Bitte melde dich mit deinen Benutzerdaten an.</p>
<my-form :elements="elements" :buttons="buttons" :submitHandler="login"></my-form>
<!-- <form class="login_form" action="index.php" method="post">
<div class="login_input login_user">
<input required="required" placeholder="Benutzername" type="text" name="user" />
</div>
<div class="login_input login_pw">
<input required="required" placeholder="Passwort" type="password" name="passwort" />
</div>
<div class="login_input login_submit">
<input type="submit" name="submit_login" value="Anmelden" class="submit" />
</div>
</form> -->
<!-- <div class="login_error">
<p>Login fehlgeschlagen.</p>
</div> -->
<div style="clear:both;"></div>
</div>
</div>
@ -41,39 +17,37 @@
</template>
<script>
import MyForm from "../../components/my-form.vue";
import MyForm from "components/my-form";
export default {
name: "LoginForm",
components: {
MyForm
},
data() {
return {
username: "",
password: "",
elements: {
username: {
placeholder: "Benutzername",
icon: "icon-user",
type: "text",
required: true
},
password: {
placeholder: "Passwort",
icon: "icon-key",
type: "password",
required: true
}
},
buttons: [
{
label: "login",
type: "submit"
}
]
}
},
name: "LoginForm",
components: {
MyForm
},
data() {
return {
username: "",
password: "",
elements: {
username: {
placeholder: "Benutzername",
icon: "icon-user",
type: "text",
required: true
},
password: {
placeholder: "Passwort",
icon: "icon-key",
type: "password",
required: true
}
},
buttons: [{
label: "login",
type: "submit"
}]
}
},
methods: {
login(formData) {
this.$store.dispatch("login", formData)
@ -91,15 +65,12 @@ export default {
}
</script>
<style lang="less">
@import "../../mixins";
@import "~mixins";
/*--------------------------------------------------------------
# LOGINBOX
--------------------------------------------------------------*/
#login_form{
/* Disply on top */
position: fixed;
@ -156,60 +127,4 @@ export default {
}
}
}
/*.login_input {
margin-bottom:10px;
border:none;
height:40px;
position:relative;
}
.login_input:before {
}
.login_form {
text-align:center;
}
.login_user:before {content:"\f007";}
.login_pw:before {content:"\f084";}
.login_submit {
width:auto;
margin:0 auto;
display:inline-block;
margin-top:10px;
}
.login_submit:before {content:"\f090"; left:15px; top:6px;}
.login_input input {
border:none;
background:none;
height:40px;
width:100%;
padding: 0px 10px 0px 35px;
background:#f4f4f4;
border:solid 1px #FFF;
}
.loginbox_content .login_input input:focus {border:solid 1px #152129; background:#FFF;}
.login_form input[type="submit"] {
height:40px;
background:#152129;
border:none;
color:#FFF;
cursor:pointer;
text-transform:uppercase;
width:auto;
margin:0px auto 0 auto;
padding: 0px 20px 0px 40px;
border-radius:20px;
}
.login_form input[type="submit"]:hover {
background:#1f3441;
}
.login_error {
display:block;
text-align:center;
color:#FFF;
line-height:1.2;
margin-top:20px;
}*/
/*.login_error p {text-transform:uppercase; display:inline-block; background:#c70e00; padding:5px; font-weight:600; font-size:14px;}*/
</style>