merge new front-end #3

Merged
sherl merged 8 commits from frontend into master 2025-06-05 10:30:28 +02:00
13 changed files with 567 additions and 111 deletions

View File

@@ -62,12 +62,15 @@ def setup():
app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = False
# Widoki widoczne dla "normalnego" użytkownika:
app.add_url_rule('/', view_func=lewy_routes.index)
app.add_url_rule('/index.html', view_func=lewy_routes.index)
app.add_url_rule('/mecze', view_func=lewy_routes.mecze)
app.add_url_rule('/statystyki', view_func=lewy_routes.statystyki)
app.add_url_rule('/toggle_dark_mode', view_func=lewy_routes.toggle_dark_mode)
app.add_url_rule('/historia', view_func=lewy_routes.historia)
app.add_url_rule('/', view_func=lewy_routes.index)
app.add_url_rule('/index.html', view_func=lewy_routes.index)
app.add_url_rule('/mecze', view_func=lewy_routes.mecze)
app.add_url_rule('/statystyki', view_func=lewy_routes.statystyki)
app.add_url_rule('/toggle_dark_mode', view_func=lewy_routes.toggle_dark_mode)
app.add_url_rule('/club', view_func=lewy_routes.clubs)
app.add_url_rule('/representation', view_func=lewy_routes.representation)
app.add_url_rule('/compare', view_func=lewy_routes.compare)
app.add_url_rule('/trophies', view_func=lewy_routes.trophies)
# API:
app.add_url_rule('/api/', view_func=lewy_api.api_greeting)

View File

@@ -3,6 +3,39 @@ import lewy_api_v1
import lewy_db
import lewy_globals
def get_lewy_stats():
return {
'all_time_stats': {
'goals': 380,
'assists': 120,
'matches': 450,
},
'club_stats': {
'goals': 132,
'assists': 112,
'matches': 245,
},
'nation_stats': {
'goals': 86,
'assists': 52,
'matches': 158,
},
'worldcup': {
'goals': 7,
'assists': 2,
'matches': 11,
},
'euro': {
'goals': 6,
'assists': 2,
'matches': 18,
},
'cards': {
'yellow': 24,
'red': 4,
}
}
def index():
dark_mode = request.cookies.get('darkMode', 'disabled')
# Przykładowe użycie endpointu last_goal_for():
@@ -32,20 +65,39 @@ def mecze():
return render_template('matches.html', matches=matches)
def statystyki():
stats = {
'goals': 38,
'assists': 12,
'matches': 45,
}
return render_template('stats.html', stats=stats)
dane=get_lewy_stats()
return render_template('stats.html', **dane)
def historia():
def clubs():
selected_club = request.args.get("club","FC Barcelona")
history = [
{'club': 'FC Barcelona', 'goals': 22},
{'club': 'Bayern Monachium', 'goals': 132},
clubs = [
{'club': 'FC Barcelona', 'goals': 22,'assist':12},
{'club': 'Bayern Monachium', 'goals': 132,'assist':12},
{'club': 'Borussia Dortmund', 'goals': 132,'assist':12},
{'club': 'Lech Poznan', 'goals': 132,'assist':12},
]
return render_template('history.html', history=history, selected_club=selected_club)
return render_template('club.html', clubs=clubs, selected_club=selected_club)
def representation():
nation_stats = {
'goals': 86,
'assists': 52,
'matches': 158,
}
return render_template('representation.html', nation_stats=nation_stats)
def compare():
selected_player = request.args.get("player","Leo Messi")
lewy=get_lewy_stats()
player2 = [
{'name':'Leo Messi','goals': 34,'assists': 12},
]
return render_template('compare.html',player2=player2, selected_player=selected_player,**lewy, )
def trophies():
trophy = [
{'name': 'asdasd', 'year': 2023},
{'name': 'ssss', 'sezon': '2022/2023'},
]
return render_template('trophies.html',trophy=trophy)
def toggle_dark_mode():
# Przełącz tryb i zapisz w ciasteczku

Binary file not shown.

After

Width:  |  Height:  |  Size: 132 KiB

View File

@@ -24,7 +24,7 @@
--polska-red: #E30B17;
--polska-white: #FFFFFF;
--polska-section-color: #05204A;
--polska-section-color: #121623;
--section-color: #051839;
--pink-highlight: #E1317E;
--blue-highlight: #00B9BF;
@@ -61,6 +61,7 @@ body {
font-size: 15px;
z-index: -2;
position: relative;
margin-top: 60px;
/* box-shadow: 0px -5px 10px 2px rgba(0, 0, 0, 0.347); */
}
@@ -82,6 +83,7 @@ body {
width: 40%;
padding: 20px;
position: relative;
}
.profile-image-cover {
@@ -93,6 +95,7 @@ body {
top: 0;
}
.profile-image img {
width: 100%;
max-width: 600px;
@@ -129,7 +132,7 @@ header button {
padding: 2.3rem 1rem;
height: 1.5rem;
position: sticky;
position: fixed;
top: 0;
left: 0;
width: 100%;
@@ -181,7 +184,7 @@ header button {
align-items: center;
text-decoration: none;
border-radius: var(--border-radius);
padding: 10px 20px;
padding: 10px;
height: 100%;
transition: 100ms ease;
position: relative;
@@ -218,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;
@@ -292,21 +304,32 @@ header button {
cursor: pointer;
}
@media (max-width: 768px) {
@media (max-width: 1090px) {
/* .base-header .navbar:not(:has(.show))
{
margin-bottom: 400px;
} */
.nav-links {
display: none;
flex-direction: column;
background-color: var(--barca-blue);
position: absolute;
top: 2.5rem;
right: 0rem;
flex-direction: column;
top: 57px;
right: 0px;
padding: 0rem;
gap: 0;
width: 200px;
height: auto;
backdrop-filter: blur(4px);
width: 30%;
justify-content: center;
box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.105);
}
.nav-links li {
width: 100%;
margin: 0;
display: flex;
justify-content: center;
}
.nav-links li a,
@@ -319,16 +342,50 @@ header button {
border-radius: 0;
/* brak zaokrągleń w mobilnym menu */
}
.nav-links li button
{
background-color: none;
width: 45px;
border-radius: 50%;
}
.nav-links li button::before,.nav-links li button::after
{
background-color: none
;
}
.nav-links li button:hover
{
transform: none;
}
.nav-links.show {
display: flex;
display: none;
}
.hamburger {
display: block;
}
}
@media (max-width: 1000px)
{
.header-content
{
flex-direction: column;
}
.header-content .profile-image
{
display: flex;
justify-content: center;
width: 100%;
}
.header-content .profile-image img{
width: 100%;
}
.about-section-image
{
display: none;
}
}
@@ -490,6 +547,7 @@ td {
width: 80%;
border-radius: var(--border-radius);
max-width: 1000px;
margin-bottom: 50px;
}
.section__matches h2
{
@@ -544,7 +602,6 @@ body.poland-mode .nav-links li a {
color: white;
}
body.poland-mode .nav-links li a:hover {
color: #220000;
background-color: white;
@@ -607,28 +664,59 @@ body.poland-mode .hamburger {
}
@media (max-width: 768px) {
body.poland-mode .nav-links {
/* body.poland-mode .nav-links {
background-color: var(--polska-red);
/*Ale oczopląs*/
}
}
}
body.poland-mode .section-stats {
background: linear-gradient(to bottom, #bd4148, #dc1414);
}
body.poland-mode .section-stats h2 {
color: #220000
color: white;
}
body.poland-mode .stat-box {
border-color: white;
background: linear-gradient(to bottom, #ff0000,#231212);
}
body.poland-mode .stat-box h3 {
color: white;
}
body.poland-mode .club-stats h2{
background: linear-gradient(to bottom, #ff0000,#231212);
border: 4px solid white;
color: white;
}
body.poland-mode .about-section {
background-color: var(--polska-section-color);
color: white;
}
body.poland-mode .about-section article h3 {
background-color: var(--polska-red-dark);
color: white;
}
body.poland-mode .about-section article h4 {
background-color: #ffcaca;
color: black;
border-radius: 5px;
}
body.poland-mode .general-stats-section h2 {
background: var(--polska-section-color);
}
body.poland-mode .general-stats-section .grid article:nth-child(1){background-color: var(--polska-red-dark);}
body.poland-mode .general-stats-section .grid article:nth-child(2){background-color: var(--yellow-highlight);}
body.poland-mode .general-stats-section .grid article:nth-child(3){background-color: var(--barca-blue);}
body.poland-mode .about-section-image::after{
background:var(--polska-red-dark);
}
/* Przyciski i elementy */
@@ -641,9 +729,24 @@ body.poland-mode .stat-box h3 {
padding: 2rem 2rem;
max-width: 1000px;
margin: 0 auto;
text-align: center;
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;
@@ -655,7 +758,6 @@ body.poland-mode .stat-box h3 {
justify-content: space-around;
text-align: center;
margin-top: 2rem;
flex-wrap: wrap;
gap: 2rem;
}
@@ -683,21 +785,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;
}

View File

@@ -23,7 +23,10 @@
<li><a href="/">Strona główna</a></li>
<li><a href="/mecze">Mecze</a></li>
<li><a href="/statystyki">Statystyki</a></li>
<li><a href="/historia">Osiągnięcia</a></li>
<li><a href="/club">Kluby</a></li>
<li><a href="/representation">Reprezentacja</a></li>
<li><a href="/trophies">Trofea</a></li>
<li><a href="/compare">Porównaj</a></li>
<li><button id="theme-toggle" onclick="toggleTheme()"></button></li>
</ul>
<div class="hamburger"></div>

View File

@@ -0,0 +1,64 @@
{% extends "base.html" %}
{% block title %}Strona Główna{% endblock %}
{% block content %}
<section class="choose-club">
<a href="{{ url_for('clubs', club='FC Barcelona') }}">
<button><img src="{{ url_for('static', filename='FC_Barcelona.png') }}"></button>
</a>
<a href="{{ url_for('clubs', club='Bayern Monachium') }}">
<button><img src="{{ url_for('static', filename='FC_Bayern.png') }}"></button>
</a>
<a href="{{ url_for('clubs', club='Borussia Dortmund') }}">
<button><img src="{{ url_for('static', filename='Borussia_Dortmund.png') }}"></button>
</a>
<!--Jak nie będzie statysytk dla lecha to usunać-->
<a href="{{ url_for('clubs', club='Lech Poznan') }}">
<button><img src="{{ url_for('static', filename='Lech_Poznan.png') }}"></button>
</a>
</section>
<!-- Wyświetlanie danych tylko dla wybranego klubu -->
{% for stats in clubs %}
{% if stats.club == selected_club %}
<section class="club-stats">
<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 %}
{% endfor %}
{% endblock %}
{% block footer %}
{{ commit_in_html | safe }}
{% endblock %}

View File

@@ -0,0 +1,68 @@
{% extends "base.html" %}
{% block title %}Statystyki{% endblock %}
{% block content %}
<select onchange="location = this.value;">
<option disabled selected>Wybierz zawodnika</option>
<option value="{{ url_for('compare', player='Leo Messi') }}">Leo Messi</option>
<option value="{{ url_for('compare', player='Ronaldo') }}">Cristiano Ronaldo</option>
<option value="{{ url_for('compare', player='Neymar') }}">Neymar</option>
</select>
{%for player in player2 %}
{% if player.name == selected_player %}
<section class="section-stats">
<h2>Gole</h2>
<div class="stats">
<div class="stat-box">
<h3>{{ all_time_stats.goals }}</h3>
</div>
<div class="stat-box">
<h3>{{ player.goals}}</h3>
</div>
</div>
<h2>Asysty</h2>
<div class="stats">
<div class="stat-box">
<h3>{{ all_time_stats.assists }}</h3>
</div>
<div class="stat-box">
<h3>{{ player.assists}}</h3>
</div>
</div>
<h2>Wystąpienia</h2>
<div class="stats">
<div class="stat-box">
<h3>{{ all_time_stats.assists }}</h3>
</div>
<div class="stat-box">
<h3>{{ player.assists}}</h3>
</div>
</div>
<h2>Minuty zagrane</h2>
<div class="stats">
<div class="stat-box">
<h3>{{ all_time_stats.assists }}</h3>
</div>
<div class="stat-box">
<h3>{{ player.assists}}</h3>
</div>
</div>
</section>
{% endif %}
{% endfor%}
{% endblock %}

View File

@@ -1,30 +0,0 @@
{% extends "base.html" %}
{% block title %}Strona Główna{% endblock %}
{% block content %}
<section class="choose-club">
<a href="{{ url_for('historia', club='FC Barcelona') }}">
<button><img src="{{ url_for('static', filename='FC_Barcelona.png') }}"></button>
</a>
<a href="{{ url_for('historia', club='Bayern Monachium') }}">
<button><img src="{{ url_for('static', filename='FC_Bayern.png') }}"></button>
</a>
</section>
<!-- Wyświetlanie danych tylko dla wybranego klubu -->
{% for stats in history %}
{% if stats.club == selected_club %}
<section class="club-stats">
<h2>{{ stats.club }} - All time stats</h2>
<div class="stats">
Gole: {{ stats.goals }}
</div>
</section>
{% endif %}
{% endfor %}
{% endblock %}
{% block footer %}
{{ commit_in_html | safe }}
{% endblock %}

View File

@@ -30,10 +30,10 @@
<article>
<h3>Osiągnięcia</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quod dicta veritatis quibusdam eligendi corrupti. Expedita delectus assumenda ipsum illum molestias a voluptates, voluptas quia reprehenderit, quod non, eum veritatis tenetur!</p>
<a href="/historia">Zobacz osiągnięcia</a>
<a href="/club">Zobacz osiągnięcia</a>
</article>
</section>
<!--
<section class="general-stats-section">
<h2>Ogólne statystyki:</h3>
<div class="grid">
@@ -52,7 +52,7 @@
</article>
</div>
</section>
-->
</div>
{% endblock %}

View File

@@ -3,6 +3,18 @@
{% block title %}Lista meczów{% endblock %}
{% block content %}
<select>
<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>
<option value="{{ url_for('compare', player='Neymar') }}">2021/2022</option>
<option value="{{ url_for('compare', player='Neymar') }}">2020/2021</option>
<option value="{{ url_for('compare', player='Neymar') }}">2019/2020</option>
<option value="{{ url_for('compare', player='Neymar') }}">2018/2019</option>
<option value="{{ url_for('compare', player='Neymar') }}">2017/2018</option>
<option value="{{ url_for('compare', player='Neymar') }}">2016/2017</option>
</select>
<section class="section__matches">
<h2>📅 Mecze Roberta</h2>
<table>

View File

@@ -0,0 +1,39 @@
{% extends "base.html" %}
{% block title %}Statystyki{% endblock %}
{% block content %}
<section class="club-stats club-stats-poland">
<h2>Statystyki w reprezentacji Polski</h2>
<div class="wybrany{{selected_club}}"></div>
<div class="club-stats-grid">
<div class="stat-box">
<p>Gole:</p> <span class="stat-box-special"> {{ nation_stats.goals }} </span>
</div>
<div class="stat-box">
<p>Asysty:</p> <span class="stat-box-special"> {{ nation_stats.assist }} </span>
</div>
<div class="stat-box">
<p>Występy:</p> <span class="stat-box-special"> {{ nation_stats.goals }} </span>
</div>
<div class="stat-box">
<p>Łączny czas gry:</p> <span class="stat-box-special"> {{ nation_stats.goals }}</span>
</div>
<div class="stat-box">
<p>Hat-tricki:</p> <span class="stat-box-special"> {{ nation_stats.goals }}</span>
</div>
<div class="stat-box">
<p>Zwycięstwa:</p> <span class="stat-box-special"> {{ nation_stats.goals }}</span>
</div>
<div class="stat-box">
<p>Porażki:</p> <span class="stat-box-special"> {{ nation_stats.goals }}</span>
</div>
<div class="stat-box">
<p>Żółte kartki:</p> <span class="stat-box-special"> {{ nation_stats.goals }}</span>
</div>
<div class="stat-box">
<p>Czerwone kartki:</p> <span class="stat-box-special"> {{ nation_stats.goals }}</span>
</div>
</div>
</section>
{% endblock %}

View File

@@ -3,38 +3,104 @@
{% block title %}Statystyki{% endblock %}
{% block content %}
<section class="section-stats">
<h2>All time stats</h2>
<div class="stats">
<div class="stat-box">
<h3>{{ stats.goals }}</h3>
<p>Goals</p>
</div>
<div class="stat-box">
<h3>{{ stats.assists }}</h3>
<p>Assists</p>
</div>
<div class="stat-box">
<h3>{{ stats.matches }}</h3>
<p>Apps</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>All time stats</h2>
<div class="stats">
<div class="stat-box">
<h3>{{ stats.goals }}</h3>
<p>Goals</p>
</div>
<div class="stat-box">
<h3>{{ stats.assists }}</h3>
<p>Assists</p>
</div>
<div class="stat-box">
<h3>{{ stats.matches }}</h3>
<p>Apps</p>
</div>
</div>
</section>
{% endblock %}
{% endblock %}

View File

@@ -0,0 +1,28 @@
{% extends "base.html" %}
{% block title %}Statystyki{% endblock %}
{% block content %}
<section class="section__matches">
<h2>📅 Trofea</h2>
<table>
<tr>
<th>Nazwa</th>
<th>Data/Sezon</th>
</tr>
{% for trophy in trophy %}
<tr>
<td>{{ trophy.name }}</td>
{% if trophy.year == NULL %}
<td>{{ trophy.sezon }}</td>
{% endif %}
{% if trophy.sezon == NULL %}
<td>{{ trophy.year }}</td>
{% endif %}
</tr>
{% endfor %}
</table>
</section>
{% endblock %}