Actual Initial Upload...

Simple bare-bones book progress bar with a test animation running.

Changes:
- Migrated to a new repo because the whole project was in the wrong local directory.. oops
- Removed remaining unrelated timer files and code.

TODO:
- Remove IMGUR hotlink
- Update book art
- Proper input value testing
- Get websocket connected and tested
This commit is contained in:
2026-07-28 05:13:12 -04:00
parent 36332867e6
commit b656d02547
8 changed files with 10 additions and 287 deletions
+9 -117
View File
@@ -4,127 +4,19 @@
<meta charset="utf-8" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Silkscreen:wght@400;700&family=VT323&display=swap" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Inter' rel='stylesheet'>
<link rel="stylesheet" href="timer.css" />
<script src="timer.js"></script>
<title>Lilac Timer</title>
<link href="https://fonts.googleapis.com/css2?family=Courier+Prime:ital,wght@0,400;0,700;1,400;1,700&family=Cutive+Mono&display=swap" rel="stylesheet">
<link rel="stylesheet" href="BookBar.css" />
<script src="BookBar.js"></script>
<title>Lilac BookBar</title>
</head>
<body>
<main>
<div class='contentContainer'>
<img class='mainHeart' src='src/youvegotmail.webp'>
<div class='infoWrap'>
<div class='infoGroup'>
<div class='infoBox' id='InfoBox3'>
<p id='TopUsers'>
Leaderboard:
</p>
<div class='rightFadeWrap' id='RightFadeWrapInfoBox3'>
<div class='giftUserWrap' id='GiftUserWrap'>
<div class='giftUserRow' id='GiftUserRow1'>
<p class='giftUserNum' id='GiftUserNum1'>
1
</p>
<div class='scrollWrap' id='ScrollWrapName1'>
<div class='scrollWrapW' id='ScrollWrapNameW1'>
<p class='giftUserName'id='GiftUserName1'>
Usernamethatisverylong
</p>
<p class='giftUserNameDupe'id='GiftUserNameDupe1'>
Usernamethatisverylong
</p>
</div>
</div>
<p class='giftUserScore' id='GiftUserScore1'>
0000
</p>
</div>
<div class='giftUserRow' id='GiftUserRow2'>
<p class='giftUserNum' id='GiftUserNum2'>
2
</p>
<div class='scrollWrap' id='ScrollWrapName2'>
<div class='scrollWrapW' id='ScrollWrapNameW2'>
<p class='giftUserName'id='GiftUserName2'>
Usernamethatisverylong
</p>
<p class='giftUserNameDupe'id='GiftUserNameDupe2'>
Usernamethatisverylong
</p>
</div>
</div>
<p class='giftUserScore' id='GiftUserScore2'>
25
</p>
</div>
<div class='giftUserRow' id='GiftUserRow3'>
<p class='giftUserNum' id='GiftUserNum3'>
3
</p>
<div class='scrollWrap' id='ScrollWrapName3'>
<div class='scrollWrapW' id='ScrollWrapNameW3'>
<p class='giftUserName'id='GiftUserName3'>
Usernamethatisverylong
</p>
<p class='giftUserNameDupe'id='GiftUserNameDupe3'>
Usernamethatisverylong
</p>
</div>
</div>
<p class='giftUserScore' id='GiftUserScore3'>
1
</p>
</div>
</div>
</div>
<div class='widgetContainer'>
<div id='progressBar' class="layoutContainer">
<div id='barBack' class='barFlashHelper'></div>
<div id='barFront' class='barFlashHelper'>
<div id='paperOverlay'>
</div>
<img class='mainHeart' id='SecondHeart' src='src/youvegotmail.webp'>
<div class='infoBox' id='InfoBox1'>
<h1 id='Timer'>
00:00
</h1>
<p id='TimerInfo'>
!subathon for details
</p>
</div>
<div class='infoBox' id='InfoBox2'>
<p id='GoalLabel'>
Next Goal:
</p>
<div class='rightFadeWrap' id='RightFadeWrapInfoBox2'>
<div class='scrollWrap' id='ScrollWrapGoal'>
<div class='scrollWrapW' id='ScrollWrapGoalW'>
<p id='GoalName'>
Discord Watch Party + Puzzles
</p>
<p id='GoalNameDupe'>
Discord Watch Party + Puzzles
</p>
</div>
</div>
</div>
<div id='GoalProgressWrap'>
<div id='GoalProgressBar'>
<p id='GoalProgressTransparent' style='color: transparent;'>
1234/5678
</p>
</div>
<p id='GoalProgress'>
1234/5678
</p>
</div>
</div>
</div>
</div>
</div>