dcrubro/l3iot-fin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

priprave spletne strani

Browse Source
This commit is contained in:
Your Name
2026-04-10 13:12:18 +02:00
parent b74366a546
commit a44753b2f2
3 changed files with 90 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
website/index.html Normal file
View File

@@ -0,0 +1,25 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>brum brum</title>
<link type="text/css" rel="stylesheet" href="./style.css">
</head>
<body>
<div id="dalinec">
<button class="button" id="levo">
←
</button>
<button class="button" id="gor">
↑
</button>
<button class="button" id="dol">
↓
</button>
<button class="button" id="desno">
→
</button>
</div>
</body>
</html>

0
website/script.js Normal file
View File

65
website/style.css Normal file
View File

@@ -0,0 +1,65 @@
body {
background-color: #3a3a3a;
}
.button {
position: absolute;
width: 200px;
height: 200px;
border-radius: 25px;
font-size: 100px;
background-color: #8a0261;
border: none;
color: rgba(255, 255, 255, 0.92);
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
button.button:hover{
background-color: #bb0284;
}
button.button:active{
background-color: #d10594;
}
#dalinec {
display: block;
margin: auto;
background-color: #333;
border-radius: 25px;
width: 800px;
height: 800px;
position: relative;
}
#levo {
left: 25%;
top: 50%;
transform: translate(-50%, -50%);
}
#desno {
left: 75%;
top: 50%;
transform: translate(-50%, -50%);
}
#gor {
left: 50%;
top: 25%;
transform: translate(-50%, -50%);
}
#dol {
left: 50%;
top: 75%;
transform: translate(-50%, -50%);
}
/* Responsive: scale down container and button sizes on small screens */
@media (max-width: 900px) {
#dalinec {
width: 90vw;
height: 90vw;
}
.button {
width: 20vw;
height: 20vw;
font-size: 8vw;
}
}