mirror of
https://gitlab.com/nekoya/web.git
synced 2025-01-09 11:44:10 +01:00
Modified Login Page
This commit is contained in:
parent
c0b0f627dc
commit
27c7c4f330
1 changed files with 87 additions and 6 deletions
93
login.html
93
login.html
|
@ -13,7 +13,7 @@
|
|||
<link crossorigin href="https://fonts.gstatic.com" rel="preconnect">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
|
||||
<script src="https://unpkg.com/feather-icons"></script>
|
||||
|
||||
<script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script>
|
||||
<style>
|
||||
body {
|
||||
font-family: 'Poppins', sans-serif;
|
||||
|
@ -106,7 +106,53 @@
|
|||
text-decoration: underline;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 425px) {
|
||||
.login-with {
|
||||
color: white;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.links {
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
color: white;
|
||||
margin: 0 0 20px 0;
|
||||
}
|
||||
|
||||
.google, .facebook {
|
||||
width: 100%;
|
||||
height: 42px;
|
||||
line-height: 45px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.google {
|
||||
background: white;
|
||||
border: 1px solid white;
|
||||
color: #1b1c1e;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.facebook {
|
||||
background: #4267B2;
|
||||
border: 1px solid #3e61a8;
|
||||
margin-left: 10px
|
||||
}
|
||||
|
||||
.google:hover{
|
||||
background: #e0e0e0;
|
||||
}
|
||||
|
||||
|
||||
.facebook:hover{
|
||||
background: #3e61a8;
|
||||
}
|
||||
|
||||
.links i{
|
||||
font-size: 17px;
|
||||
|
||||
}
|
||||
|
||||
@media screen and (max-width: 426px) {
|
||||
.card a, input {
|
||||
font-size: 3vw;
|
||||
}
|
||||
|
@ -114,9 +160,14 @@
|
|||
.card-header {
|
||||
font-size: 6vw;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
width: 15vw;
|
||||
height: 15vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 426px) {
|
||||
@media screen and (min-width: 427px) {
|
||||
.card a, input {
|
||||
font-size: 2vw;
|
||||
}
|
||||
|
@ -124,6 +175,11 @@
|
|||
.card-header {
|
||||
font-size: 5vw;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
width: 11vw;
|
||||
height: 11vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 767px) {
|
||||
|
@ -134,6 +190,11 @@
|
|||
.card-header {
|
||||
font-size: 4vw;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
width: 8vw;
|
||||
height: 8vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 993px) {
|
||||
|
@ -144,6 +205,11 @@
|
|||
.card-header {
|
||||
font-size: 2.5vw;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
width: 6vw;
|
||||
height: 6vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1400px) {
|
||||
|
@ -154,6 +220,11 @@
|
|||
.card-header {
|
||||
font-size: 2.5vw;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
width: 6vw;
|
||||
height: 6vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 500px) {
|
||||
|
@ -206,14 +277,24 @@
|
|||
<label for="exampleDropdownFormPassword1">Password</label>
|
||||
<input class="form-control input-sm text-center" id="exampleDropdownFormPassword1"
|
||||
placeholder="Password" type="password">
|
||||
<br>
|
||||
|
||||
<div class="options-01 hoverlogin-1" style="word-break: keep-all;">
|
||||
<label class="remember-me text-left"><input name="" type="checkbox">Remember me</label>
|
||||
<a href="forgot-password.html" style="margin-left: 14%; font-size: 10pt;">Forgot your
|
||||
<a href="forgot-password.html" style="margin-left: 15%; font-size: 10pt;">Forgot your
|
||||
password?</a>
|
||||
</div>
|
||||
<button class="btn btn-login btn-primary" type="submit">Login</button>
|
||||
|
||||
<div class="login-with">Or login with
|
||||
<div class="links">
|
||||
<div class="google">
|
||||
<i class="fab fa-google"><a href=""></a><img class="google-icon-svg" src="https://upload.wikimedia.org/wikipedia/commons/5/53/Google_%22G%22_Logo.svg"/><span></span></i>
|
||||
</div>
|
||||
<div class="facebook">
|
||||
<i class="fab fa-facebook-f"><a href=""></a><img class="facebook-icon-svg" src="https://cdn-icons-png.flaticon.com/128/733/733547.png" style="height: 30px; width: 30px; margin: 0 30px; padding-top: -3px" ><span></span></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hoverlogin-1 text-center">
|
||||
<a href="register.html">Not Have Account? Sign up</a>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue