s444413/Padel-Tournaments-System
1
0
Fork 1
Code Issues Pull Requests Projects Releases Wiki Activity

feat: ✨ Drabinka i logo

Browse Source 
Dodanie drabinki i logo

wyświetlany przyklad drabinki oraz logo w headerze
This commit is contained in:
Arek 2022-05-19 23:32:26 +02:00
parent 5d6a42135b
commit beef1d9ea3
9 changed files with 327 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

133
frontend/drabinka/index.html Normal file
View File

@ -0,0 +1,133 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
<script src="https://cdn.jsdelivr.net/npm/less@4"></script>
</head>
<body>
<header>
<img src="../logo_padel.jpeg">
<a href="#">Wiadomości</a>
<a href="#">Kalendarz turniejów</a>
<a href="#">Ranking</a>
<a href="#">Wyniki</a>
<a href="#">Kontakt</a>
<span class="dot">JM</span>
</div>
</header>
<div class="container">
<h1>Padel tournament</h1>
<main id="tournament">
<ul class="round round-1">
<li class="spacer">&nbsp;</li>
<li class="game game-top winner">Jan <span>79</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom ">Piotrek <span>48</span></li>
<li class="spacer">&nbsp;</li>
<li class="game game-top winner">Czarek <span>84</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom ">Kasia <span>72</span></li>
<li class="spacer">&nbsp;</li>
<li class="game game-top ">Jerzy <span>55</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom winner">Andrzej <span>68</span></li>
<li class="spacer">&nbsp;</li>
<li class="game game-top winner">Mateusz <span>64</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom ">Lukasz <span>44</span></li>
<li class="spacer">&nbsp;</li>
<li class="game game-top winner">Arek <span>54</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom ">Marek <span>52</span></li>
<li class="spacer">&nbsp;</li>
<li class="game game-top winner">Alfred <span>65</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom ">Amir <span>54</span></li>
<li class="spacer">&nbsp;</li>
<li class="game game-top winner">Ambrozy <span>67</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom ">Fabian <span>63</span></li>
<li class="spacer">&nbsp;</li>
<li class="game game-top winner">Fryderyk <span>73</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom ">Gracjan <span>61</span></li>
<li class="spacer">&nbsp;</li>
</ul>
<ul class="round round-2">
<li class="spacer">&nbsp;</li>
<li class="game game-top winner">Jan <span>82</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom ">Czarek <span>56</span></li>
<li class="spacer">&nbsp;</li>
<li class="game game-top winner">Andrzej <span>74</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom ">Mateusz <span>57</span></li>
<li class="spacer">&nbsp;</li>
<li class="game game-top ">Arek <span>48</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom winner">Alfred <span>70</span></li>
<li class="spacer">&nbsp;</li>
<li class="game game-top ">Ambrozy <span>50</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom winner">Fryderyk <span>66</span></li>
<li class="spacer">&nbsp;</li>
</ul>
<ul class="round round-3">
<li class="spacer">&nbsp;</li>
<li class="game game-top winner">Jan <span>77</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom ">Andrzej <span>69</span></li>
<li class="spacer">&nbsp;</li>
<li class="game game-top ">Alfred <span>61</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom winner">Fryderyk <span>71</span></li>
<li class="spacer">&nbsp;</li>
</ul>
<ul class="round round-4">
<li class="spacer">&nbsp;</li>
<li class="game game-top winner">Jan <span>85</span></li>
<li class="game game-spacer">&nbsp;</li>
<li class="game game-bottom ">Frederyk <span>63</span></li>
<li class="spacer">&nbsp;</li>
</ul>
</div>
</main>
</body>
</html>

167
frontend/drabinka/style.css Normal file
View File

@ -0,0 +1,167 @@
/*
* Flex Layout Specifics
*/
img {
width: 150px;
height: 30px;
}
.dot {
height: 30px;
width: 30px;
color: white;
background-color: skyblue;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
}
a {
text-align: center;
line-height: 2;
color: white;
text-decoration: none;
}
.loginn {
background-color: skyblue;
border-radius: 31px;
border: 1px solid skyblue;
cursor: pointer;
color: #ffffff;
font-family: Arial;
text-decoration: none;
height: 30px;
}
header {
display: flex;
flex-flow: row wrap;
align-items: center;
justify-content: space-between;
background-color: #0f64f2;
margin: auto;
padding-top: 10px;
padding-bottom: 10px;
padding-right: 30px;
padding-left: 10px;
}
header>p {
text-align: center;
line-height: 0;
}
.myButton {
background-color: #4C8BF5;
border-radius: 28px;
border: 1px solid #4C8BF5;
display: inline-block;
cursor: pointer;
color: #ffffff;
font-family: Arial;
font-size: 9px;
padding: 8px 13px;
text-decoration: none;
}
.container {
display: flex;
flex-direction: column;
align-items: center;
}
.round {
display: flex;
flex-direction: column;
justify-content: center;
width: 200px;
list-style: none;
padding: 0;
}
.round .spacer {
flex-grow: 1;
}
.round .spacer:first-child,
.round .spacer:last-child {
flex-grow: .5;
}
.round .game-spacer {
flex-grow: 1;
}
/*
* Flex Layout Specifics
*/
main {
display: flex;
flex-direction: row;
}
.round {
display: flex;
flex-direction: column;
justify-content: center;
width: 200px;
list-style: none;
padding: 0;
}
.round .spacer {
flex-grow: 1;
}
.round .spacer:first-child,
.round .spacer:last-child {
flex-grow: .5;
}
.round .game-spacer {
flex-grow: 1;
}
/*
* General Styles
*/
body {
font-family: sans-serif;
font-size: small;
padding: 10px;
line-height: 1.4em;
}
li.game {
padding-left: 20px;
}
li.game.winner {
font-weight: bold;
}
li.game span {
float: right;
margin-right: 5px;
}
li.game-top {
border-bottom: 1px solid #aaa;
}
li.game-spacer {
border-right: 1px solid #aaa;
min-height: 40px;
}
li.game-bottom {
border-top: 1px solid #aaa;
}

2
frontend/index.html
View File

@ -11,7 +11,7 @@
<body>
<header>
<p> Padel</p>
<img src="logo_padel.jpeg">
<a href="#">Wiadomości</a>
<a href="#">Kalendarz turniejów</a>
<a href="#">Ranking</a>

BIN
frontend/logo_padel.jpeg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

2
frontend/panel_organizatora/index.html
View File

@ -8,7 +8,7 @@
<body>
<header>
<p> Padel</p>
<img src="../logo_padel.jpeg">
<a href="#">Wiadomości</a>
<a href="#">Kalendarz turniejów</a>
<a href="#">Ranking</a>

8
frontend/panel_organizatora/style.css
View File

@ -2,6 +2,11 @@
/* border: solid; */
}
img {
width: 150px;
height: 30px;
}
a {
text-align: center;
line-height: 2;
@ -13,13 +18,14 @@ a {
header {
display: flex;
flex-flow: row wrap;
align-items: center;
justify-content: space-between;
background-color: #0f64f2;
margin: auto;
padding-top: 10px;
padding-bottom: 10px;
padding-right: 30px;
padding-left: 30px;
padding-left: 10px;
}

8
frontend/style.css
View File

@ -2,6 +2,11 @@
/* border: solid; */
}
img {
width: 150px;
height: 30px;
}
a {
text-align: center;
line-height: 2;
@ -25,11 +30,14 @@ a {
header {
display: flex;
flex-flow: row wrap;
align-items: center;
justify-content: space-between;
background-color: #0f64f2;
margin: auto;
padding-top: 10px;
padding-bottom: 10px;
padding-right: 30px;
padding-left: 10px;
}

2
frontend/zalogowany_organizator/index.html
View File

@ -11,7 +11,7 @@
<body>
<header>
<p> Padel</p>
<img src="../logo_padel.jpeg">
<a href="#">Wiadomości</a>
<a href="#">Kalendarz turniejów</a>
<a href="#">Ranking</a>

10
frontend/zalogowany_organizator/style.css
View File

@ -2,6 +2,11 @@
/* border: solid; */
}
img {
width: 150px;
height: 30px;
}
a {
text-align: center;
line-height: 2;
@ -25,11 +30,14 @@ a {
header {
display: flex;
flex-flow: row wrap;
align-items: center;
justify-content: space-between;
background-color: #065FD4;
background-color: #0f64f2;
margin: auto;
padding-top: 10px;
padding-bottom: 10px;
padding-right: 30px;
padding-left: 10px;
}