Skip to content

Commit 97a5922

Browse files
authored
release/0.6 (#3)
* Sticky notes redesign and a lot of new functions to modify text inside of sticky notes * Fix sticky note box-shadow * Organize scripts * Time customization with ability to add up to 3 different clocks with different timezones * Add screenshot * Bugfix * Revert some changes * Add "Set extension as Homepage" sidebar section
1 parent f66aadf commit 97a5922

31 files changed

+1843
-1159
lines changed

README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,7 @@ To make the extension your homepage:
5252
![Sticky notes functionality](Screenshots/Sticky_notes_functionality.png "Sticky notes functionality")
5353
![Weather widget](Screenshots/Weather_widget.png "Weather widget")
5454
![Quotes widget](Screenshots/Quote_with_customization.png "Quotes widget with customization")
55+
![Time customization](Screenshots/Time_customization.png "Time customization")
5556

5657
---
5758

-1.33 MB
Loading

Screenshots/Time_customization.png

1.23 MB
Loading

index.html

Lines changed: 54 additions & 85 deletions
Original file line numberDiff line numberDiff line change
@@ -6,17 +6,19 @@
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>
@@ -28,6 +30,26 @@
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>

manifest.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"manifest_version": 2,
33
"name": "New Tab Extension",
44
"description": "An extension for about:newtab that brings life to the new tab.",
5-
"version": "0.5.3",
5+
"version": "0.6",
66
"homepage_url": "https://github.com/OldValencia/NewTab",
77

88
"chrome_url_overrides": {

0 commit comments

Comments
 (0)