Skip to content

Update the background photo for the countdown #6

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
antonnikitin97 wants to merge 9 commits into
base: master
Choose a base branch
from
Open

Update the background photo for the countdown #6

Show file tree
Hide file tree
Changes from 8 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
7107b54
upload new background photo
antonnikitin97 Mar 14, 2026
3877e20
background update
antonnikitin97 Mar 14, 2026
7bcb1ec
change position of countdown and message text
antonnikitin97 Mar 14, 2026
8018ef2
import open sans font
antonnikitin97 Mar 14, 2026
5e73f6f
change message for when countdown elapses
antonnikitin97 Mar 14, 2026
289c663
change background to remove in from fixed text
antonnikitin97 Mar 14, 2026
d3506b8
Dynamically generate STARTING IN and STARTING SOON
antonnikitin97 Mar 14, 2026
3c23e33
in on a newline
antonnikitin97 Mar 14, 2026
b532f80
Update index.html to remove unused font
antonnikitin97 Mar 16, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@
<link rel="shortcut icon" href="https://www.studentrobotics.org/images/favicon.ico"/>

<title>Countdown</title>


<link href="https://fonts.googleapis.com/css2?family=Open+Sans&display=swap" rel="stylesheet"/>
<link rel="stylesheet" href="https://www.studentrobotics.org/style/css/main.css"/>
<link rel="stylesheet" href="static/index.css"/>
<link rel="stylesheet" href="https://unpkg.com/dseg@0.46.0/css/dseg.css"/>
Expand Down
Binary file modified static/background.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
18 changes: 14 additions & 4 deletions static/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@ main {
justify-content:center;
align-items:center;

width: 66%;
height: 66%;
width: 33%;
height: 33%;
}

body {
Expand All @@ -25,7 +25,17 @@ main h1 {
}

main h1#countdown {
font-family: 'DSEG7-Classic';
font-family: 'Open Sans';
font-weight: bold;
transform: translateX(-8%); /* HACK: Offset so the time is centred, not the whole text */
text-align: center;
Copy link
Member

@RealOrangeOne RealOrangeOne Mar 16, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggestion: Move some of these to body or a generic h1 to avoid duplication.

Copy link
Member Author

@antonnikitin97 antonnikitin97 Mar 16, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I agree with this, will do it when I get back home this evening :)

transform: translateX(79%) translateY(40%);
text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
}

main h1#message {
font-family: 'Open Sans';
font-weight: bold;
text-align: center;
transform: translateX(80%) translateY(40%);
text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
}
4 changes: 2 additions & 2 deletions static/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,9 @@ function showMessage(text) {
function updateCountdown(target) {
const duration = target.diffNow();
if (duration.valueOf() <= 0) {
showMessage("Starting soon!");
showMessage("Starting \nSoon!");
} else {
document.getElementById(COUNTDOWN_ELEMENT_ID).innerText = duration.toFormat("-hh:mm:ss");
document.getElementById(COUNTDOWN_ELEMENT_ID).innerText = `Starting \nin ${duration.toFormat("hh:mm:ss")}`;
}
}

Expand Down