|
25 | 25 | <a id='restrictionsBtn'>Limits</a> |
26 | 26 | <a id='notifyBtn'>Notifications</a> |
27 | 27 | <a id='aboutBtn'>About</a> |
28 | | - <a id='donateBtn'>Donate</a> |
29 | 28 | </div> |
30 | 29 | <div id='block'> |
31 | 30 | <div id='settingsBlock'> |
32 | | - <label> |
| 31 | + <label class="setting-header"> |
33 | 32 | <input type="checkbox" class="filled-in" id="viewTimeInBadge" /> |
34 | 33 | <span>Display time tracker in icon</span> |
35 | 34 | </label> |
36 | 35 | <div class="margin-top-10"> |
37 | | - <label> |
| 36 | + <label class="setting-header"> |
38 | 37 | <input type="checkbox" class="filled-in" id="blockDeferral" /> |
39 | 38 | <span>Allow deferring block for 5 minutes</span> |
40 | 39 | </label> |
41 | 40 | </div> |
42 | 41 | <div class="margin-top-10"> |
43 | | - <label> |
| 42 | + <label class="setting-header"> |
44 | 43 | <input type="checkbox" class="filled-in" id="darkMode" /> |
45 | 44 | <span>Dark mode</span> |
46 | 45 | </label> |
47 | 46 | </div> |
| 47 | + <div class="separator"></div> |
48 | 48 | <div class="margin-top-10"> |
49 | | - <label>Stop tracking if no activity detected for: </label> |
| 49 | + <label class="setting-header">Stop tracking if no activity detected for: </label> |
50 | 50 | <div class="tooltip"><img src="/icons/information.svg" height="18" /> |
51 | 51 | <span class="tooltiptext">An activity is an action with a mouse or keyboard</span> |
52 | 52 | </div> |
|
62 | 62 | <option value="1800">30 mins</option> |
63 | 63 | </select> |
64 | 64 | </div> |
65 | | - <div class="margin-top-10"><label>Default range for days:</label></div> |
| 65 | + <div class="separator"></div> |
| 66 | + <div class="margin-top-10"><label class="setting-header">Default range for days:</label></div> |
66 | 67 | <div class="margin-top-10"> |
67 | 68 | <select id='rangeToDays' class="option"> |
68 | 69 | <option value="days2">2 days</option> |
|
76 | 77 | <option value="month3">3 month</option> |
77 | 78 | </select> |
78 | 79 | </div> |
| 80 | + <div class="separator"></div> |
79 | 81 | <div class="margin-top-10"> |
80 | | - <label>Ignored list of domain: </label> |
| 82 | + <label class="setting-header">Ignored list of domain: </label> |
81 | 83 | <div class="tooltip"><img src="/icons/information.svg" height="18" /> |
82 | 84 | <span class="tooltiptext">Activity for these domains not will tracked</span> |
83 | 85 | </div> |
|
92 | 94 | The site is already in the list |
93 | 95 | </div> |
94 | 96 | </div> |
| 97 | + <div class="separator"></div> |
95 | 98 | <div class="margin-top-10"> |
96 | 99 | <input type="button" value="Export to CSV" id='exportToCsv'> |
97 | 100 | </div> |
| 101 | + <div class="separator"></div> |
98 | 102 | <div class="margin-top-10"> |
99 | 103 | <input type="button" value="Backup" id='backup'> |
100 | 104 | <input type="button" value="Restore" id='restore'> |
|
109 | 113 | <div class="notify warning" id='notify-restore-failed' hidden> |
110 | 114 | Backup file is not valid |
111 | 115 | </div> |
| 116 | + <div class="separator"></div> |
112 | 117 | <!-- YouTube --> |
113 | 118 | <div class="margin-top-10"> |
114 | 119 | <label class="block">Web Activity Time Tracker tracks your activity when you're active in |
|
124 | 129 | id='grantPermissionForYT'> |
125 | 130 | <div id='permissionSuccessedBlockForYT' hidden> |
126 | 131 | <img src="/icons/success.png" height="18" /> |
127 | | - <label>Permissions have been granted</label> |
| 132 | + <label class="setting-header">Permissions have been granted</label> |
128 | 133 | </div> |
129 | 134 | </div> |
130 | 135 | <!-- Netflix --> |
|
134 | 139 | id='grantPermissionForNetflix'> |
135 | 140 | <div id='permissionSuccessedBlockForNetflix' hidden> |
136 | 141 | <img src="/icons/success.png" height="18" /> |
137 | | - <label>Permissions have been granted</label> |
| 142 | + <label class="setting-header">Permissions have been granted</label> |
138 | 143 | </div> |
139 | 144 | </div> |
| 145 | + <div class="separator"></div> |
140 | 146 | <div class="margin-top-10"> |
141 | | - <label>Data in memory use </label><label id='memoryUse'></label> |
| 147 | + <label class="setting-header">Data in memory use </label><label id='memoryUse'></label> |
142 | 148 | </div> |
143 | 149 | <div class="margin-top-10"><input type="button" value="Clear all data" id='clearAllData'></div> |
144 | 150 | <div class="notify" id='notify' hidden> |
|
147 | 153 | </div> |
148 | 154 | </div> |
149 | 155 | <div id='restrictionsBlock' hidden> |
150 | | - <label>Access daily restrictions for websites: </label> |
| 156 | + <label class="setting-header">Access daily restrictions for websites: </label> |
151 | 157 | <div class="tooltip"><img src="/icons/information.svg" height="18" /> |
152 | 158 | <span class="tooltiptext">Set the maximum time allowed on the site per day. After this time, has elapsed the site will be blocked.</span> |
153 | 159 | </div> |
|
167 | 173 | </div> |
168 | 174 | </div> |
169 | 175 | <div id='notifyBlock' hidden> |
170 | | - <label>List of sites with notifications: </label> |
| 176 | + <label class="setting-header">List of sites with notifications: </label> |
171 | 177 | <div class="tooltip"><img src="/icons/information.svg" height="18" /> |
172 | 178 | <span class="tooltiptext">Show notifications every time you spend a specified time interval on the |
173 | 179 | site</span> |
|
183 | 189 | <ul id='notifyList' class="listbox list" size="10"></ul> |
184 | 190 | </div> |
185 | 191 | <div class="margin-top-10"> |
186 | | - <label>You can set message for notification: </label> |
| 192 | + <label class="setting-header">You can set message for notification: </label> |
187 | 193 | <div class="setting-notify-block"> |
188 | 194 | <img src="icons/128x128.png" class="setting-notify-img"> |
189 | 195 | <div class="setting-notify-message-block"> |
|
200 | 206 | id='grantPermissionForNotifications'> |
201 | 207 | <div id='permissionSuccessedBlockForNotifications' hidden> |
202 | 208 | <img src="/icons/success.png" height="18" /> |
203 | | - <label>Permissions have been granted</label> |
| 209 | + <label class="setting-header">Permissions have been granted</label> |
204 | 210 | </div> |
205 | 211 | </div> |
206 | 212 | <div class="notify warning notify-width-300" id='notifyForNotifyList' hidden> |
|
231 | 237 | target="_blank">Let me know!</a></label> |
232 | 238 | </div> |
233 | 239 | </div> |
234 | | - <div id='donateBlock' hidden> |
235 | | - <div> |
236 | | - <label>You can support Web Activity Time Tracker by donating:</label> |
237 | | - <div class="margin-top-20"> |
238 | | - <div class="inline-block"> |
239 | | - <a class="bmc-button" target="_blank" href="https://www.buymeacoffee.com/webtracker"><img |
240 | | - src="/icons/bmc-new-btn-logo.svg" alt="Buy me a coffee"><span>Buy me a |
241 | | - coffee</span></a> |
242 | | - </div> |
243 | | - </div> |
244 | | - </div> |
245 | | - </div> |
246 | 240 | </div> |
247 | 241 | </div> |
248 | 242 | </body> |
|
0 commit comments