Project

General

Profile

Download (8.5 KB) Statistics
| Branch: | Tag: | Revision:

haketilo / html / display-panel.html @ c12b9ee3

1
<!doctype html>
2
<!--
3
    Copyright (C) 2021 Wojtek Kosior
4
    Redistribution terms are gathered in the `copyright' file.
5
  -->
6
<html>
7
  <head>
8
    <meta charset="utf-8"/>
9
    <title>Hachette - page settings</title>
10
    <link type="text/css" rel="stylesheet" href="reset.css" />
11
    <link type="text/css" rel="stylesheet" href="base.css" />
12
    <link type="text/css" rel="stylesheet" href="back_button.css" />
13
    <link type="text/css" rel="stylesheet" href="table.css" />
14
    <link type="text/css" rel="stylesheet" href="MOZILLA_scrollbar_fix.css" />
15
    <style>
16
      body {
17
	  width: max-content;
18
	  width: -moz-fit-content;
19
      }
20

    
21
      .top>h2 {
22
	  padding-left: calc(0.8*3.2em - 8px);
23
      }
24

    
25
      .top {
26
	  line-height: calc(0.8*3.6em - 16px);
27
      }
28

    
29
      #main_view>.top>h2 {
30
	  padding-left: 0;
31
      }
32

    
33
      .unroll_chbx:not(:checked)+div>:not(:first-child) {
34
	  display: none;
35
      }
36

    
37
      .unroll_triangle {
38
	  height: 1em;
39
	  width: 1em;
40
	  display: inline-block;
41
      }
42

    
43
      .unroll_triangle::after {
44
	  content: "";
45
	  width: 0.6em;
46
	  height: 0.6em;
47
	  background: linear-gradient(-45deg, currentColor 50%, transparent 50%);
48
	  display: block;
49
	  position: relative;
50
	  transform: rotate(-45deg);
51
	  top: 0.3em;
52
      }
53

    
54
      .unroll_chbx:checked+div>:first-child .unroll_triangle::after {
55
	  transform: rotate(45deg);
56
	  left: 0.2em;
57
	  top: 0.2em;
58
      }
59

    
60
      .unroll_chbx:checked+div>:first-child .unroll_block {
61
	  display: block;
62
      }
63

    
64
      .unroll_chbx:checked+div>:first-child {
65
	  line-height: 1.4em;
66
      }
67

    
68
      .l2_ul {
69
	  border-left: solid #454 5px;
70
      }
71

    
72
      .l1_li {
73
	  margin-top: 0.3em;
74
	  margin-bottom: 0.3em;
75
      }
76

    
77
      .l1_li>div {
78
	  padding: 0.3em 0.3em 0.3em 0;
79
      }
80

    
81
      .l2_li {
82
	  padding: 0.3em;
83
      }
84

    
85
      #container_for_injected>*:nth-child(odd),
86
      .l2_li:nth-child(odd) {
87
	  background-color: #e5e5e5;
88
      }
89

    
90
      #container_for_injected>#none_injected:not(:last-child) {
91
	  display: none;
92
      }
93

    
94
      #page_url_heading>span {
95
	  display: inline-block;
96
      }
97

    
98
      .back_button {
99
	  position: fixed;
100
	  z-index: 1;
101
	  top: 0;
102
	  left: 0;
103
	  /* The following scales the entire button. */
104
	  font-size: 80%;
105
      }
106

    
107
      #show_main_view_radio:checked~.back_button {
108
	  margin-left: -3.2em;
109
      }
110

    
111
      #show_main_view_radio:not(:checked)~.back_button {
112
	  transition: all 0.2s ease-out;
113
      }
114

    
115
      pre {
116
	  font-family: monospace;
117
	  background-color: white;
118
	  padding: 1px 5px;
119
      }
120

    
121
      .matched_pattern {
122
	  font-weight: bold;
123
      }
124

    
125
      tr.matched_pattern~tr {
126
	  color: #777;
127
	  font-size: 90%;
128
      }
129

    
130
      .padding_inline {
131
	  padding-left: 5px;
132
	  padding-right: 5px;
133
      }
134

    
135
      .padding_top {
136
	  padding-top: 5px;
137
      }
138

    
139
      .header {
140
	  padding-bottom: 0.3em;
141
	  margin-bottom: 0.5em;
142
	  text-align: center;
143
      }
144

    
145
      .middle {
146
	  margin-top: 0.5em;
147
	  margin-bottom: 0.5em;
148
      }
149

    
150
      .footer {
151
	  padding-top: 0.3em;
152
	  margin-top: 0.5em;
153
	  text-align: center;
154
      }
155

    
156
      .active_setting_table {
157
	  margin-bottom: 0.5em;
158
      }
159

    
160
      .active_setting_table td {
161
	  padding: 5px;
162
	  vertical-align: middle;
163
      }
164
    </style>
165
  </head>
166
  <body>
167
    <template>
168
      <tr id="pattern_entry" class="nowrap" data-template="entry">
169
	<td data-template="name"></td>
170
	<td>
171
	  <div class="button" data-template="button">Add setting</div>
172
	</td>
173
      </tr>
174

    
175
      <li id="query_match_li" class="l2_li" data-template="li">
176
	<div>
177
	  <span>pattern:</span>
178
	  <span class="bold" data-template="pattern"></span>
179
	  <label class="button slimbutton" for="show_install_view_radio" data-template="btn">
180
	    Install
181
	  </label>
182
	</div>
183
	<div id="unrollable_component" data-template="unroll_container">
184
	  <input type="checkbox" class="unroll_chbx" data-template="chbx"></input>
185
	  <div>
186
	    <span>payload:
187
	      <label class="bold unroll_block" data-template="lbl">
188
		<div data-template="triangle" class="unroll_triangle"></div>
189
		<span data-template="payload"></span>
190
	      </label>
191
	    </span>
192
	    <div data-template="unroll"></div>
193
	  </div>
194
	</div>
195
      </li>
196

    
197
      <div id="injected_script" data-template="div">
198
	<input type="checkbox" class="unroll_chbx" data-template="chbx"></input>
199
	<div>
200
	  <label data-template="lbl">
201
	    <h3><div class="unroll_triangle"></div> script</h3>
202
	  </label>
203
	  <pre class="has_bottom_thin_line has_upper_thin_line" data-template="script_contents"></pre>
204
	</div>
205
      </div>
206

    
207
      <div id="multi_repos_query_result" data-template="div">
208
	Results for <span class="bold" data-template="url_span"></span>
209
	<ul class="l1_ul" data-template="ul"></ul>
210
      </div>
211

    
212
      <li id="single_repo_query_result" class="l1_li" data-template="li">
213
	<div>
214
	  From <span class="bold" data-template="repo_url"></span>
215
	</div>
216
      </li>
217

    
218
      <ul id="result_patterns_list" class="l2_ul" data-template="ul">
219
      </ul>
220
    </template>
221

    
222
    <input id="show_install_view_radio" type="radio" class="show_next" name="current_view"></input>
223
    <div id="install_view">
224
      <div class="top has_bottom_line"><h2> Site modifiers install </h2></div>
225
      <div class="padding_inline">
226
	<IMPORT html/import_frame.html />
227
      </div>
228
    </div>
229

    
230
    <input id="show_injected_view_radio" type="radio" class="show_next" name="current_view"></input>
231
    <div id="injected_view">
232
      <div class="top has_bottom_line"><h2>Injected scripts</h2></div>
233
      <div id="container_for_injected">
234
	<span id="none_injected">None</span>
235
      </div>
236
    </div>
237

    
238
    <input id="show_patterns_view_radio" type="radio" class="show_next" name="current_view"></input>
239
    <div>
240
      <div class="top has_bottom_line"><h2>Possible patterns for this page</h2></div>
241
      <div class="padding_inline">
242
	<aside>
243
	  Patterns higher are more specific and override the ones below.
244
	</aside>
245
      </div>
246
      <div class="table_wrapper firefox_scrollbars_hacky_fix">
247
	<div>
248
	  <table>
249
	    <tbody id="possible_patterns">
250
	    </tbody>
251
	  </table>
252
	</div>
253
      </div>
254
      <div class="padding_inline padding_top has_upper_thin_line firefox_scrollbars_hacky_fix has_inline_content">
255
	<span class="nowrap">
256
	  <IMPORT html/default_blocking_policy.html />
257
	</span>
258
      </div>
259
    </div>
260

    
261
    <input id="show_queried_view_radio" type="radio" class="show_next" name="current_view"></input>
262
    <div>
263
      <div class="top has_bottom_line"><h2>Queried from repositories</h2></div>
264
      <div id="container_for_repo_responses" class="padding_inline">
265
      </div>
266
    </div>
267

    
268
    <input id="show_main_view_radio" type="radio" class="show_next" name="current_view" checked></input>
269
    <div id="main_view">
270
      <div class="top has_bottom_line"><h2 id="page_url_heading"></h2></div>
271
      <h3 id="privileged_notice" class="middle hide">Privileged page</h3>
272

    
273
      <div id="page_state" class="hide">
274
	<div class="header padding_inline has_bottom_thin_line">
275
	  <label for="show_patterns_view_radio" class="button">
276
	    Edit settings for this page
277
	  </label>
278
	</div>
279
	<div class="middle padding_inline">
280
	  <input id="connected_chbx" type="checkbox" class="show_hide_next2"></input>
281
	  <div>
282
	    <table class="active_setting_table">
283
	      <tbody>
284
		<tr class="nowrap">
285
		  <td>Matched pattern:</td>
286
		  <td id="pattern" class="bold">...</td>
287
		  <td>
288
		    <button id="view_pattern" class="hide">
289
		      View in settings
290
		    </button>
291
		  </td>
292
		</tr>
293
		<tr class="nowrap">
294
		  <td>Scripts blocked:</td>
295
		  <td id="blocked" class="bold">...</td>
296
		  <td></td>
297
		</tr>
298
		<tr class="nowrap">
299
		  <td>Injected payload:</td>
300
		  <td id="payload" class="bold">...</td>
301
		  <td id="payload_buttons" class="hide">
302
		    <button id="view_payload"> View in settings </button>
303
		    <br/>
304
		    <label id="view_injected" class="button" for="show_injected_view_radio">
305
		      View injected scripts
306
		    </label>
307
		  </td>
308
		</tr>
309
		<tr>
310
		  <td id="content_type" colspan="3" class="hide">
311
		    This is a non-HTML page. Chosen payload will not be injected.
312
		  </td>
313
		</tr>
314
	      </tbody>
315
	    </table>
316
	    <label id="query_pattern" for="show_queried_view_radio" class="button">
317
	      Install scripts for this page
318
	    </label>
319
	  </div>
320
	  <div>
321
	    <h3>
322
	      Connecting to content script..<span id="loading_point">.</span>
323
	    </h3>
324
	    <aside id="reload_notice">
325
	      Try reloading the page.
326
	    </aside>
327
	  </div>
328
	</div>
329
      </div>
330

    
331
      <div class="footer padding_inline has_upper_thin_line">
332
	<button id="settings_but" type="button">
333
	  Open Hachette settings
334
	</button>
335
      </div>
336
    </div>
337

    
338
    <div class="has_upper_line"></div>
339

    
340
    <label for="show_main_view_radio" class="back_button"><div></div></label>_POPUPSCRIPTS_
341
  </body>
342
</html>
(7-7/14)