]>
Commit | Line | Data |
---|---|---|
1 | <!doctype html> | |
2 | <html> | |
3 | <head> | |
4 | <meta charset='utf-8'/> | |
5 | <title>Tabs Backup & Restore</title> | |
6 | ||
7 | <link rel='stylesheet' href='dark.css' media='(prefers-color-scheme: dark)'/> | |
8 | <link rel='stylesheet' href='light.css' media='(prefers-color-scheme: light), (prefers-color-scheme: no-preference)'/> | |
9 | <!-- Load theme override asap to help with initial loading/flashing. --> | |
10 | <link rel='stylesheet' href='' id='theme-override'/> | |
11 | <script src="theme-init.js"></script> | |
12 | ||
13 | <style> | |
14 | ||
15 | ::-webkit-scrollbar { | |
16 | width: 10px; | |
17 | } | |
18 | ||
19 | ::-webkit-scrollbar-track { | |
20 | background-color: #f4f4f4; | |
21 | } | |
22 | ||
23 | ::-webkit-scrollbar-thumb { | |
24 | background-color: #b9b9b9; | |
25 | } | |
26 | ||
27 | ||
28 | html { | |
29 | background-color: var(--body-color); | |
30 | filter: var(--body-filter); | |
31 | } | |
32 | ||
33 | body { | |
34 | font-family: Arial; | |
35 | min-width:357px; | |
36 | overflow-x: hidden; | |
37 | } | |
38 | ||
39 | a { | |
40 | cursor: hand; | |
41 | cursor: pointer; | |
42 | } | |
43 | ||
44 | img { | |
45 | margin:5px; | |
46 | border:2px solid black; | |
47 | vertical-align:middle; | |
48 | width:75px; | |
49 | height:75px; | |
50 | filter: var(--img-filter); | |
51 | } | |
52 | ||
53 | .menuItem { | |
54 | position: relative; | |
55 | background: #edf6fd; | |
56 | padding: 20px; | |
57 | margin-top: 0px; | |
58 | margin-left: 20px; | |
59 | margin-right: 20px; | |
60 | margin-bottom: 10px; | |
61 | color: black; | |
62 | display: block; | |
63 | cursor: hand; | |
64 | cursor: pointer; | |
65 | } | |
66 | ||
67 | .menuItem:hover { | |
68 | background: #d8edfc; | |
69 | } | |
70 | ||
71 | .backupItem { | |
72 | ||
73 | ||
74 | } | |
75 | ||
76 | .backupItemWrapper { | |
77 | padding: 4px 8px; | |
78 | } | |
79 | ||
80 | .backupItemContent { | |
81 | position: relative; | |
82 | padding: 8px; | |
83 | background: #f4f4f4; | |
84 | } | |
85 | ||
86 | .backupItemTitle { | |
87 | font-size: 14px; | |
88 | font-weight: bold; | |
89 | } | |
90 | ||
91 | .backupItemDetails { | |
92 | font-size: 12px; | |
93 | padding: 5px; | |
94 | } | |
95 | ||
96 | .backupItemDetailsNr { | |
97 | position: absolute; | |
98 | left: 100px; | |
99 | } | |
100 | ||
101 | .backupItemToolbar { | |
102 | position: absolute; | |
103 | display: block; | |
104 | right: 10px; | |
105 | top: 10px; | |
106 | } | |
107 | ||
108 | .backupItemToolbar a { | |
109 | cursor: hand; | |
110 | cursor: pointer; | |
111 | } | |
112 | ||
113 | .backupItemFooter { | |
114 | position: absolute; | |
115 | display: block; | |
116 | right: 10px; | |
117 | bottom: 10px; | |
118 | ||
119 | font-size: 10px; | |
120 | } | |
121 | ||
122 | .backupItemFooterAutoBackup { | |
123 | color: #23b827; | |
124 | } | |
125 | ||
126 | .backupItemFooterManualBackup { | |
127 | color: #d95843; | |
128 | } | |
129 | ||
130 | #backupsListTitle { | |
131 | position: relative; | |
132 | font-size: 15px; | |
133 | margin: 4px 10px; | |
134 | padding: 10px; | |
135 | padding-bottom: 0px; | |
136 | text-decoration:underline; | |
137 | } | |
138 | ||
139 | #storageDiv { | |
140 | margin-top: 4px; | |
141 | text-align: center; | |
142 | font-size: 10px; | |
143 | color: grey; | |
144 | } | |
145 | ||
146 | #showOlderBackupsDiv { | |
147 | text-align: center; | |
148 | } | |
149 | </style> | |
150 | ||
151 | <link rel="stylesheet" type="text/css" href="bootstrap.min.css" /> | |
152 | <script src="jquery-1.8.2.min.js"></script> | |
153 | <script src="bootstrap.min.js"></script> | |
154 | <script src="bootbox.min.js"></script> | |
155 | ||
156 | <style> | |
157 | .modal { | |
158 | width:300px; | |
159 | margin:-150px 0 0 -150px; | |
160 | } | |
161 | </style> | |
162 | <!-- JavaScript and HTML must be in separate files for security. --> | |
163 | <script src="popup.js?v=201211062258"></script> | |
164 | ||
165 | </head> | |
166 | <body> | |
167 | ||
168 | <!-- <button id="btnDoSomething">Do SOmething</button> --> | |
169 | <img src="icon.png" style="border: 0; padding-left: 8px; padding-right: 8px; width: 48px;" /><b>Tabs Backup & Restore</b> | |
170 | ||
171 | <a id="menuItem_options" style="position: absolute; right: 4px; top: 12px;">Options<img src="img/options.png" style="width: 24px;" /></a> | |
172 | ||
173 | <div id="menuItem_backupNow" class="menuItem" title="Create Backup"> | |
174 | Create Backup Now | |
175 | ||
176 | <div style="position: absolute; right: 20px; top: 0px; "> | |
177 | <img src="create_bkp_64.png" style="border: 0; width: 48px; height: 48px" /> | |
178 | </div> | |
179 | </div> | |
180 | ||
181 | ||
182 | <div id="backupsListTitle"> | |
183 | Your Backups | |
184 | <a id="menuItem_showAdvancedView" style="position: absolute; right: 0px; top: 2px;">Advanced Restore<img src="img/advanced_restore.png" style="width: 24px;" /></a> | |
185 | </div> | |
186 | <div id="backupsDiv"></div> | |
187 | ||
188 | <div id="showOlderBackupsDiv"> | |
189 | <a id="menuItem_showOlderBackups" style="">Show all backups..</a> | |
190 | </div> | |
191 | ||
192 | <div id="storageDiv"> | |
193 | Backups size: <span id="storageSpan"></span> | |
194 | </div> | |
195 | </body> | |
196 | </html> |