mirror of
https://github.com/IrosTheBeggar/mStream.git
synced 2025-10-27 07:31:02 +00:00
update login page
This commit is contained in:
IrosTheBeggar
parent
288a32fce9
commit
ac77ce6274
@ -20,118 +20,105 @@
|
||||
<script defer src="../assets/js/lib/izi-toast.js"></script>
|
||||
<script defer src="../assets/js/api.js"></script>
|
||||
<script defer src="index.js"></script>
|
||||
<script defer src="../assets/js/waves.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="../assets/css/izi-toast.css">
|
||||
<link rel="stylesheet" href="../assets/css/material-input.css">
|
||||
<link rel="stylesheet" href="../assets/css/waves.css">
|
||||
|
||||
<link rel="stylesheet" href="../assets/css/materialize.css">
|
||||
<script defer src="../assets/js/lib/materialize.js"></script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
|
||||
background-color: #3c414e;
|
||||
margin: 0;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-content: start;
|
||||
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.container {
|
||||
font-family:'Roboto';
|
||||
width:600px;
|
||||
margin:30px auto 0;
|
||||
display:block;
|
||||
background:#262a33;
|
||||
padding:10px 50px 50px;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: rgb(101, 126, 228);
|
||||
border-radius: 3px;
|
||||
border: none;
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
background-color: #1e2228;
|
||||
color: #FFF;
|
||||
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
margin: 40px 0px 0px 0px;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.logo {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
.container {
|
||||
height: 100%;
|
||||
width: 100vw;
|
||||
margin: 0;
|
||||
padding: 0 20px 0 20px;
|
||||
/* label color */
|
||||
input{
|
||||
color: #FFF;
|
||||
}
|
||||
.logo {
|
||||
margin-top: 50px;
|
||||
|
||||
.spacer {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
.logo {
|
||||
margin-top: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg class="logo" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 612 153" style="enable-background:new 0 0 612 153;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#264679;}
|
||||
.st1{fill-rule:evenodd;clip-rule:evenodd;fill:#6684B2;}
|
||||
.st2{fill-rule:evenodd;clip-rule:evenodd;fill:#26477B;}
|
||||
</style>
|
||||
<g>
|
||||
<path class="st0" d="M179.9,45.5c-6.2,0-11.5,1.7-15.9,5c-4.4,3.3-6.5,8.1-6.5,14.4c0,4.9,1.3,9.1,3.8,12.4
|
||||
c2.5,3.4,5.7,5.8,9.3,7.3c3.7,1.5,7.3,2.8,11,3.8c3.7,1,6.8,2.3,9.3,3.9c2.5,1.5,3.8,3.5,3.8,5.8c0,4.8-4.4,7.2-13.1,7.2h-24.1V118
|
||||
h24.1c17.1,0,25.6-6.7,25.6-20.2c0-1.9-0.2-3.8-0.6-5.8c-0.4-2-1.2-4-2.6-6c-1.3-2.1-3.3-3.7-5.8-4.9c-2.5-1.2-6.4-2.7-11.5-4.5
|
||||
l-8.8-3.1c-0.7-0.2-1.7-0.7-2.9-1.3c-1.3-0.7-2.2-1.3-2.8-1.9c-0.6-0.6-1.1-1.4-1.6-2.3c-0.5-0.9-0.7-2-0.7-3.2c0-2,1-3.5,2.9-4.6
|
||||
c1.9-1.1,4.3-1.6,7-1.6h24.6V45.5H179.9z"/>
|
||||
<path class="st0" d="M226.4,58.3v31c0,10.2,2.5,17.6,7.6,22c5.1,4.4,13,6.6,23.7,6.6v-12.8c-2.7,0-4.9-0.2-6.8-0.4
|
||||
c-1.8-0.3-3.7-0.9-5.8-1.9c-2-0.9-3.6-2.6-4.7-4.9c-1.1-2.3-1.6-5.2-1.6-8.7V58.3h18.8V45.5h-18.8V31.6L214,58.3H226.4z"/>
|
||||
<path class="st0" d="M281.1,118V76.8c0-7.2,0.9-12,2.6-14.5c1-1.3,2.2-2.2,3.6-2.8c1.4-0.6,2.6-1,3.6-1.1c1-0.1,2.5-0.1,4.3-0.1
|
||||
H310V45.5h-12.2c-3.6,0-6.5,0.1-8.6,0.3c-2.1,0.2-4.5,0.9-7.3,2c-2.8,1.1-5.1,2.8-7.1,5c-4,4.4-6,12.4-6,24V118H281.1z"/>
|
||||
<path class="st0" d="M326.2,53.8c-6.2,7.4-9.3,17-9.3,28.9c0,10.7,3.2,19.4,9.5,26.2s14.7,10.1,25.3,10.1c8.7,0,16.3-2.7,22.7-8.1
|
||||
L366,102c-3.7,2.1-8.5,3.2-14.3,3.2c-6.5,0-11.8-2.3-15.8-6.9c-4-4.6-6-10.5-6-17.9c0-7,1.9-12.9,5.6-17.9c3.8-5,8.9-7.5,15.5-7.5
|
||||
c3.3,0,6.1,0.8,8.2,2.4c2.1,1.6,3.2,4,3.2,7.2c0,5-1.2,8.5-3.6,10.6c-2.4,2.1-6.7,3.2-12.9,3.2h-6.7v11.7h5.7
|
||||
c20.3,0,30.5-8.5,30.5-25.4c0-13.6-7.9-20.7-23.7-21.5C340.9,43,332.4,46.5,326.2,53.8z"/>
|
||||
<path class="st0" d="M412.3,73.2c-7.4,0-13.6,1.9-18.5,5.7c-4.9,3.8-7.4,9.4-7.4,16.7c0,7.3,2.3,12.9,7,16.7
|
||||
c4.6,3.8,10.9,5.7,18.8,5.7h31V73.6c0-9.1-2.4-16-7.2-20.8c-4.8-4.8-11.7-7.2-20.7-7.2h-22.9v12.8h22.3c10.9,0,16.4,6.1,16.4,18.2
|
||||
v28.7h-18.4c-9.1,0-13.6-3.2-13.6-9.8c0-3.3,1.2-5.9,3.6-7.8c2.4-1.8,5.8-2.7,10.2-2.7c5.1,0,9.4,1.4,12.9,4.3V75.3
|
||||
C420.9,73.9,416.5,73.2,412.3,73.2z"/>
|
||||
<path class="st0" d="M458.8,118H471V58.3h24.4V118h12.2V58.3h5.7c6.8,0,11.3,0.7,13.5,2c4.3,2.5,6.5,7.7,6.5,15.5V118h12.2V75.7
|
||||
c0-6-0.6-11.2-1.9-15.5c-1.2-4.3-3.9-7.8-7.9-10.6c-3.9-2.7-9.1-4.1-15.7-4.1h-61.4V118z"/>
|
||||
<polygon class="st1" points="75,118.5 75,35.5 96,48.5 96,118.5 "/>
|
||||
<polygon class="st2" points="99,118.5 99,49.5 110.5,56.5 121,49.5 121,118.5 "/>
|
||||
<polygon class="st1" points="124,118.5 124,48.5 145,35.5 145,118.5 "/>
|
||||
</g>
|
||||
</svg>
|
||||
<div class="row">
|
||||
<div class="col s12 m1 l2"></div>
|
||||
<div class="col s12 m10 l8">
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg class="logo" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 612 153" style="enable-background:new 0 0 612 153;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#264679;}
|
||||
.st1{fill-rule:evenodd;clip-rule:evenodd;fill:#6684B2;}
|
||||
.st2{fill-rule:evenodd;clip-rule:evenodd;fill:#26477B;}
|
||||
</style>
|
||||
<g>
|
||||
<path class="st0" d="M179.9,45.5c-6.2,0-11.5,1.7-15.9,5c-4.4,3.3-6.5,8.1-6.5,14.4c0,4.9,1.3,9.1,3.8,12.4
|
||||
c2.5,3.4,5.7,5.8,9.3,7.3c3.7,1.5,7.3,2.8,11,3.8c3.7,1,6.8,2.3,9.3,3.9c2.5,1.5,3.8,3.5,3.8,5.8c0,4.8-4.4,7.2-13.1,7.2h-24.1V118
|
||||
h24.1c17.1,0,25.6-6.7,25.6-20.2c0-1.9-0.2-3.8-0.6-5.8c-0.4-2-1.2-4-2.6-6c-1.3-2.1-3.3-3.7-5.8-4.9c-2.5-1.2-6.4-2.7-11.5-4.5
|
||||
l-8.8-3.1c-0.7-0.2-1.7-0.7-2.9-1.3c-1.3-0.7-2.2-1.3-2.8-1.9c-0.6-0.6-1.1-1.4-1.6-2.3c-0.5-0.9-0.7-2-0.7-3.2c0-2,1-3.5,2.9-4.6
|
||||
c1.9-1.1,4.3-1.6,7-1.6h24.6V45.5H179.9z"/>
|
||||
<path class="st0" d="M226.4,58.3v31c0,10.2,2.5,17.6,7.6,22c5.1,4.4,13,6.6,23.7,6.6v-12.8c-2.7,0-4.9-0.2-6.8-0.4
|
||||
c-1.8-0.3-3.7-0.9-5.8-1.9c-2-0.9-3.6-2.6-4.7-4.9c-1.1-2.3-1.6-5.2-1.6-8.7V58.3h18.8V45.5h-18.8V31.6L214,58.3H226.4z"/>
|
||||
<path class="st0" d="M281.1,118V76.8c0-7.2,0.9-12,2.6-14.5c1-1.3,2.2-2.2,3.6-2.8c1.4-0.6,2.6-1,3.6-1.1c1-0.1,2.5-0.1,4.3-0.1
|
||||
H310V45.5h-12.2c-3.6,0-6.5,0.1-8.6,0.3c-2.1,0.2-4.5,0.9-7.3,2c-2.8,1.1-5.1,2.8-7.1,5c-4,4.4-6,12.4-6,24V118H281.1z"/>
|
||||
<path class="st0" d="M326.2,53.8c-6.2,7.4-9.3,17-9.3,28.9c0,10.7,3.2,19.4,9.5,26.2s14.7,10.1,25.3,10.1c8.7,0,16.3-2.7,22.7-8.1
|
||||
L366,102c-3.7,2.1-8.5,3.2-14.3,3.2c-6.5,0-11.8-2.3-15.8-6.9c-4-4.6-6-10.5-6-17.9c0-7,1.9-12.9,5.6-17.9c3.8-5,8.9-7.5,15.5-7.5
|
||||
c3.3,0,6.1,0.8,8.2,2.4c2.1,1.6,3.2,4,3.2,7.2c0,5-1.2,8.5-3.6,10.6c-2.4,2.1-6.7,3.2-12.9,3.2h-6.7v11.7h5.7
|
||||
c20.3,0,30.5-8.5,30.5-25.4c0-13.6-7.9-20.7-23.7-21.5C340.9,43,332.4,46.5,326.2,53.8z"/>
|
||||
<path class="st0" d="M412.3,73.2c-7.4,0-13.6,1.9-18.5,5.7c-4.9,3.8-7.4,9.4-7.4,16.7c0,7.3,2.3,12.9,7,16.7
|
||||
c4.6,3.8,10.9,5.7,18.8,5.7h31V73.6c0-9.1-2.4-16-7.2-20.8c-4.8-4.8-11.7-7.2-20.7-7.2h-22.9v12.8h22.3c10.9,0,16.4,6.1,16.4,18.2
|
||||
v28.7h-18.4c-9.1,0-13.6-3.2-13.6-9.8c0-3.3,1.2-5.9,3.6-7.8c2.4-1.8,5.8-2.7,10.2-2.7c5.1,0,9.4,1.4,12.9,4.3V75.3
|
||||
C420.9,73.9,416.5,73.2,412.3,73.2z"/>
|
||||
<path class="st0" d="M458.8,118H471V58.3h24.4V118h12.2V58.3h5.7c6.8,0,11.3,0.7,13.5,2c4.3,2.5,6.5,7.7,6.5,15.5V118h12.2V75.7
|
||||
c0-6-0.6-11.2-1.9-15.5c-1.2-4.3-3.9-7.8-7.9-10.6c-3.9-2.7-9.1-4.1-15.7-4.1h-61.4V118z"/>
|
||||
<polygon class="st1" points="75,118.5 75,35.5 96,48.5 96,118.5 "/>
|
||||
<polygon class="st2" points="99,118.5 99,49.5 110.5,56.5 121,49.5 121,118.5 "/>
|
||||
<polygon class="st1" points="124,118.5 124,48.5 145,35.5 145,118.5 "/>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="col s12 m1 l2"></div>
|
||||
</div>
|
||||
<form id="login">
|
||||
<div class="login__group">
|
||||
<input id="email" placeholder=" " class="login__input" type="text" name="input_email" required>
|
||||
<label class="login__label" >Username</label>
|
||||
<div class="login__bar"></div>
|
||||
<div class="row">
|
||||
<div class="col s12 m2 l3"></div>
|
||||
<div class="input-field col s12 m8 l6">
|
||||
<input id="email" type="text" required>
|
||||
<label for="email">Username</label>
|
||||
</div>
|
||||
<div class="col s12 m2 l3"></div>
|
||||
</div>
|
||||
<div class="login__group">
|
||||
<input id="password" placeholder=" " class="login__input" type="password" name="input_password" required>
|
||||
<label class="login__label">Password </label>
|
||||
<div class="login__bar"></div>
|
||||
<div class="row">
|
||||
<div class="col s12 m2 l3"></div>
|
||||
<div class="input-field col s12 m8 l6">
|
||||
<input id="password" type="password" required>
|
||||
<label for="password">Password</label>
|
||||
</div>
|
||||
<div class="col s12 m2 l3"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col s12 spacer"></div>
|
||||
<div class="col s12 m6 l6"></div>
|
||||
<button class="btn waves-effect waves-light blue col s12 m4 l3" type="submit" id="form-submit" name="action">
|
||||
Login
|
||||
</button>
|
||||
<div class="col s12 m2 l3"></div>
|
||||
</div>
|
||||
<button class="my-waves" id="form-submit" type="submit">Login</button>
|
||||
</form>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user