browser-extension-settings 0.5.3 → 0.5.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/lib/common.ts +1 -1
  2. package/lib/extension-list.ts +2 -2
  3. package/lib/messages/en.ts +2 -0
  4. package/lib/messages/zh-cn.ts +2 -0
  5. package/lib/settings.ts +16 -1
  6. package/lib/style.scss +54 -43
  7. package/package.json +1 -1
package/lib/common.ts CHANGED
@@ -1,4 +1,4 @@
1
- export const besVersion = 50
1
+ export const besVersion = 51
2
2
  export const openButton = `<svg viewBox="0 0 60.2601318359375 84.8134765625" version="1.1" xmlns="http://www.w3.org/2000/svg" class=" glyph-box" style="height: 9.62969px; width: 6.84191px;"><g transform="matrix(1 0 0 1 -6.194965820312518 77.63671875)"><path d="M66.4551-35.2539C66.4551-36.4746 65.9668-37.5977 65.0391-38.4766L26.3672-76.3672C25.4883-77.1973 24.4141-77.6367 23.1445-77.6367C20.6543-77.6367 18.7012-75.7324 18.7012-73.1934C18.7012-71.9727 19.1895-70.8496 19.9707-70.0195L55.5176-35.2539L19.9707-0.488281C19.1895 0.341797 18.7012 1.41602 18.7012 2.68555C18.7012 5.22461 20.6543 7.12891 23.1445 7.12891C24.4141 7.12891 25.4883 6.68945 26.3672 5.81055L65.0391-32.0312C65.9668-32.959 66.4551-34.0332 66.4551-35.2539Z"></path></g></svg>`
3
3
  export const openInNewTabButton = `<svg viewBox="0 0 72.127685546875 72.2177734375" version="1.1" xmlns="http://www.w3.org/2000/svg" class=" glyph-box" style="height: 8.19958px; width: 8.18935px;"><g transform="matrix(1 0 0 1 -12.451127929687573 71.3388671875)"><path d="M84.5703-17.334L84.5215-66.4551C84.5215-69.2383 82.7148-71.1914 79.7852-71.1914L30.6641-71.1914C27.9297-71.1914 26.0742-69.0918 26.0742-66.748C26.0742-64.4043 28.1738-62.4023 30.4688-62.4023L47.4609-62.4023L71.2891-63.1836L62.207-55.2246L13.8184-6.73828C12.9395-5.85938 12.4512-4.73633 12.4512-3.66211C12.4512-1.31836 14.5508 0.878906 16.9922 0.878906C18.1152 0.878906 19.1895 0.488281 20.0684-0.439453L68.5547-48.877L76.6113-58.0078L75.7324-35.2051L75.7324-17.1387C75.7324-14.8438 77.7344-12.6953 80.127-12.6953C82.4707-12.6953 84.5703-14.6973 84.5703-17.334Z"></path></g></svg>`
4
4
  export const settingButton = `<svg viewBox="0 0 16 16" version="1.1">
package/lib/extension-list.ts CHANGED
@@ -205,7 +205,7 @@ export function createExtensionList(installedExtensions: InstalledExtension[]) {
205
205
  class: "extension_list_container thin_scrollbar",
206
206
  })
207
207
 
208
- addElement(div, "h1", { textContent: "Settings" })
208
+ addElement(div, "h1", { textContent: i("settings.title") })
209
209
 
210
210
  const div2 = addElement(div, "div", {
211
211
  class: "installed_extension_list",
@@ -221,7 +221,7 @@ export function createExtensionList(installedExtensions: InstalledExtension[]) {
221
221
  div2.append(element)
222
222
  }
223
223
 
224
- addElement(div, "h2", { textContent: "Other Extensions" })
224
+ addElement(div, "h2", { textContent: i("settings.otherExtensions") })
225
225
  const div3 = addElement(div, "div", {
226
226
  class: "related_extension_list",
227
227
  })
package/lib/messages/en.ts CHANGED
@@ -1,4 +1,6 @@
1
1
  const messages = {
2
+ "settings.title": "Settings",
3
+ "settings.otherExtensions": "Other Extensions",
2
4
  "settings.displaySettingsButtonInSideMenu": "Display Settings Button in Side Menu",
3
5
  "settings.menu.settings": "⚙️ Settings",
4
6
  "settings.extensions.utags.title": "🏷️ UTags - Add usertags to links",
package/lib/messages/zh-cn.ts CHANGED
@@ -1,4 +1,6 @@
1
1
  export const messages = {
2
+ "settings.title": "设置",
3
+ "settings.otherExtensions": "其他扩展",
2
4
  "settings.displaySettingsButtonInSideMenu": "在侧边栏菜单中显示设置按钮",
3
5
  "settings.menu.settings": "⚙️ 设置",
4
6
  "settings.extensions.utags.title": "🏷️ 小鱼标签 (UTags) - 为链接添加用户标签",
package/lib/settings.ts CHANGED
@@ -55,6 +55,7 @@ type SettingsSwitchItem = {
55
55
  icon?: string
56
56
  defaultValue: boolean
57
57
  type?: "switch"
58
+ onConfirmChange?: (checked: boolean) => boolean
58
59
  group?: number
59
60
  }
60
61
 
@@ -359,7 +360,21 @@ function createSettingsElement() {
359
360
  async onchange(event: Event) {
360
361
  const checkbox = event.target as HTMLInputElement
361
362
  if (checkbox) {
362
- await saveSettingsValue(key, checkbox.checked)
363
+ let result = true
364
+ if (
365
+ typeof (item as SettingsSwitchItem).onConfirmChange ===
366
+ "function"
367
+ ) {
368
+ result = (item as SettingsSwitchItem).onConfirmChange!(
369
+ checkbox.checked
370
+ )
371
+ }
372
+
373
+ if (result) {
374
+ await saveSettingsValue(key, checkbox.checked)
375
+ } else {
376
+ checkbox.checked = !checkbox.checked
377
+ }
363
378
  }
364
379
  },
365
380
  })
package/lib/style.scss CHANGED
@@ -5,6 +5,7 @@
5
5
  --sb-track-color: #00000000;
6
6
  --sb-thumb-color: #33334480;
7
7
  --sb-size: 2px;
8
+ --font-family: "helvetica neue", "microsoft yahei", arial, sans-serif;
8
9
 
9
10
  position: fixed;
10
11
  top: 10px;
@@ -25,23 +26,66 @@
25
26
  height: 100%;
26
27
  overflow: hidden;
27
28
  background-color: var(--browser-extension-settings-background-color);
29
+ font-family: var(--font-family);
30
+
31
+ h1,
32
+ h2 {
33
+ border: none;
34
+ color: var(--browser-extension-settings-text-color);
35
+ padding: 0;
36
+ font-family: var(--font-family);
37
+ line-height: normal;
38
+ letter-spacing: normal;
39
+ }
28
40
 
29
41
  h1 {
30
42
  font-size: 26px;
31
43
  font-weight: 800;
32
- border: none;
33
- color: var(--browser-extension-settings-text-color);
34
44
  margin: 18px 0;
35
- padding: 0;
36
45
  }
37
46
 
38
47
  h2 {
39
48
  font-size: 18px;
40
49
  font-weight: 600;
41
- border: none;
42
- color: var(--browser-extension-settings-text-color);
43
50
  margin: 14px 0;
44
- padding: 0;
51
+ }
52
+
53
+ footer {
54
+ display: flex;
55
+ justify-content: center;
56
+ flex-direction: column;
57
+ font-size: 11px;
58
+ margin: 10px auto 0px;
59
+ background-color: var(--browser-extension-settings-background-color);
60
+ color: var(--browser-extension-settings-text-color);
61
+ font-family: var(--font-family);
62
+
63
+ a {
64
+ color: var(--browser-extension-settings-link-color) !important;
65
+ font-family: var(--font-family);
66
+ text-decoration: none;
67
+ padding: 0;
68
+ }
69
+
70
+ p {
71
+ text-align: center;
72
+ padding: 0;
73
+ margin: 2px;
74
+ line-height: 13px;
75
+ font-size: 11px;
76
+ color: var(--browser-extension-settings-text-color);
77
+ font-family: var(--font-family);
78
+ }
79
+ }
80
+
81
+ a.navigation_go_previous {
82
+ color: var(--browser-extension-settings-link-color);
83
+ cursor: pointer;
84
+ display: none;
85
+
86
+ &::before {
87
+ content: "< ";
88
+ }
45
89
  }
46
90
 
47
91
  .extension_list_container {
@@ -67,6 +111,7 @@
67
111
  cursor: pointer;
68
112
  text-decoration: none;
69
113
  color: var(--browser-extension-settings-text-color);
114
+ font-family: var(--font-family);
70
115
 
71
116
  &:hover {
72
117
  text-decoration: none;
@@ -76,6 +121,7 @@
76
121
  span {
77
122
  margin-right: 10px;
78
123
  line-height: 24px;
124
+ font-family: var(--font-family);
79
125
  }
80
126
  }
81
127
 
@@ -133,47 +179,11 @@
133
179
  padding: 10px 15px;
134
180
  background-color: var(--browser-extension-settings-background-color);
135
181
  color: var(--browser-extension-settings-text-color);
182
+ font-family: var(--font-family);
136
183
 
137
184
  h2 {
138
185
  text-align: center;
139
186
  margin: 5px 0 0;
140
- font-size: 18px;
141
- font-weight: 600;
142
- border: none;
143
- color: var(--browser-extension-settings-text-color);
144
- }
145
-
146
- footer {
147
- display: flex;
148
- justify-content: center;
149
- flex-direction: column;
150
- font-size: 11px;
151
- margin: 10px auto 0px;
152
- background-color: var(--browser-extension-settings-background-color);
153
- color: var(--browser-extension-settings-text-color);
154
- }
155
-
156
- footer a {
157
- color: var(--browser-extension-settings-link-color) !important;
158
- text-decoration: none;
159
- padding: 0;
160
- }
161
-
162
- footer p {
163
- text-align: center;
164
- padding: 0;
165
- margin: 2px;
166
- line-height: 13px;
167
- }
168
-
169
- a.navigation_go_previous {
170
- color: var(--browser-extension-settings-link-color);
171
- cursor: pointer;
172
- display: none;
173
-
174
- &::before {
175
- content: "< ";
176
- }
177
187
  }
178
188
 
179
189
  .option_groups {
@@ -200,6 +210,7 @@
200
210
  a:visited,
201
211
  a:hover {
202
212
  color: var(--browser-extension-settings-link-color);
213
+ font-family: var(--font-family);
203
214
  text-decoration: none;
204
215
  cursor: pointer;
205
216
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "browser-extension-settings",
3
- "version": "0.5.3",
3
+ "version": "0.5.4",
4
4
  "description": "Settings module for developing browser extensions and userscripts",
5
5
  "type": "module",
6
6
  "main": "./lib/index.ts",