style: pełny ekran rejestracji i logowania
This commit is contained in:
parent
7342d627fc
commit
136fdc17d5
6
frontend/_global/style.css
Normal file
6
frontend/_global/style.css
Normal file
@ -0,0 +1,6 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');
|
||||
|
||||
/*FONTS*/
|
||||
@font-face {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
}
|
||||
@ -0,0 +1,37 @@
|
||||
/*##################*/
|
||||
ul {
|
||||
float: left;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
/*background-color: #0B4D39;*/
|
||||
}
|
||||
|
||||
li a {
|
||||
display: block;
|
||||
float: left;
|
||||
text-align: center;
|
||||
font-size: 1.2em;
|
||||
width: 130px;
|
||||
|
||||
text-decoration: none;
|
||||
color: black;
|
||||
background-color: white;
|
||||
padding: 10px 15px;
|
||||
margin: 0px 1px 1px 0px;
|
||||
|
||||
border: 1px solid black;
|
||||
border-radius: 3px;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
box-shadow: 0px 2px 3px gray;
|
||||
-moz-box-shadow: 0px 2px 3px gray;
|
||||
-webkit-box-shadow: 0px 2px 3px gray;
|
||||
}
|
||||
|
||||
li a:hover {
|
||||
color: black;
|
||||
background: #AFAFAF;
|
||||
border: 1px solid black;
|
||||
}
|
||||
@ -28,6 +28,16 @@
|
||||
|
||||
<div class="container">
|
||||
|
||||
<div class="bookmarks">
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="../index.html">Informacje</a></li>
|
||||
<li><a href="../zapisy/index.html">Zapisy</a></li>
|
||||
<li><a href="../drabinka/index.html">Drabinka</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
<button type="button" class="collapsible">Drabinka Główna</button>
|
||||
|
||||
<!-- Zawartość collapsu-->
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
@import "css/collapsible.css";
|
||||
@import "css/round.css";
|
||||
@import "../../../../_global/header.css";
|
||||
@import "css/bookmarks.css";
|
||||
|
||||
|
||||
body {
|
||||
@ -34,4 +35,15 @@ body {
|
||||
main {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.bookmarks {
|
||||
/*Alignment*/
|
||||
margin: auto;
|
||||
width: 50%;
|
||||
height: 5vh;
|
||||
|
||||
/*Others*/
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
@ -1,6 +1,7 @@
|
||||
@import "../../../_global/header.css";
|
||||
@import "css/tournament_detail_header.css";
|
||||
@import "css/bookmarks.css";
|
||||
@import "../../../_global/style.css";
|
||||
|
||||
/*0 layer*/
|
||||
body {
|
||||
|
||||
@ -41,9 +41,9 @@
|
||||
<!-- OPEN-->
|
||||
<button type="button" class="collapsible">Zapisani na turniej - OPEN</button>
|
||||
<div class="collapsibleContent">
|
||||
<main id="tournament7">
|
||||
Siemanko
|
||||
</main>
|
||||
<div class="participant">
|
||||
To ja
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- MIKST-->
|
||||
|
||||
@ -3,6 +3,7 @@
|
||||
@import "css/round.css";
|
||||
@import "../../../../_global/header.css";
|
||||
@import "bookmarks.css";
|
||||
@import "../../../../_global/style.css";
|
||||
|
||||
|
||||
body {
|
||||
@ -15,7 +16,7 @@ body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
flex-flow: row wrap;
|
||||
/*flex-flow: row wrap;*/
|
||||
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
@ -56,4 +57,25 @@ main {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bookmarks {
|
||||
/*Alignment*/
|
||||
margin: auto;
|
||||
width: 50%;
|
||||
height: 5vh;
|
||||
|
||||
/*Others*/
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.participant {
|
||||
height: 10vh;
|
||||
width: 50%;
|
||||
|
||||
background-color: #0f64f2;
|
||||
color: #CF2323;
|
||||
|
||||
border: 1px solid black;
|
||||
}
|
||||
@ -1,6 +1,7 @@
|
||||
@import "../../_global/header.css";
|
||||
@import "pojedynczy_turniej/css/single_tournament.css";
|
||||
@import "pojedynczy_turniej/css/settings.css";
|
||||
@import "../../_global/style.css";
|
||||
|
||||
/*main*/
|
||||
body {
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
@import "../../_global/header.css";
|
||||
@import "../../_global/style.css";
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="en" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
@ -12,20 +12,25 @@
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="form">
|
||||
<div class="login">
|
||||
<h2>Logowanie</h2>
|
||||
<input placeholder="Tutaj wpisz email lub nick" id="loginusername">
|
||||
<div class="login_header">
|
||||
<img src="../../_global/logo.svg" alt="">
|
||||
</div>
|
||||
|
||||
<input placeholder="Tutaj wpisz hasło" id="loginpassword">
|
||||
<div class="loginBox">
|
||||
<h2>Logowanie</h2>
|
||||
<input class="login_input" placeholder="Tutaj wpisz email lub nick" id="loginusername">
|
||||
|
||||
<input class="password_input" placeholder="Tutaj wpisz hasło" id="loginpassword" type="password">
|
||||
<br>
|
||||
|
||||
<!-- trzeba dać cssy buttonowi bo zmieniłem z form na button -->
|
||||
<button class="myButton" id="loginsubmit" onclick="login()">
|
||||
Zaloguj
|
||||
ZALOGUJ
|
||||
</button>
|
||||
<br>
|
||||
<a href="#">Zapomniałeś hasła?</a>
|
||||
<br>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="login_footer">
|
||||
<span> Nie masz konta? <a href="rejestracja/index.html">Zajerestruj się</a></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -0,0 +1,165 @@
|
||||
/*Imię i Nazwisko*/
|
||||
/*Layer 4*/
|
||||
.imieBox {
|
||||
position: relative;
|
||||
/*flex-wrap: nowrap;*/
|
||||
height: 10%;
|
||||
margin-bottom: 4%;
|
||||
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
/*Layer 5*/
|
||||
.nameForm {
|
||||
width: 50%;
|
||||
|
||||
margin: 0;
|
||||
|
||||
padding-top: 1%;
|
||||
padding-bottom: 1%;
|
||||
padding-left: 2%;
|
||||
|
||||
|
||||
float: right;
|
||||
text-align: left;
|
||||
}
|
||||
.surnameForm {
|
||||
width: 50%;
|
||||
|
||||
margin: 0;
|
||||
|
||||
padding-top: 1%;
|
||||
padding-bottom: 1%;
|
||||
padding-left: 2%;
|
||||
|
||||
float: right;
|
||||
text-align: left;
|
||||
|
||||
}
|
||||
|
||||
/*Login*/
|
||||
/*Layer 4*/
|
||||
.loginBox {
|
||||
width: 100%;
|
||||
height: 10%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*Layer 5*/
|
||||
.personImg {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
/*float: left;*/
|
||||
left: 1%
|
||||
}
|
||||
|
||||
.loginForm {
|
||||
padding-top: 1%;
|
||||
padding-bottom: 1%;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
|
||||
float: right;
|
||||
text-align: left;
|
||||
padding-left: 7%;
|
||||
}
|
||||
|
||||
/*Email*/
|
||||
/*Layer 4*/
|
||||
.emailBox {
|
||||
width: 100%;
|
||||
height: 10%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*Layer 5*/
|
||||
.emailImg {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
/*float: left;*/
|
||||
left: 1%;
|
||||
}
|
||||
|
||||
.emailForm {
|
||||
padding-top: 1%;
|
||||
padding-bottom: 1%;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
|
||||
float: right;
|
||||
text-align: left;
|
||||
padding-left: 7%;
|
||||
}
|
||||
|
||||
|
||||
/*Phone*/
|
||||
/*Layer 4*/
|
||||
.phoneBox {
|
||||
width: 100%;
|
||||
height: 10%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*Layer 5*/
|
||||
.phoneImg {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
left: 1%
|
||||
/*float: left;*/
|
||||
}
|
||||
|
||||
.phoneForm {
|
||||
padding-top: 1%;
|
||||
padding-bottom: 1%;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
|
||||
float: right;
|
||||
text-align: left;
|
||||
padding-left: 7%;
|
||||
}
|
||||
|
||||
|
||||
/*Password*/
|
||||
/*Layer 4*/
|
||||
.passBox {
|
||||
width: 100%;
|
||||
height: 10%;
|
||||
|
||||
flex-wrap: nowrap;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*Layer 5*/
|
||||
.passImg {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
float: left;
|
||||
left: 1%;
|
||||
|
||||
}
|
||||
|
||||
.passForm {
|
||||
/*Align*/
|
||||
padding-top: 1%;
|
||||
padding-bottom: 1%;
|
||||
margin: 0;
|
||||
|
||||
width: 100%;
|
||||
|
||||
float: left;
|
||||
text-align: left;
|
||||
padding-left: 7%;
|
||||
|
||||
}
|
||||
|
||||
.eye {
|
||||
position: absolute;
|
||||
|
||||
right: 3%;
|
||||
top: 15%;
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="en" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
@ -14,50 +14,77 @@
|
||||
|
||||
<div class="container">
|
||||
<div class="form">
|
||||
<div class="register">
|
||||
|
||||
<div class="reg_header">
|
||||
<img class="logoImg" src="../../../_global/logo.svg" alt="">
|
||||
</div>
|
||||
|
||||
<div class="registerBox">
|
||||
<h2>Rejestracja</h2>
|
||||
|
||||
<input placeholder="Imię" id="regname">
|
||||
<span class="icon-dice"></span>
|
||||
<input placeholder="Nazwisko" id="regsurname">
|
||||
<br>
|
||||
<div class="imieBox">
|
||||
<label>
|
||||
<input class="nameForm" placeholder="Imię" id="regname">
|
||||
<input class="surnameForm" placeholder="Nazwisko" id="regsurname">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<img src="src/person.svg">
|
||||
<input placeholder="Login" id="regusername">
|
||||
<br>
|
||||
<div class="loginBox">
|
||||
<img class="personImg" src="src/person.svg" alt="">
|
||||
<label>
|
||||
<input class="loginForm" placeholder="Login" id="regusername">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<img src="src/mail.svg">
|
||||
<input placeholder="Email" id="regmail">
|
||||
<br>
|
||||
<div class="emailBox">
|
||||
<img class="emailImg" src="src/mail.svg" alt="">
|
||||
<label>
|
||||
<input class="emailForm" placeholder="Email" id="regmail">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<img src="src/phone.svg">
|
||||
<input placeholder="Telefon" id="regphone">
|
||||
<br>
|
||||
<div class="phoneBox">
|
||||
<img class="phoneImg" src="src/phone.svg" alt="">
|
||||
<label>
|
||||
<input class="phoneForm" placeholder="Telefon" id="regphone">
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<img src="src/lock.svg">
|
||||
<input placeholder="Hasło" type="password" id="regpassword" name="password">
|
||||
<i class="bi bi-eye-slash" id="togglePassword"></i>
|
||||
<br>
|
||||
<div class="passBox">
|
||||
<img class="passImg" src="src/lock.svg" alt="">
|
||||
|
||||
<img src="src/lock.svg">
|
||||
<input placeholder="Potwierdź hasło" type="password" id="password2" name="password">
|
||||
<i class="bi bi-eye-slash" id="togglePassword2"></i>
|
||||
<label>
|
||||
<input class="passForm" placeholder="Hasło" type="password" id="regpassword" name="password">
|
||||
</label>
|
||||
|
||||
<div class="bi bi-eye-slash eye" id="togglePassword"></div>
|
||||
</div>
|
||||
|
||||
<div class="passBox">
|
||||
<img class="passImg" src="src/lock.svg" alt="">
|
||||
|
||||
<label>
|
||||
<input class="passForm" placeholder="Hasło" type="password" id="regpassword2" name="password">
|
||||
</label>
|
||||
|
||||
<div class="bi bi-eye-slash eye" id="togglePassword2"></div>
|
||||
</div>
|
||||
|
||||
<button class="myButton" id="regsubmit" onclick="register()">
|
||||
Zajerestruj
|
||||
ZAREJESTRUJ
|
||||
</button>
|
||||
|
||||
<br>
|
||||
<a href="#">Zapomniałeś hasła?</a>
|
||||
<br>
|
||||
</div>
|
||||
|
||||
<div class="reg_footer">
|
||||
<span> Masz już konto? <a href="../index.html">Zaloguj się</a></span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<script type="text/javascript" src="myscript.js"></script>
|
||||
<script type="text/javascript" src="toggle.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
|
||||
@ -1,16 +1,3 @@
|
||||
//Password toggle
|
||||
const togglePassword = document.querySelector("#togglePassword");
|
||||
const password = document.querySelector("#regpassword");
|
||||
|
||||
togglePassword.addEventListener("click", function () {
|
||||
// toggle the type attribute
|
||||
const type = password.getAttribute("type") === "password" ? "text" : "password";
|
||||
password.setAttribute("type", type);
|
||||
|
||||
// toggle the icon
|
||||
this.classList.toggle("bi-eye");
|
||||
});
|
||||
|
||||
|
||||
function register() {
|
||||
fetch('https://dragonmaster.pl/inz/user/create', {
|
||||
|
||||
@ -1,61 +1,120 @@
|
||||
@import "../../../_global/style.css";
|
||||
@import "css/register_form.css";
|
||||
|
||||
/*Layer 0*/
|
||||
html {
|
||||
background-image: url(src/mezczyzna_padel.jpg);
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
|
||||
font-family: Montserrat, serif;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
* {
|
||||
/* border: 2px solid red; */
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.form {
|
||||
width: 50%;
|
||||
height: 40%;
|
||||
background-color: #EBEBEB;
|
||||
display: flex;
|
||||
;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
/*layer 1*/
|
||||
.container {
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/*Layer 2*/
|
||||
.form {
|
||||
width: 50%;
|
||||
height: 60%;
|
||||
background-color: #EBEBEB;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
border-radius: 2%;
|
||||
/*padding-top: 1%;*/
|
||||
}
|
||||
|
||||
/*Layer 3*/
|
||||
.reg_header {
|
||||
height: 15%;
|
||||
width: 100%;
|
||||
|
||||
/*padding-left: 50%;*/
|
||||
|
||||
/*margin-top: 0;*/
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.registerBox {
|
||||
width: 60%;
|
||||
height: 60%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
}
|
||||
|
||||
.reg_footer {
|
||||
height: 10%;
|
||||
width: 100%;
|
||||
padding-top: 2%;
|
||||
text-align: center;
|
||||
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
/*Elements*/
|
||||
.logoImg {
|
||||
margin: 1% auto;
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.myButton {
|
||||
/*Outside*/
|
||||
width: 50%;
|
||||
display: inline-block;
|
||||
border: 1px solid;
|
||||
border-radius: 28px;
|
||||
margin: 3% 25% 5% 25%;
|
||||
|
||||
/*Inside*/
|
||||
padding: 15px 15px;
|
||||
align-content: center;
|
||||
|
||||
/*text*/
|
||||
font-family: Montserrat, serif;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
color: #ffffff;
|
||||
font-weight: 600;
|
||||
|
||||
/*Visual*/
|
||||
background-color: #007C36;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/*##### LINKS TODO WITH HEADER #####*/
|
||||
|
||||
/* unvisited link */
|
||||
a:link {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.myButton {
|
||||
background-color: #14A6F9;
|
||||
border-radius: 28px;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
color: #ffffff;
|
||||
font-family: Arial;
|
||||
font-size: 12px;
|
||||
padding: 5px 15px;
|
||||
width: 50%;
|
||||
align-content: center;
|
||||
/* visited link */
|
||||
a:visited {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
/* -----
|
||||
SVG Icons - svgicons.sparkk.fr
|
||||
----- */
|
||||
|
||||
.svg-icon {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
/*background-color: #EBEBEB;*/
|
||||
/* mouse over link */
|
||||
a:hover {
|
||||
color: #818181;
|
||||
}
|
||||
|
||||
.svg-icon path,
|
||||
.svg-icon polygon,
|
||||
.svg-icon rect {
|
||||
fill: #4691f6;
|
||||
}
|
||||
|
||||
.svg-icon circle {
|
||||
stroke: #4691f6;
|
||||
stroke-width: 1;
|
||||
}
|
||||
|
||||
form i {
|
||||
margin-left: -30px;
|
||||
cursor: pointer;
|
||||
/* selected link */
|
||||
a:active {
|
||||
color: #000000;
|
||||
}
|
||||
26
frontend/unlogged_user/logowanie/rejestracja/toggle.js
Normal file
26
frontend/unlogged_user/logowanie/rejestracja/toggle.js
Normal file
@ -0,0 +1,26 @@
|
||||
//Password toggle
|
||||
const togglePassword = document.querySelector("#togglePassword");
|
||||
const password = document.querySelector("#regpassword");
|
||||
|
||||
togglePassword.addEventListener("click", function () {
|
||||
// toggle the type attribute
|
||||
const type = password.getAttribute("type") === "password" ? "text" : "password";
|
||||
password.setAttribute("type", type);
|
||||
|
||||
// toggle the icon
|
||||
this.classList.toggle("bi-eye");
|
||||
});
|
||||
|
||||
|
||||
//Repeat password toggle
|
||||
const togglePassword2 = document.querySelector("#togglePassword2");
|
||||
const password2 = document.querySelector("#regpassword2");
|
||||
|
||||
togglePassword2.addEventListener("click", function () {
|
||||
// toggle the type attribute
|
||||
const type = password2.getAttribute("type") === "password" ? "text" : "password";
|
||||
password2.setAttribute("type", type);
|
||||
|
||||
// toggle the icon
|
||||
this.classList.toggle("bi-eye");
|
||||
});
|
||||
@ -1,41 +1,22 @@
|
||||
/* * {
|
||||
border: 2px solid red;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
} */
|
||||
|
||||
input {
|
||||
text-align: left;
|
||||
}
|
||||
@import "../../_global/style.css";
|
||||
|
||||
/*Layer 0*/
|
||||
html {
|
||||
background-image: url(tlo_logowanie.png);
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
|
||||
font-family: Montserrat, serif;
|
||||
}
|
||||
|
||||
* {
|
||||
/* border: 2px solid red; */
|
||||
/*border: 2px solid red;*/
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
.form {
|
||||
width: 50%;
|
||||
height: 40%;
|
||||
background-color: #EBEBEB;
|
||||
display: flex;
|
||||
;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.login {
|
||||
width: 40%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
/*Layer 1*/
|
||||
.container {
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
@ -43,16 +24,104 @@ html {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/*Layer 2*/
|
||||
.form {
|
||||
width: 40%;
|
||||
height: 40%;
|
||||
background-color: #EBEBEB;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
border-radius: 2%;
|
||||
}
|
||||
|
||||
/*Layer 3*/
|
||||
.login_header {
|
||||
height: 20%;
|
||||
width: 100%;
|
||||
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
|
||||
.loginBox {
|
||||
width: 40%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.login_footer {
|
||||
height: 10%;
|
||||
width: 100%;
|
||||
padding-top: 1%;
|
||||
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
/*Elements*/
|
||||
.myButton {
|
||||
background-color: #14A6F9;
|
||||
border-radius: 28px;
|
||||
/*Outside*/
|
||||
width: 50%;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
color: #ffffff;
|
||||
font-family: Arial;
|
||||
font-size: 12px;
|
||||
border-radius: 28px;
|
||||
border: 1px solid;
|
||||
margin: auto;
|
||||
|
||||
/*Inside*/
|
||||
background-color: #007C36;
|
||||
padding: 5px 15px;
|
||||
width: 50%;
|
||||
}
|
||||
text-align: center;
|
||||
|
||||
/*Text*/
|
||||
font-family: Montserrat, serif;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
color: #ffffff;
|
||||
font-weight: 600;
|
||||
|
||||
}
|
||||
|
||||
.login_input {
|
||||
text-align: left;
|
||||
padding-top: 2%;
|
||||
padding-bottom: 2%;
|
||||
}
|
||||
|
||||
.password_input {
|
||||
text-align: left;
|
||||
padding-top: 2%;
|
||||
padding-bottom: 2%;
|
||||
}
|
||||
|
||||
.logoImg {
|
||||
margin: 1% auto;
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
|
||||
/*##### LINKS TODO WITH HEADER #####*/
|
||||
|
||||
/* unvisited link */
|
||||
a:link {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
/* visited link */
|
||||
a:visited {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
/* mouse over link */
|
||||
a:hover {
|
||||
color: #818181;
|
||||
}
|
||||
|
||||
/* selected link */
|
||||
a:active {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
@import "../../_global/header.css";
|
||||
@import "../../_global/style.css";
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user