diff --git a/frontend/_global/style.css b/frontend/_global/style.css new file mode 100644 index 0000000..b330433 --- /dev/null +++ b/frontend/_global/style.css @@ -0,0 +1,6 @@ +@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap'); + +/*FONTS*/ +@font-face { + font-family: 'Montserrat', sans-serif; +} \ No newline at end of file diff --git a/frontend/unlogged_user/_main page/pojedynczy_turniej/drabinka/css/bookmarks.css b/frontend/unlogged_user/_main page/pojedynczy_turniej/drabinka/css/bookmarks.css new file mode 100644 index 0000000..43d4bb6 --- /dev/null +++ b/frontend/unlogged_user/_main page/pojedynczy_turniej/drabinka/css/bookmarks.css @@ -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; +} \ No newline at end of file diff --git a/frontend/unlogged_user/_main page/pojedynczy_turniej/drabinka/index.html b/frontend/unlogged_user/_main page/pojedynczy_turniej/drabinka/index.html index e7c705c..aa8b808 100644 --- a/frontend/unlogged_user/_main page/pojedynczy_turniej/drabinka/index.html +++ b/frontend/unlogged_user/_main page/pojedynczy_turniej/drabinka/index.html @@ -28,6 +28,16 @@
+
+ +
+ diff --git a/frontend/unlogged_user/_main page/pojedynczy_turniej/drabinka/style.css b/frontend/unlogged_user/_main page/pojedynczy_turniej/drabinka/style.css index 3b1177a..d9766a3 100644 --- a/frontend/unlogged_user/_main page/pojedynczy_turniej/drabinka/style.css +++ b/frontend/unlogged_user/_main page/pojedynczy_turniej/drabinka/style.css @@ -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; } \ No newline at end of file diff --git a/frontend/unlogged_user/_main page/pojedynczy_turniej/style.css b/frontend/unlogged_user/_main page/pojedynczy_turniej/style.css index 72408e1..b89296b 100644 --- a/frontend/unlogged_user/_main page/pojedynczy_turniej/style.css +++ b/frontend/unlogged_user/_main page/pojedynczy_turniej/style.css @@ -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 { diff --git a/frontend/unlogged_user/_main page/pojedynczy_turniej/zapisy/index.html b/frontend/unlogged_user/_main page/pojedynczy_turniej/zapisy/index.html index bce9e4a..093fab4 100644 --- a/frontend/unlogged_user/_main page/pojedynczy_turniej/zapisy/index.html +++ b/frontend/unlogged_user/_main page/pojedynczy_turniej/zapisy/index.html @@ -41,9 +41,9 @@
-
- Siemanko -
+
+ To ja +
diff --git a/frontend/unlogged_user/_main page/pojedynczy_turniej/zapisy/style.css b/frontend/unlogged_user/_main page/pojedynczy_turniej/zapisy/style.css index ec06f54..dc58e78 100644 --- a/frontend/unlogged_user/_main page/pojedynczy_turniej/zapisy/style.css +++ b/frontend/unlogged_user/_main page/pojedynczy_turniej/zapisy/style.css @@ -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; } \ No newline at end of file diff --git a/frontend/unlogged_user/_main page/style.css b/frontend/unlogged_user/_main page/style.css index 0b1f10c..fe0085f 100644 --- a/frontend/unlogged_user/_main page/style.css +++ b/frontend/unlogged_user/_main page/style.css @@ -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 { diff --git a/frontend/unlogged_user/kontakt/style.css b/frontend/unlogged_user/kontakt/style.css index f15795c..1578aee 100644 --- a/frontend/unlogged_user/kontakt/style.css +++ b/frontend/unlogged_user/kontakt/style.css @@ -1,4 +1,5 @@ @import "../../_global/header.css"; +@import "../../_global/style.css"; body { margin: 0; diff --git a/frontend/unlogged_user/logowanie/index.html b/frontend/unlogged_user/logowanie/index.html index 12c44af..633c71c 100644 --- a/frontend/unlogged_user/logowanie/index.html +++ b/frontend/unlogged_user/logowanie/index.html @@ -1,5 +1,5 @@ - + @@ -12,20 +12,25 @@
- diff --git a/frontend/unlogged_user/logowanie/rejestracja/css/register_form.css b/frontend/unlogged_user/logowanie/rejestracja/css/register_form.css new file mode 100644 index 0000000..2a65def --- /dev/null +++ b/frontend/unlogged_user/logowanie/rejestracja/css/register_form.css @@ -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%; + } \ No newline at end of file diff --git a/frontend/unlogged_user/logowanie/rejestracja/index.html b/frontend/unlogged_user/logowanie/rejestracja/index.html index 6a5d8da..7b700a6 100644 --- a/frontend/unlogged_user/logowanie/rejestracja/index.html +++ b/frontend/unlogged_user/logowanie/rejestracja/index.html @@ -1,5 +1,5 @@ - + @@ -14,50 +14,77 @@
-
+ +
+ +
+ +

Rejestracja

- - - -
+
+ +
- - -
+
+ + +
- - -
+
+ + +
- - -
+
+ + +
- - - -
+
+ - - - + +
+
+ +
+ + + + +
+
-
- Zapomniałeś hasła? -
+
+ +
+ diff --git a/frontend/unlogged_user/logowanie/rejestracja/myscript.js b/frontend/unlogged_user/logowanie/rejestracja/myscript.js index f1185e5..c00e1f6 100644 --- a/frontend/unlogged_user/logowanie/rejestracja/myscript.js +++ b/frontend/unlogged_user/logowanie/rejestracja/myscript.js @@ -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', { diff --git a/frontend/unlogged_user/logowanie/rejestracja/style.css b/frontend/unlogged_user/logowanie/rejestracja/style.css index 78922f1..f735252 100644 --- a/frontend/unlogged_user/logowanie/rejestracja/style.css +++ b/frontend/unlogged_user/logowanie/rejestracja/style.css @@ -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; } \ No newline at end of file diff --git a/frontend/unlogged_user/logowanie/rejestracja/toggle.js b/frontend/unlogged_user/logowanie/rejestracja/toggle.js new file mode 100644 index 0000000..04e3992 --- /dev/null +++ b/frontend/unlogged_user/logowanie/rejestracja/toggle.js @@ -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"); +}); \ No newline at end of file diff --git a/frontend/unlogged_user/logowanie/style.css b/frontend/unlogged_user/logowanie/style.css index b6189b5..b39766d 100644 --- a/frontend/unlogged_user/logowanie/style.css +++ b/frontend/unlogged_user/logowanie/style.css @@ -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%; -} \ No newline at end of file + 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; +} + diff --git a/frontend/unlogged_user/ranking/style.css b/frontend/unlogged_user/ranking/style.css index f15795c..1578aee 100644 --- a/frontend/unlogged_user/ranking/style.css +++ b/frontend/unlogged_user/ranking/style.css @@ -1,4 +1,5 @@ @import "../../_global/header.css"; +@import "../../_global/style.css"; body { margin: 0;