66
77 < link rel ="icon " type ="image/x-icon " href ="icons/favicon.ico ">
88
9- < link rel ="stylesheet " href ="styles/main.style.css "/>
10- < link rel ="stylesheet " href ="styles/starfield.style.css "/>
11- < link rel ="stylesheet " href ="styles/time.style.css "/>
12- < link rel ="stylesheet " href ="styles/links.style.css "/>
13- < link rel ="stylesheet " href ="styles/sidebar.style.css "/>
14- < link rel ="stylesheet " href ="styles/sticky-notes.style.css "/>
15- < link rel ="stylesheet " href ="styles/weather.style.css "/>
16- < link rel ="stylesheet " href ="styles/greeting.style.css "/>
17- < link rel ="stylesheet " href ="styles/quotes.style.css "/>
18-
19- < link href ="https://fonts.googleapis.com/css2?family=Roboto&family=Open+Sans&family=Lato&family=Quicksand&family=Fira+Sans&display=swap " rel ="stylesheet ">
9+ < link rel ="stylesheet " href ="styles/main.css "/>
10+ < link rel ="stylesheet " href ="styles/starfield.css "/>
11+ < link rel ="stylesheet " href ="styles/time.css "/>
12+ < link rel ="stylesheet " href ="styles/links.css "/>
13+ < link rel ="stylesheet " href ="styles/sidebar.css "/>
14+ < link rel ="stylesheet " href ="styles/sidebar.homepage.css "/>
15+ < link rel ="stylesheet " href ="styles/sticky-notes.css "/>
16+ < link rel ="stylesheet " href ="styles/weather.css "/>
17+ < link rel ="stylesheet " href ="styles/greeting.css "/>
18+ < link rel ="stylesheet " href ="styles/quotes.css "/>
19+
20+ < link href ="https://fonts.googleapis.com/css2?family=Roboto&family=Open+Sans&family=Lato&family=Quicksand&family=Fira+Sans&display=swap "
21+ rel ="stylesheet ">
2022</ head >
2123< body >
2224< div id ="sticky-notes-container "> </ div >
2830< button id ="menu-toggle " class ="menu-button "> ☰</ button >
2931
3032< div id ="sidebar " class ="sidebar ">
33+ < section data-section ="links ">
34+ < div class ="section-header ">
35+ < span class ="section-icon "> 🏠</ span >
36+ < h3 > Set extension as Homepage</ h3 >
37+ < button class ="toggle-section "> +</ button >
38+ </ div >
39+ < div class ="section-content ">
40+ < div id ="instructions ">
41+ < h3 > How to set this page as your Homepage in Firefox:</ h3 >
42+ < ol >
43+ < li > Open Firefox Settings (Menu → Settings).</ li >
44+ < li > Go to the < strong > Home</ strong > section.</ li >
45+ < li > In the < strong > Homepage</ strong > field, paste this URL:</ li >
46+ < input type ="text " id ="homepage-url-input " readonly >
47+ < button id ="copy-homepage-url "> Copy URL</ button >
48+ < li > Press Enter and close the settings tab.</ li >
49+ </ ol >
50+ </ div >
51+ </ div >
52+ </ section >
3153 < h2 id ="customization-title "> Customization</ h2 >
3254
3355 <!-- 🔗 Links -->
@@ -72,70 +94,8 @@ <h3>Time and date</h3>
7294 < button class ="toggle-section "> +</ button >
7395 </ div >
7496 < div class ="section-content ">
75- < div class ="font-control ">
76- < label > Time:</ label >
77- < select id ="time-font ">
78- < option value ="Arial "> Arial (default)</ option >
79- < option value ="Segoe UI "> Segoe UI</ option >
80- < option value ="Georgia "> Georgia</ option >
81- < option value ="Courier New "> Courier New</ option >
82- < option value ="Roboto "> Roboto</ option >
83- < option value ="Helvetica "> Helvetica</ option >
84- < option value ="Verdana "> Verdana</ option >
85- < option value ="Tahoma "> Tahoma</ option >
86- < option value ="Trebuchet MS "> Trebuchet MS</ option >
87- < option value ="Lucida Sans "> Lucida Sans</ option >
88- < option value ="Times New Roman "> Times New Roman</ option >
89- < option value ="Fira Sans "> Fira Sans</ option >
90- < option value ="Open Sans "> Open Sans</ option >
91- < option value ="Lato "> Lato</ option >
92- < option value ="Quicksand "> Quicksand</ option >
93- < option value ="Monaco "> Monaco</ option >
94- </ select >
95- < input type ="color " id ="time-color ">
96- </ div >
97-
98- < div class ="font-control ">
99- < label > Date:</ label >
100- < select id ="date-font ">
101- < option value ="Arial "> Arial (default)</ option >
102- < option value ="Segoe UI "> Segoe UI</ option >
103- < option value ="Georgia "> Georgia</ option >
104- < option value ="Courier New "> Courier New</ option >
105- < option value ="Roboto "> Roboto</ option >
106- < option value ="Helvetica "> Helvetica</ option >
107- < option value ="Verdana "> Verdana</ option >
108- < option value ="Tahoma "> Tahoma</ option >
109- < option value ="Trebuchet MS "> Trebuchet MS</ option >
110- < option value ="Lucida Sans "> Lucida Sans</ option >
111- < option value ="Times New Roman "> Times New Roman</ option >
112- < option value ="Fira Sans "> Fira Sans</ option >
113- < option value ="Open Sans "> Open Sans</ option >
114- < option value ="Lato "> Lato</ option >
115- < option value ="Quicksand "> Quicksand</ option >
116- < option value ="Monaco "> Monaco</ option >
117- </ select >
118- < input type ="color " id ="date-color ">
119- </ div >
120-
121- < div class ="format-control ">
122- < label for ="time-format "> Time format:</ label >
123- < select id ="time-format ">
124- < option value ="24 "> 24-hour</ option >
125- < option value ="12 "> 12-hour (AM/PM)</ option >
126- </ select >
127- </ div >
128-
129- < div class ="format-control ">
130- < label for ="date-format "> Date format:</ label >
131- < select id ="date-format ">
132- < option value ="month-day-year "> July 20 2025</ option >
133- < option value ="day-month-year "> 20 July 2025</ option >
134- < option value ="year-month-day "> 2025 July 20</ option >
135- < option value ="dd-mm-yyyy "> 20-07-2025</ option >
136- < option value ="mm-dd-yyyy "> 07-20-2025</ option >
137- </ select >
138- </ div >
97+ < div id ="time-and-date-controls "> </ div >
98+ < button id ="add-clock " class ="add-clock "> Add clock</ button >
13999
140100 < button id ="reset-time-date " class ="reset-button "> Reset Time & Date Settings</ button >
141101
@@ -217,7 +177,8 @@ <h4>Background Effects</h4>
217177 < label > Blur: < input type ="range " id ="bg-blur " min ="0 " max ="40 " step ="1 " value ="0 "> </ label >
218178 < label > Brightness: < input type ="range " id ="bg-brightness " min ="20 " max ="150 " step ="1 "
219179 value ="100 "> </ label >
220- < label > Vignette Intensity: < input type ="range " id ="bg-vignette " min ="0 " max ="100 " step ="1 " value ="0 "> </ label >
180+ < label > Vignette Intensity: < input type ="range " id ="bg-vignette " min ="0 " max ="100 " step ="1 "
181+ value ="0 "> </ label >
221182 < label > Image Fit:
222183 < select id ="bg-fit ">
223184 < option value ="cover "> Cover</ option >
@@ -360,8 +321,7 @@ <h3>Daily Quote widget</h3>
360321< div class ="greeting " id ="greeting "> </ div >
361322
362323< div class ="time-container ">
363- < div class ="time " id ="time "> 00:00</ div >
364- < div class ="date " id ="date " data-tooltip ="01-15-2025 "> July 20 2025</ div >
324+ < div id ="multiple-clocks "> </ div >
365325
366326 < div class ="quote-container " id ="quote-container ">
367327 < div class ="quote-text " id ="quote-text "> Loading quote...</ div >
@@ -383,19 +343,28 @@ <h3>Daily Quote widget</h3>
383343< script src ="scripts/config.js "> </ script >
384344< script src ="scripts/main.js "> </ script >
385345< script src ="scripts/version.js "> </ script >
346+
386347< script src ="scripts/effects/effects-main.js "> </ script >
387348< script src ="scripts/effects/star-generator.js "> </ script >
388349< script src ="scripts/effects/blob-flow.js "> </ script >
389350< script src ="scripts/effects/nebula-dust.js "> </ script >
390351< script src ="scripts/effects/glass-grid.js "> </ script >
391352< script src ="scripts/effects/orbital-rings.js "> </ script >
392353< script src ="scripts/effects/particle-drift.js "> </ script >
393- < script src ="scripts/time.js "> </ script >
394- < script src ="scripts/links-service.js "> </ script >
395- < script src ="scripts/sidebar.js "> </ script >
396- < script src ="scripts/sticky-notes.js "> </ script >
397- < script src ="scripts/weather.js "> </ script >
398- < script src ="scripts/greeting.js "> </ script >
399- < script src ="scripts/quotes.js "> </ script >
354+
355+ < script src ="scripts/widgets/sticky-notes.js "> </ script >
356+ < script src ="scripts/widgets/weather.js "> </ script >
357+ < script src ="scripts/widgets/greeting.js "> </ script >
358+ < script src ="scripts/widgets/quotes.js "> </ script >
359+ < script src ="scripts/widgets/time.js "> </ script >
360+ < script src ="scripts/widgets/links-service.js "> </ script >
361+
362+ < script src ="scripts/sidebar/homepage.js "> </ script >
363+ < script src ="scripts/sidebar/background.js "> </ script >
364+ < script src ="scripts/sidebar/dateandtime.js "> </ script >
365+ < script src ="scripts/sidebar/links.js "> </ script >
366+ < script src ="scripts/sidebar/stickynotes.js "> </ script >
367+ < script src ="scripts/sidebar/weather.js "> </ script >
368+ < script src ="scripts/sidebar/sidebar.js "> </ script >
400369</ body >
401370</ html >
0 commit comments