d6f3269d6c
Meinen Namen auf den Login und Registrieren und User Bearbeiten hinzugefügt. Damit jeder weis das das von mir designt wurde!
125 lines
4.5 KiB
Plaintext
125 lines
4.5 KiB
Plaintext
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
|
|
<script src="https://www.gstatic.com/firebasejs/5.7.0/firebase-app.js"></script>
|
|
<script src="https://www.gstatic.com/firebasejs/5.7.0/firebase-auth.js"></script>
|
|
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
|
|
<link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.teal-green.min.css" />
|
|
<title>Registrieren</title>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="vue-app">
|
|
<div class="mdl-layout mdl-js-layout">
|
|
<div id="login-conatiner" class="mdl-card mdl-shadow--16dp">
|
|
<div class="mdl-card__supporting-text">
|
|
<div id="login-fab" class="mdl-color--accent mdl-color-text--white">
|
|
<i id="lock-icon" class="material-icons">lock</i>
|
|
</div>
|
|
<div id="card-heading">
|
|
User Registrieren
|
|
</div>
|
|
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
|
|
<input class="mdl-textfield__input" v-model="name" id="name" type="name">
|
|
<label class="mdl-textfield__label" for="name">Name</label>
|
|
</div>
|
|
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
|
|
<input class="mdl-textfield__input" v-model="email" id="email" type="email">
|
|
<label class="mdl-textfield__label" for="email">Email</label>
|
|
</div>
|
|
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
|
|
<input class="mdl-textfield__input" v-model="password" id="password" type="password">
|
|
<label class="mdl-textfield__label" for="password">Password</label>
|
|
</div>
|
|
<button id="login-button" @click="registerEmail()" v-show="email && password && name"
|
|
class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-js-ripple-effect mdl-color-text--white">
|
|
Jetzt Registrieren
|
|
</button>
|
|
</div>
|
|
<div class="mdl-card__actions">
|
|
<a href="/"><button class="mdl-button mdl-js-button mdl-button--primary">Zurück zum
|
|
Login</button></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="mdl-mega-footer__bottom-section">
|
|
<ul class="mdl-mega-footer__link-list">
|
|
<li>Created by Georg Reisinger</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>
|
|
<script src="javascripts/registerEmail.js"></script>
|
|
<style>
|
|
* {
|
|
overflow-x: hidden;
|
|
margin: 0px;
|
|
padding: 0px;
|
|
}
|
|
|
|
body {
|
|
background-color: rgba(0, 0, 0, 0.0392156862745098);
|
|
background: linear-gradient(-45deg, rgba(16, 0, 78, 0.3686274509803922), rgba(20, 4, 81, 0));
|
|
}
|
|
|
|
#login-conatiner {
|
|
margin: auto;
|
|
}
|
|
|
|
.mdl-card,
|
|
.mdl-card__supporting-text {
|
|
overflow: inherit !important;
|
|
}
|
|
|
|
.mdl-card {
|
|
overflow: visible !important;
|
|
z-index: auto !important;
|
|
}
|
|
|
|
#login-fab {
|
|
border-radius: 50%;
|
|
height: 56px;
|
|
margin: auto;
|
|
min-width: 56px;
|
|
width: 56px;
|
|
overflow: hidden;
|
|
background: rgba(158, 158, 158, .2);
|
|
box-shadow: 0 1px 1.5px 0 rgba(0, 0, 0, .12), 0 1px 1px 0 rgba(0, 0, 0, .24);
|
|
position: absolute;
|
|
top: -30px;
|
|
text-align: center;
|
|
left: 0;
|
|
right: 0;
|
|
}
|
|
|
|
#lock-icon {
|
|
line-height: 56px;
|
|
}
|
|
|
|
#login-button {
|
|
width: 100%;
|
|
height: 40px;
|
|
min-width: initial;
|
|
}
|
|
|
|
#card-heading {
|
|
text-align: center;
|
|
font-weight: 600;
|
|
font-size: 32px;
|
|
height: 30px;
|
|
padding-top: 30px;
|
|
color: rgba(0, 0, 0, 0.31);
|
|
}
|
|
|
|
#forgotpassword {
|
|
float: right;
|
|
}
|
|
</style>
|
|
</body>
|
|
|
|
</html> |