Kilokem/BroCodeJS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

RearangeClockMiniProjectAndOthers

Browse Source
This commit is contained in:
Kilokem
2024-10-10 18:01:24 +02:00
parent 182c614783
commit dacbb89950
22 changed files with 232 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
MiniProjects/DigitalClock/ImageSource.url Normal file
View File

@ -0,0 +1 @@
https://www.pexels.com/hu-hu/

BIN
MiniProjects/DigitalClock/bgimg.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 MiB

38
MiniProjects/DigitalClock/clock.html Normal file
View File

@ -0,0 +1,38 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Clock</title>
</head>
<style>
* {
padding: 0;
margin: 0;
border-width: 0;
}
.container {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
vertical-align: middle;
height: 100vh;
font-weight: bold;
font-size: 10ch;
font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
background-image: url("bgimg.jpg");
background-size: cover;
}
#clock {
color: white;
background-color: rgba(0, 0, 0, 30%);
}
</style>
<body>
<div class="container">
<h1 id="clock">00:00:00</h1>
</div>
<script src="clock.js"></script>
</body>
</html>

12
MiniProjects/DigitalClock/clock.js Normal file
View File

@ -0,0 +1,12 @@
function updateClock(){
const time = new Date();
const hours = time.getHours().toString().padStart(2, "0");
const minutes = time.getMinutes().toString().padStart(2, "0");
const seconds = time.getSeconds().toString().padStart(2, "0");
const time_string = `${hours}:${minutes}:${seconds}`;
document.getElementById("clock").textContent = time_string;
}
updateClock();
setInterval(updateClock, 1000);