-
Notifications
You must be signed in to change notification settings - Fork 13
/
manage.html
176 lines (175 loc) · 10.6 KB
/
manage.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
175
176
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/png" href="images/128.png">
<title i18n-text="extName"></title>
<link rel="stylesheet" href="third-party/material-design-icons/material-icons.min.css"/>
<link rel="stylesheet" href="third-party/mdl/material.min.css"/>
<link rel="stylesheet" href="styles/page.css"/>
<link rel="stylesheet" href="styles/page/manage.css"/>
<template data-id="style">
<section class="mdl-card mdl-shadow--2dp style-item">
<div class="mdl-card__title mdl-card--expand">
<h2 class="mdl-card__title-text"><a target="_blank" class="style-name"></a></h2>
</div>
<div class="mdl-card__supporting-text applies-to"></div>
<div class="mdl-card__actions mdl-card--border">
<a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect style-edit-link" href="edit.html?id=" i18n-text="editStyleLabel"></a>
<a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect delete" i18n-text="deleteStyleLabel"></a>
<a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect style-export-link" href="export.html?id=" i18n-text="export"></a>
<a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect style-advanced-link hidden" href="advanced.html?id=" i18n-text="advancedTitle"></a>
<a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect update hidden"><span i18n-text="updateOneStyle"></span><div class="loading mdl-spinner mdl-js-spinner is-active"></div></a>
<button class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect update-switcher hidden" i18n-text="autoUpdateLabel"></button>
</div>
<div class="mdl-card__menu">
<label class="mdl-switch enable-switcher"><input type="checkbox" class="mdl-switch__input activate" /></label>
</div>
</section>
</template>
<script src="scripts/browser-polyfill.js"></script>
<script src="scripts/common.js"></script>
<script src="scripts/userstyle.js"></script>
<script src="third-party/less/less.min.js"></script>
<script src="third-party/clean-css/clean-css.min.js"></script>
<script src="scripts/localization.js"></script>
<script src="scripts/health.js"></script>
<script src="scripts/storage.js"></script>
<script src="scripts/messaging.js"></script>
<script src="scripts/inject/apply.js"></script>
<script src="scripts/fileSaveLoad.js"></script>
<script src="scripts/page/manage.js"></script>
</head>
<body id="xstyle-manage">
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
<header class="mdl-layout__header">
<div class="mdl-layout__tab-bar mdl-js-ripple-effect">
<a href="#style-panel" class="mdl-layout__tab is-active"><i class="material-icons">style</i><span i18n-text="styles"></span></a>
<a href="#option-panel" class="mdl-layout__tab"><i class="material-icons">settings</i><span i18n-text="optionsHeading"></span></a>
<a href="#backup-panel" class="mdl-layout__tab"><i class="material-icons">settings_backup_restore</i><span i18n-text="exportAndImport"></span></a>
<div class="mdl-layout-spacer"></div>
<a href="https://github.com/FirefoxBar/xStyle/wiki" class="mdl-layout__tab"><i class="material-icons">help</i><span i18n-text="helpAlt"></span></a>
</div>
</header>
<main class="mdl-layout__content">
<section class="mdl-layout__tab-panel is-active" id="style-panel">
<div class="page-content">
<div class="action">
<button id="sort-options" class="mdl-button mdl-js-button mdl-js-ripple-effect"><i class="material-icons">sort</i><span i18n-text="sortStyles"></span></button>
<ul class="mdl-menu mdl-menu--bottom-left mdl-js-menu mdl-js-ripple-effect sort-method-list" for="sort-options">
<li data-method="id" class="mdl-menu__item" i18n-text="sortStylesById"></li>
<li data-method="status" class="mdl-menu__item" i18n-text="sortStylesByStatus"></li>
<li data-method="name" class="mdl-menu__item" i18n-text="sortStylesByName"></li>
<li data-method="modified" class="mdl-menu__item" i18n-text="sortStylesByModified"></li>
</ul>
<button id="update-all-styles" class="mdl-button mdl-js-button mdl-js-ripple-effect"><i class="material-icons">refresh</i><span i18n-text="updateAllStyles"></span></button>
<a href="edit.html" class="mdl-button mdl-js-button mdl-js-ripple-effect"><i class="material-icons">add</i><span i18n-text="addStyleLabel"></span></a>
<button id="install-from-file" class="mdl-button mdl-js-button mdl-js-ripple-effect"><i class="material-icons">create_new_folder</i><span i18n-text="installFromFile"></span></button>
</div>
<div id="installed"></div>
</div>
</section>
<section class="mdl-layout__tab-panel" id="option-panel">
<div class="page-content">
<div class="mdl-card mdl-shadow--2dp option">
<div class="mdl-card__title mdl-card--expand">
<h2 class="mdl-card__title-text" i18n-text="optionsHeading"></h2>
</div>
<div class="mdl-card__supporting-text mdl-grid">
<label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect mdl-cell mdl-cell--6-col" id="show-badge-label" for="show-badge">
<input type="checkbox" id="show-badge" class="mdl-checkbox__input">
<span class="mdl-checkbox__label" i18n-text="prefShowBadge"></span>
</label>
<label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect mdl-cell mdl-cell--6-col" id="modify-csp-label" for="modify-csp">
<input type="checkbox" id="modify-csp" class="mdl-checkbox__input">
<span class="mdl-checkbox__label" i18n-text="modifyCSP"></span>
</label>
<label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect mdl-cell mdl-cell--6-col" id="auto-update-label" for="auto-update">
<input type="checkbox" id="auto-update" class="mdl-checkbox__input">
<span class="mdl-checkbox__label" i18n-text="autoUpdateStyles"></span>
</label>
<label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect mdl-cell mdl-cell--6-col" id="compact-popup-label" for="compact-popup">
<input type="checkbox" id="compact-popup" class="mdl-checkbox__input">
<span class="mdl-checkbox__label" i18n-text="displayCompactPopup"></span>
</label>
<label class="mdl-checkbox mdl-js-checkbox mdl-js-ripple-effect mdl-cell mdl-cell--6-col" id="only-applies-html-label" for="only-applies-html">
<input type="checkbox" id="only-applies-html" class="mdl-checkbox__input">
<span class="mdl-checkbox__label" i18n-text="onlyAppliesToHTML"></span>
</label>
</div>
</div>
</div>
</section>
<section class="mdl-layout__tab-panel" id="backup-panel">
<div class="page-content">
<div class="mdl-card mdl-shadow--2dp file">
<div class="mdl-card__title mdl-card--expand">
<h2 class="mdl-card__title-text" i18n-text="exportAndImport"></h2>
</div>
<div class="mdl-card__supporting-text backup-buttons">
<button id="file-all-styles" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect" i18n-text="bckpInstStyles"></button>
<button id="unfile-all-styles" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect" i18n-text="retrieveBckp"></button>
<a class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect" href="http://stylish.team.firefoxcn.net/" i18n-text="importFromFirefoxStylish"></a>
</div>
</div>
<div class="mdl-card mdl-shadow--2dp cloud">
<div class="mdl-card__title mdl-card--expand">
<h2 class="mdl-card__title-text" i18n-text="cloudTitle"></h2>
</div>
<div class="mdl-card__supporting-text">
<label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="cloud-onedrive">
<input type="radio" id="cloud-onedrive" class="mdl-radio__button" name="cloud-type" value="OneDrive" checked>
<span class="mdl-radio__label">OneDrive</span>
</label>
<label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="cloud-google">
<input type="radio" id="cloud-google" class="mdl-radio__button" name="cloud-type" value="Google">
<span class="mdl-radio__label">Google Drive</span>
</label>
<label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="cloud-dropbox">
<input type="radio" id="cloud-dropbox" class="mdl-radio__button" name="cloud-type" value="Dropbox">
<span class="mdl-radio__label">Dropbox</span>
</label>
<table class="mdl-data-table mdl-js-data-table" style="border:0">
<thead>
<tr>
<th class="mdl-data-table__cell--non-numeric" i18n-text="cloudFileName"></th>
<th i18n-text="cloudFileSize"></th>
<th class="mdl-data-table__cell--non-numeric" i18n-text="cloudFileAction"></th>
</tr>
</thead>
<tbody id="cloud_filelist">
<tr class="special template">
<td class="name mdl-data-table__cell--non-numeric"></td>
<td class="size"></td>
<td class="mdl-data-table__cell--non-numeric">
<button class="mdl-button mdl-js-ripple-effect import"><span i18n-text="cloudImport"></span><div class="mdl-spinner mdl-js-spinner is-active"></div></button>
<button class="mdl-button mdl-js-ripple-effect delete"><span i18n-text="cloudDelete"></span><div class="mdl-spinner mdl-js-spinner is-active"></div></button>
</td>
</tr>
<tr class="special" id="cloud_loading"><td colspan="3"><div class="mdl-spinner mdl-js-spinner is-active"></div></td></tr>
<tr class="special" id="cloud_loaded">
<td colspan="3">
<button id="cloud_export" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect" i18n-text="cloudExport"></button>
<button id="cloud_reload_list" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect" i18n-text="cloudReload"></button>
</td>
</tr>
<tr class="special" id="cloud_beforeload"><td colspan="3"><button id="cloud_load_list" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect" i18n-text="cloudLoadList"></button></td></tr>
</tbody>
</table>
</div>
</div>
</div>
</section>
</main>
</div>
<div id="toast" class="mdl-js-snackbar mdl-snackbar">
<div class="mdl-snackbar__text"></div>
<button class="mdl-snackbar__action" type="button"></button>
</div>
<script src="third-party/mdl/material.min.js"></script>
<script src="scripts/cloud/OneDrive.js"></script>
<script src="scripts/cloud/Google.js"></script>
<script src="scripts/cloud/Dropbox.js"></script>
</body>
</html>