merge new front-end #3
BIN
FlaskWebProject/FlaskWebProject/static/soccer-field.jpg
Normal file
BIN
FlaskWebProject/FlaskWebProject/static/soccer-field.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 132 KiB |
@@ -24,7 +24,7 @@
|
||||
--polska-red: #E30B17;
|
||||
--polska-white: #FFFFFF;
|
||||
|
||||
--polska-section-color: #970000;
|
||||
--polska-section-color: #121623;
|
||||
--section-color: #051839;
|
||||
--pink-highlight: #E1317E;
|
||||
--blue-highlight: #00B9BF;
|
||||
@@ -95,6 +95,7 @@ body {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
|
||||
.profile-image img {
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
@@ -220,8 +221,17 @@ header button {
|
||||
}
|
||||
|
||||
.nav-links li:nth-child(4) a::before {
|
||||
content: "🤝";
|
||||
}
|
||||
.nav-links li:nth-child(5) a::before {
|
||||
content: "⚽";
|
||||
}
|
||||
.nav-links li:nth-child(6) a::before {
|
||||
content: "🏆";
|
||||
}
|
||||
.nav-links li:nth-child(7) a::before {
|
||||
content: "🔎";
|
||||
}
|
||||
|
||||
.nav-links li {
|
||||
display: block;
|
||||
@@ -299,6 +309,8 @@ header button {
|
||||
{
|
||||
margin-bottom: 400px;
|
||||
} */
|
||||
|
||||
|
||||
.nav-links {
|
||||
position: absolute;
|
||||
flex-direction: column;
|
||||
@@ -535,6 +547,7 @@ td {
|
||||
width: 80%;
|
||||
border-radius: var(--border-radius);
|
||||
max-width: 1000px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.section__matches h2
|
||||
{
|
||||
@@ -655,8 +668,9 @@ body.poland-mode .hamburger {
|
||||
/* body.poland-mode .nav-links {
|
||||
background-color: var(--polska-red);
|
||||
/*Ale oczopląs*/
|
||||
} */
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
body.poland-mode .section-stats {
|
||||
@@ -664,7 +678,7 @@ body.poland-mode .section-stats {
|
||||
}
|
||||
|
||||
body.poland-mode .section-stats h2 {
|
||||
color: #220000
|
||||
color: white;
|
||||
}
|
||||
|
||||
body.poland-mode .stat-box {
|
||||
@@ -688,8 +702,22 @@ body.poland-mode .stat-box h3 {
|
||||
max-width: 1000px;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
.section-stats-center
|
||||
{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 30px;
|
||||
justify-content: center;
|
||||
}
|
||||
@media (max-width: 1400px) {
|
||||
|
||||
.section-stats-center
|
||||
{
|
||||
grid-template-columns: 1fr !important;
|
||||
}
|
||||
}
|
||||
|
||||
.section-stats h2 {
|
||||
font-size: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
@@ -701,7 +729,6 @@ body.poland-mode .stat-box h3 {
|
||||
justify-content: space-around;
|
||||
text-align: center;
|
||||
margin-top: 2rem;
|
||||
flex-wrap: wrap;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
@@ -729,21 +756,70 @@ body.poland-mode .stat-box h3 {
|
||||
.stat-box p {
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
.choose-club
|
||||
{
|
||||
margin: 10px;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.choose-club button {
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
background-color: white;
|
||||
width: 100px;
|
||||
border: none;
|
||||
|
||||
background-color:transparent;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.choose-club button img {
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color:transparent;
|
||||
transition: transform 100ms ease;
|
||||
}
|
||||
|
||||
.choose-club button img:hover {
|
||||
height: 45px;
|
||||
width: 45px;
|
||||
background-color: #ffffff7e;
|
||||
transform: scale(1.3,1.3) translateY(-10px);
|
||||
}
|
||||
.club-stats h2{
|
||||
color: var(--barca-gold);
|
||||
text-align: center;
|
||||
border: 5px solid var(--barca-red);
|
||||
background-color: var(--barca-blue);
|
||||
padding: 20px;
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
.stat-box
|
||||
{
|
||||
padding: 20px;
|
||||
background-color: var(--barca-blue);
|
||||
display: grid;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
text-align: center;
|
||||
}
|
||||
.stat-box-special
|
||||
{text-align: center;
|
||||
display: block;
|
||||
font-size: 40px;
|
||||
color: var(--barca-gold);
|
||||
}
|
||||
.club-stats-grid
|
||||
{
|
||||
display: grid;
|
||||
margin-bottom: 50px;
|
||||
gap: 10px;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-template-rows: 1fr 1fr 1fr;
|
||||
}
|
||||
select
|
||||
{
|
||||
color: white;
|
||||
padding: 20px;
|
||||
margin: 10px;
|
||||
font-size: 24px;
|
||||
background-color: var(--barca-blue);
|
||||
border-radius: 10px;
|
||||
border: 2px solid white;
|
||||
}
|
||||
@@ -22,33 +22,36 @@
|
||||
{% for stats in clubs %}
|
||||
{% if stats.club == selected_club %}
|
||||
<section class="club-stats">
|
||||
<h3>Statystyki dla {{selected_club}}</h3>
|
||||
<div class="stat-box">
|
||||
Gole: {{ stats.goals }}
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
Asysty: {{ stats.assist }}
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
Występy: {{ stats.goals }}
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
Łączny czas gry: {{ stats.goals }}
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
Hat-tricki: {{ stats.goals }}
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
Zwycięstwa: {{ stats.goals }}
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
Porażki: {{ stats.goals }}
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
Żółte kartki: {{ stats.goals }}
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
Czerwone kartki: {{ stats.goals }}
|
||||
<h2>Statystyki dla {{selected_club}}</h2>
|
||||
<div class="wybrany{{selected_club}}"></div>
|
||||
<div class="club-stats-grid">
|
||||
<div class="stat-box">
|
||||
<p>Gole:</p> <span class="stat-box-special"> {{ stats.goals }} </span>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<p>Asysty:</p> <span class="stat-box-special"> {{ stats.assist }} </span>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<p>Występy:</p> <span class="stat-box-special"> {{ stats.goals }} </span>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<p>Łączny czas gry:</p> <span class="stat-box-special"> {{ stats.goals }}</span>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<p>Hat-tricki:</p> <span class="stat-box-special"> {{ stats.goals }}</span>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<p>Zwycięstwa:</p> <span class="stat-box-special"> {{ stats.goals }}</span>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<p>Porażki:</p> <span class="stat-box-special"> {{ stats.goals }}</span>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<p>Żółte kartki:</p> <span class="stat-box-special"> {{ stats.goals }}</span>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<p>Czerwone kartki:</p> <span class="stat-box-special"> {{ stats.goals }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
|
||||
{% block content %}
|
||||
<select>
|
||||
<option disabled selected>Wybierz zawodnika</option>
|
||||
<option disabled selected>Wybierz rok</option>
|
||||
<option value="{{ url_for('compare', player='Leo Messi') }}">2024/2025</option>
|
||||
<option value="{{ url_for('compare', player='Ronaldo') }}">2023/2024</option>
|
||||
<option value="{{ url_for('compare', player='Neymar') }}">2022/2023</option>
|
||||
|
||||
@@ -3,101 +3,104 @@
|
||||
{% block title %}Statystyki{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="section-stats">
|
||||
<h2>Ogólne statystyki</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ all_time_stats.goals }}</h3>
|
||||
<p>Gole</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ all_time_stats.assists }}</h3>
|
||||
<p>Asysty</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ all_time_stats.matches }}</h3>
|
||||
<p>Występy</p>
|
||||
</div>
|
||||
<div class="section-stats-center">
|
||||
|
||||
<section class="section-stats">
|
||||
<h2>Ogólne statystyki</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ all_time_stats.goals }}</h3>
|
||||
<p>Gole</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ all_time_stats.assists }}</h3>
|
||||
<p>Asysty</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ all_time_stats.matches }}</h3>
|
||||
<p>Występy</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-stats">
|
||||
<h2>Klubowe statystyki</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ club_stats.goals }}</h3>
|
||||
<p>Gole</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ club_stats.assists }}</h3>
|
||||
<p>Asysty</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ club_stats.matches }}</h3>
|
||||
<p>Występy</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-stats">
|
||||
<h2>Reprezentacja statystyki</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ nation_stats.goals }}</h3>
|
||||
<p>Gole</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ nation_stats.assists }}</h3>
|
||||
<p>Asysty</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ nation_stats.matches }}</h3>
|
||||
<p>Występy</p>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-stats">
|
||||
<h2>Mistrzostwa świata</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ worldcup.goals }}</h3>
|
||||
<p>Gole</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ worldcup.assists }}</h3>
|
||||
<p>Asysty</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ worldcup.matches }}</h3>
|
||||
<p>Występy</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-stats">
|
||||
<h2>EURO</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ euro.goals }}</h3>
|
||||
<p>Gole</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ euro.assists }}</h3>
|
||||
<p>Asysty</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ euro.matches }}</h3>
|
||||
<p>Występy</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-stats">
|
||||
<h2>Kartki</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ cards.yellow }}</h3>
|
||||
<p>Żółte</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ cards.red }}</h3>
|
||||
<p>Czerwone</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-stats">
|
||||
<h2>Klubowe statystyki</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ club_stats.goals }}</h3>
|
||||
<p>Gole</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ club_stats.assists }}</h3>
|
||||
<p>Asysty</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ club_stats.matches }}</h3>
|
||||
<p>Występy</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-stats">
|
||||
<h2>Reprezentacja statystyki</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ nation_stats.goals }}</h3>
|
||||
<p>Gole</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ nation_stats.assists }}</h3>
|
||||
<p>Asysty</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ nation_stats.matches }}</h3>
|
||||
<p>Występy</p>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-stats">
|
||||
<h2>Mistrzostwa świata</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ worldcup.goals }}</h3>
|
||||
<p>Gole</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ worldcup.assists }}</h3>
|
||||
<p>Asysty</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ worldcup.matches }}</h3>
|
||||
<p>Występy</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-stats">
|
||||
<h2>EURO</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ euro.goals }}</h3>
|
||||
<p>Gole</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ euro.assists }}</h3>
|
||||
<p>Asysty</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ euro.matches }}</h3>
|
||||
<p>Występy</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section-stats">
|
||||
<h2>Kartki</h2>
|
||||
<div class="stats">
|
||||
<div class="stat-box">
|
||||
<h3>{{ cards.yellow }}</h3>
|
||||
<p>Żółte</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<h3>{{ cards.red }}</h3>
|
||||
<p>Czerwone</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user