]> git.wh0rd.org - chrome-ext/tabs-backup.git/blobdiff - options.html
makedist: normalize name
[chrome-ext/tabs-backup.git] / options.html
index 5a59c12b7504d25b400ce0c27ed6510c96e1be48..4a1402215cd1beca07caa538d76761b4299dec52 100644 (file)
@@ -1,11 +1,20 @@
 <!doctype html>
 <html>
   <head>
+    <meta charset='utf-8'/>
     <title>Tabs Backup & Restore - Options</title>
+
+    <link rel='stylesheet' href='dark.css' media='(prefers-color-scheme: dark)'/>
+    <link rel='stylesheet' href='light.css' media='(prefers-color-scheme: light), (prefers-color-scheme: no-preference)'/>
+    <!-- Load theme override asap to help with initial loading/flashing. -->
+    <link rel='stylesheet' href='' id='theme-override'/>
+    <script src="theme-init.js"></script>
+
     <style>
       body {
                font-family: Arial;
-
+               background-color: var(--body-color);
+               filter: var(--body-filter);
         overflow-x:hidden;
       }
 
@@ -21,6 +30,7 @@
         vertical-align:middle;
         width:75px;
         height:75px;
+               filter: var(--img-filter);
       }
 
          .menuItem {
          select {
                padding: 5px;
          }
+
+         button.selected {
+               filter: invert(1);
+         }
     </style>
 
        <!-- <script src="jquery-1.8.2.min.js"></script> -->
   <body>
   <div id="content">
 
-         <img src="icon.png" style="border: 0; padding: 10px;" /><b>Tabs Backup & Restore - Options</b>
-
-
-
-         <div id="smallDescription">
-         With Tabs Backup & Restore you will never lose your work again!<br /><br />
-         Backup an entire Chrome session (all opened windows and tabs) and restore it when needed.<br />
-         Backups are created automatically, but can also be created manually whenever you want.
-         </div>
-
          <div id="prefs">
 
          <table>
                                The maximum number of backups to keep. Old backups will be deleted when this number is reached.
                        </td>
                </tr>
+
+               <tr class="prefsRow">
+                       <td width="200">Theme</td>
+                       <td style="white-space: nowrap">
+                       <input type="text" id="prefsTheme" hidden>
+                       <button id="theme-light">Light</button>
+                       <button id="theme-system">System</button>
+                       <button id="theme-dark">Dark</button>
+                       </td>
+               </tr>
+               <tr>
+                       <td colspan="2" class="prefsDescription">
+                               The color scheme to use in this extension.
+                       </td>
+               </tr>
+
          </table>
 
          </div>