From ca5882136131297a1fa63482cdb66569c70b5f1a Mon Sep 17 00:00:00 2001
From: Pc <Pc@DESKTOP-HFN0BRR>
Date: Wed, 9 Apr 2025 18:26:13 +0200
Subject: [PATCH] Centered Style

---
 FlaskWebProject/FlaskWebProject.pyproj        |  14 +-
 .../FlaskWebProject/static/style.css          | 198 +++++++++---------
 .../FlaskWebProject/templates/base.html       |   8 +-
 3 files changed, 115 insertions(+), 105 deletions(-)

diff --git a/FlaskWebProject/FlaskWebProject.pyproj b/FlaskWebProject/FlaskWebProject.pyproj
index 95c1736..4a37401 100644
--- a/FlaskWebProject/FlaskWebProject.pyproj
+++ b/FlaskWebProject/FlaskWebProject.pyproj
@@ -17,8 +17,7 @@
     <SuppressCollectPythonCloudServiceFiles>true</SuppressCollectPythonCloudServiceFiles>
     <Name>FlaskWebProject</Name>
     <RootNamespace>FlaskWebProject</RootNamespace>
-    <InterpreterId>
-    </InterpreterId>
+    <InterpreterId>MSBuild|env|$(MSBuildProjectFullPath)</InterpreterId>
   </PropertyGroup>
   <PropertyGroup Condition=" '$(Configuration)' == 'Debug' ">
     <DebugSymbols>true</DebugSymbols>
@@ -71,6 +70,17 @@
     <Content Include="FlaskWebProject\static\scripts\_references.js" />
     <Content Include="FlaskWebProject\templates\index.html" />
   </ItemGroup>
+  <ItemGroup>
+    <Interpreter Include="env\">
+      <Id>env</Id>
+      <Version>3.13</Version>
+      <Description>env (Python 3.13 (64-bit))</Description>
+      <InterpreterPath>Scripts\python.exe</InterpreterPath>
+      <WindowsInterpreterPath>Scripts\pythonw.exe</WindowsInterpreterPath>
+      <PathEnvironmentVariable>PYTHONPATH</PathEnvironmentVariable>
+      <Architecture>X64</Architecture>
+    </Interpreter>
+  </ItemGroup>
   <Import Project="$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)\Python Tools\Microsoft.PythonTools.Web.targets" />
   <!-- Specify pre- and post-build commands in the BeforeBuild and 
        AfterBuild targets below. -->
diff --git a/FlaskWebProject/FlaskWebProject/static/style.css b/FlaskWebProject/FlaskWebProject/static/style.css
index 1ec9baa..d13043f 100644
--- a/FlaskWebProject/FlaskWebProject/static/style.css
+++ b/FlaskWebProject/FlaskWebProject/static/style.css
@@ -1,140 +1,138 @@
-/* Podstawowy styl */
+/* Podstawowy styl */
 body {
-    font-family: 'Arial', sans-serif;
-    margin: 0;
-    padding: 0;
-    background: #f7f7f7;
-    color: #222;
-    transition: all 0.3s ease;
+	font-family: 'Arial', sans-serif;
+	margin: 0;
+	padding: 0;
+	background: #f7f7f7;
+	color: #222;
+	transition: all 0s ease;
+	display: flex;
+	flex-direction: column;
+	align-items: center; /* Wyśrodkowanie elementów w poziomie */
+	justify-content: flex-start; /* Ustalamy początek na górze */
+	min-height: 100vh;
 }
 
+/* Styl nawigacji */
 nav {
-    background: #d32f2f;
-    padding: 10px;
-    display: flex;
-    justify-content: space-around;
-    color: white;
+	background: #d32f2f;
+	padding: 0px;
+	display: flex;
+	justify-content: center; /* Wyśrodkowanie linków */
+	width: 100%;
+	color: white;
 }
 
-    nav a, nav button {
-        color: white;
-        text-decoration: none;
-        font-weight: bold;
-        background: none;
-        border: none;
-        cursor: pointer;
-    }
+	nav a, nav button {
+		color: white;
+		text-decoration: none;
+		font-weight: bold;
+		background: none;
+		border: none;
+		cursor: pointer;
+		margin: 0 15px; /* Odstęp między elementami */
+	}
 
+/* Wyśrodkowanie głównej zawartości */
 main {
-    padding: 20px;
+	padding: 0px;
+	width: 100%;
+	max-width: 980px; /* Maksymalna szerokość treści */
+	text-align: center; /* Wyśrodkowanie tekstu */
 }
 
+/* Styl dla tabeli */
 table {
-    width: 100%;
-    border-collapse: collapse;
-    margin-top: 20px;
+	width: 100%;
+	border-collapse: collapse;
+	margin-top: 20px;
 }
 
 th, td {
-    padding: 10px;
-    border-bottom: 1px solid #ccc;
-    text-align: center;
+	padding: 10px;
+	border-bottom: 1px solid #ccc;
+	text-align: center;
 }
 
+/* Styl dla zdjęcia */
 .photo {
-    width: 200px;
-    border-radius: 50%;
-    display: block;
-    margin: 20px auto;
+	width: 100px;
+	height: 100px;
+	border-radius: 50%;
+	display: block;
+	margin: 0 auto; /* Wyśrodkowanie obrazka */
 }
 
 /* Styl dla trybu ciemnego */
 body.dark-mode {
-    background: #121212;
-    color: #e0e0e0;
+	background: #121212;
+	color: #e0e0e0;
 }
 
-    body.dark-mode nav {
-        background: #333;
-    }
+	body.dark-mode nav {
+		background: #333;
+	}
 
-    body.dark-mode table {
-        color: #e0e0e0;
-    }
+	body.dark-mode table {
+		color: #e0e0e0;
+	}
 
-    body.dark-mode h1 {
-        color: #eaeaea;
-    }
+	body.dark-mode h1 {
+		color: #eaeaea;
+	}
 
-    body.dark-mode header button {
-        background-color: #444;
-        color: #eaeaea;
-    }
+	body.dark-mode header button {
+		background-color: #444;
+		color: #eaeaea;
+	}
 
-        body.dark-mode header button:hover {
-            background-color: #666;
-        }
+		body.dark-mode header button:hover {
+			background-color: #666;
+		}
 
-    body.dark-mode ul li {
-        background-color: #333;
-    }
+	body.dark-mode ul li {
+		background-color: #333;
+	}
 
-        body.dark-mode ul li:hover {
-            background-color: #444;
-        }
-
-    /* Dodatkowe style */
-    body.dark-mode h1 {
-        color: #eaeaea;
-    }
-
-    body.dark-mode header button {
-        background-color: #444;
-        color: #eaeaea;
-    }
-
-        body.dark-mode header button:hover {
-            background-color: #666;
-        }
-
-    body.dark-mode ul li {
-        background-color: #333;
-    }
-
-        body.dark-mode ul li:hover {
-            background-color: #444;
-        }
+		body.dark-mode ul li:hover {
+			background-color: #444;
+		}
 
 /* Przyciski i elementy */
 header button {
-    padding: 10px 15px;
-    border: none;
-    background-color: #007bff;
-    color: white;
-    font-size: 16px;
-    cursor: pointer;
-    border-radius: 5px;
-    transition: background-color 0.3s;
+	padding: 10px 15px;
+	border: none;
+	background-color: #007bff;
+	color: white;
+	font-size: 16px;
+	cursor: pointer;
+	border-radius: 5px;
+	transition: background-color 0.3s;
 }
 
-    header button:hover {
-        background-color: #0056b3;
-    }
+	header button:hover {
+		background-color: #0056b3;
+	}
 
 /* Style dla listy meczów */
 ul {
-    list-style: none;
-    padding: 0;
+	list-style: none;
+	padding: 0;
+	display: flex;
+	flex-direction: column;
+	align-items: center; /* Wyśrodkowanie listy */
 }
 
-    ul li {
-        background-color: #eaeaea;
-        margin-bottom: 10px;
-        padding: 10px;
-        border-radius: 5px;
-        transition: background-color 0.3s;
-    }
+	ul li {
+		background-color: #eaeaea;
+		margin-bottom: 10px;
+		padding: 10px;
+		border-radius: 5px;
+		transition: background-color 0.3s;
+		width: 90%; /* Szerokość li z marginesem */
+		max-width: 800px; /* Maksymalna szerokość elementu */
+	}
 
-        ul li:hover {
-            background-color: #d1d1d1;
-        }
+		ul li:hover {
+			background-color: #d1d1d1;
+		}
diff --git a/FlaskWebProject/FlaskWebProject/templates/base.html b/FlaskWebProject/FlaskWebProject/templates/base.html
index 06925ce..9c91826 100644
--- a/FlaskWebProject/FlaskWebProject/templates/base.html
+++ b/FlaskWebProject/FlaskWebProject/templates/base.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!DOCTYPE html>
 <html lang="pl">
 <head>
     <meta charset="UTF-8">
@@ -15,8 +15,10 @@
     </nav>
 
     <header>
-        <img src="{{ url_for('static', filename='lewandowski.jpg') }}" alt="Robert Lewandowski" style="width: 200px; height: auto; border-radius: 50%;">
-        <h1>Statystyki Roberta Lewandowskiego</h1>
+        <div class="header-content">
+            <center><img src="{{ url_for('static', filename='lewandowski.jpg') }}" alt="Robert Lewandowski" class="profile-image"></center>
+            <h1>Statystyki Roberta Lewandowskiego</h1>
+        </div>
     </header>
 
     <main>