Centered Style
This commit is contained in:
@@ -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. -->
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user