forked from refined-github/refined-github
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathoptions.html
174 lines (161 loc) · 7.56 KB
/
options.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
<!doctype html>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<meta name="color-scheme" content="light dark">
<base target="_blank">
<link rel="shortcut icon" href="icon.png">
<title>Refined GitHub options</title>
<link rel="stylesheet" href="options.css">
<script type="module" src="header.js"></script>
<script type="module" src="storage-usage.js"></script>
<script type="module" src="options.js" defer></script>
<rgh-header title="Refined GitHub">
<p>
Visit the <a href="https://github.com/refined-github/refined-github/wiki">wiki</a> to learn about updates, debugging, and GitHub Enterprise.
You can <a href="https://chrome.google.com/webstore/detail/refined-github/hlepfoohegkhhmjieoechaddaejaokhf/reviews" id="rate-link">rate Refined GitHub</a> to help others find it.
Follow or sponsor <a href="https://github.com/sponsors/fregante">@fregante</a> if Refined GitHub helps you work more efficiently. 🍻
</p>
</rgh-header>
<div id="js-failed">JavaScript failed to load. Your development build failed or your browser has some issue.</div>
<form id="options-form" class="detail-view-container">
<details id="token">
<summary><strong>🔑 Personal token</strong></summary>
<div>
<p>You should <a id="personal-token-link" href="https://github.com/settings/tokens/new?description=Refined%20GitHub&scopes=repo,read:project">generate a token</a> to ensure that every feature works correctly. You can read more about the token on <a href="https://github.com/refined-github/refined-github/wiki/Security">the wiki.</a></p>
<p><strong>Token-less usage is not officially supported.</strong></p>
<p>
<input
type="text"
name="personalToken"
spellcheck="false"
autocomplete="password"
autocapitalize="off"
size="20"
class="monospace-field"
>
<span id="validation"></span>
</p>
<ul>
<li data-validation data-scope="valid_token">The token enables <a href="https://github.com/search?q=repo%3Arefined-github%2Frefined-github+%28api.js+OR+does-file-exist.js+OR+get-default-branch.js+OR+get-pr-info.js+OR+pr-ci-status.js%29+path%3A%2F%5Esource%5C%2Ffeatures%5C%2F%2F&type=code">some features</a> to <strong>read</strong> data from public repositories
<li data-validation data-scope="public_repo">The <code>public_repo</code> scope lets them <strong>edit</strong> your public repositories
<li data-validation data-scope="repo">The <code>repo</code> scope lets them <strong>edit private</strong> repositories as well
<li data-validation data-scope="read:project">The <code>read:project</code> scope lets them determine if a repo/org uses projects
</ul>
</div>
</details>
<details id="toggle-all" hidden>
<summary><strong>🏳️ Toggle all features</strong></summary>
<div>
<p>
If you're trying to identify a feature, please use "Identify feature" instead. Refined GitHub only implements lightweight features that are helpful to most people, even if they're tiny improvements. They're meant to "blend in" and fill in the gaps of GitHub's interface.
</p>
<p>
If you want to go through and only select a few improvements, you'll miss out on the best parts of Refined GitHub. Also note that new features will still be enabled by default and that some CSS-only refinements cannot be disabled.
</p>
<p>
<button id="disable-all-features">Disable all features</button>
<button id="enable-all-features">Enable all features</button>
</p>
</div>
</details>
<details id="features">
<summary><strong class="features-header">🔋 Features</strong></summary>
<div>
<p>
<input id="filter-features" type="text" placeholder="Find features" spellcheck="false" autocomplete="off" autocapitalize="off">
<small>Use the "Identify feature" section below if you can't find what you're looking for.</small>
</p>
<div class="js-features"></div>
</div>
</details>
<details id="bisect">
<summary><strong>🔎 Identify feature</strong></summary>
<div>
<p>
This process will help you identify what Refined GitHub feature is making changes or causing issues on GitHub.
</p>
<p id="find-feature-message" hidden>
Visit the GitHub page where you want to find the feature and refresh it to see the instructions. You can navigate to any page, but don’t use multiple tabs.
</p>
<p>
<button id="find-feature">Start process to identify feature…</button>
</p>
</div>
</details>
<details id="css">
<summary><strong>💅 Custom CSS</strong></summary>
<div>
<p>Like a userstyle, useful to undo unwanted style changes</p>
<p><textarea name="customCSS" rows="2" spellcheck="false" class="monospace-field"></textarea></p>
<p>Options storage: <storage-usage area="sync" item="options">unknown</storage-usage></p>
<p>When the storage is full, the options <a href="https://github.com/fregante/webext-options-sync/issues/27">will stop being saved</a>. If you need to use a lot of CSS, use a dedicated userstyle extension.</p>
</div>
</details>
<details id="action">
<summary><strong>🔗 Button link</strong></summary>
<div>
<p>You can pick what page opens when you click the Refined GitHub icon in the browser toolbar</p>
<p><input type="url" name="actionUrl" placeholder="https://example.com" spellcheck="false" autocomplete="off" autocapitalize="off"></p>
<p>If left empty, clicking it will open this options page.</p>
</div>
</details>
<details id="debugging">
<summary><strong>🐛 Debugging</strong></summary>
<div>
<p>
<label>
<input type="checkbox" name="logging">
Show the features enabled on each page in the console
</label>
</p>
<p>
<label>
<input type="checkbox" name="logHTTP">
Log API calls in the console
</label>
</p>
<p>
Options storage: <storage-usage area="sync" item="options">unknown</storage-usage><br>
Cache storage: <storage-usage area="local">unknown</storage-usage><br>
Refined Github version: <output id="version">unknown</output>
</p>
<p>
<button id="clear-cache">Clear cache</button>
</p>
<p>
<!-- Native link that looks like a button (to blend in better). Don't @ me -->
<button type="submit" form="welcome-page-link">Open welcome page</button>
</p>
<p>
<button id="toggle-all-features">Toggle all features…</button>
</p>
</div>
</details>
<details id="hotfixes">
<summary><strong>☄️ Hotfixes</strong></summary>
<div>
<p>In order to address severe issues as quickly as possible, Refined GitHub loads a list of disabled features and temporary CSS fixes. <a href="https://github.com/refined-github/yolo">More info.</a></p>
<p>This is the latest CSS fetched from the server (if any):</p>
<p><textarea id="hotfixes-field" rows="2" disabled></textarea></p>
<p><textarea id="broken-features-field" rows="2" disabled hidden></textarea></p>
<button type="button" id="fetch-hotfixes">Fetch hotfixes</button>
</div>
</details>
<details id="export">
<summary><strong>🗄️ Export options</strong></summary>
<div>
<p>
You can export and import options across browsers and devices via a JSON file. If you're a GitHub Enterprise user, you will need to export each domain separately.
</p>
<p>
<strong>Note</strong> that your options include your access token if provided.
</p>
<p>
<button type="button" class="js-export">Export</button>
<button type="button" class="js-import">Import</button>
</p>
</div>
</details>
</form>
<!-- Native link that looks like a button (to blend in better). Don't @ me -->
<form action="./welcome.html" method="get" target="_blank" id="welcome-page-link"></form>