add style + 2nd page

This commit is contained in:
Sebastian Ranoszek 2025-01-23 13:08:49 +01:00
parent dd1d41f222
commit 8f2606bacd
3 changed files with 115 additions and 1 deletions

View File

@ -11,7 +11,14 @@
<h1>Najważniejsze daty w historii Polski</h1> <h1>Najważniejsze daty w historii Polski</h1>
</div> </div>
<div class="menu-prawy"> <div class="menu-prawy">
<img src="herb.png" alt="HERB"> <a href=""><img src="herb.png" alt="HERB"></a>
</div>
<div class="content">
<div class="form-container">
<form action="page1.php">
<input type="submit" value="ROZPOCZNIJ TEST" class="start">
</form>
</div>
</div> </div>
</body> </body>
</html> </html>

View File

@ -0,0 +1,30 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Najważniejsze Daty Polski</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="menu-lewy">
<h1>Najważniejsze daty w historii Polski</h1>
</div>
<div class="menu-prawy">
<a href="index.php"><img src="herb.png" alt="HERB"></a>
</div>
<div class="content">
<div class="form-container">
<form action="page2.php">
<h3>UCHWALENIE KONSTYTUCJI 3 MAJA</h3>
<input type="radio" name="pytanie1" id=""><span>1788</span><br>
<input type="radio" name="pytanie1" id=""><span>1791</span><br>
<input type="radio" name="pytanie1" id=""><span>1794</span><br>
<input type="radio" name="pytanie1" id=""><span>1793</span><br>
<br>
<input type="submit" value="NASTĘPNE PYTANIE" class="next">
</form>
</div>
</div>
</body>
</html>

View File

@ -0,0 +1,77 @@
body {
margin: 0px;
background-color: darkgray;
}
.menu-lewy, .menu-prawy {
float: left;
border-bottom: 1px solid black;
height: 200px;
background-color: gray;
}
.menu-lewy {
width: 70%;
text-align: center;
color: white;
}
.menu-lewy h1 {
margin-top: 70px;
font-size: 64px;
}
.menu-prawy {
width: 30%;
justify-content: left;
}
.content {
clear: both;
width: 500px;
height: 500px;
transform: translate(-50%, -50%);
position: absolute;
left: 50%;
top: 50%;
border: 1.5px solid black;
border-radius: 25px;
background-color: gray;
}
.content form {
text-align: center;
margin-top: 30%;
color: white;
}
.content h3 {
color: white;
}
.start {
margin-top: 12%;
padding: 25px;
border-radius: 25px;
transition: 0.5s;
}
.start:hover {
background-color: darkgray;
transition: 0.5s;
}
.next {
padding: 10px;
border-radius: 15px;
transition: 0.5s;
}
.next:hover {
background-color: darkgray;
transition: 0.5s;
}
.content span {
font-size: 20px;
}