browser-extension-settings 0.5.4 → 0.5.5

package/lib/common.ts

@@ -1,4 +1,4 @@
-export const besVersion = 51
+export const besVersion = 55
 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>`
 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>`
 export const settingButton = `<svg viewBox="0 0 16 16" version="1.1">

package/lib/style.scss

@@ -329,7 +329,7 @@
 
   /* https://uiverse.io/zanina-yassine/afraid-eel-50 */
   /* The switch - the box around the slider */
-  .container {
+  .bes_switch_container {
     --button-width: 51px;
     --button-height: 24px;
     --toggle-diameter: 20px;
@@ -352,7 +352,7 @@
     position: absolute;
   }
 
-  .switch {
+  .bes_switch {
     width: 100%;
     height: 100%;
     display: block;
@@ -363,12 +363,12 @@
     transition: all 0.2s ease-out;
   }
 
-  .switch::before {
+  .bes_switch::before {
     display: none;
   }
 
   /* The slider */
-  .slider {
+  .bes_slider {
     width: var(--toggle-diameter);
     height: var(--toggle-diameter);
     position: absolute;
@@ -383,11 +383,11 @@
     cursor: pointer;
   }
 
-  input[type="checkbox"]:checked + .switch {
+  input[type="checkbox"]:checked + .bes_switch {
     background-color: var(--color-on);
   }
 
-  input[type="checkbox"]:checked + .switch .slider {
+  input[type="checkbox"]:checked + .bes_switch .bes_slider {
     left: calc(var(--button-width) - var(--toggle-diameter) - 2px);
   }
 }

package/lib/switch.ts

@@ -10,14 +10,14 @@ type SwichOptions = {
 }
 
 export function createSwitch(options = {} as SwichOptions): HTMLElement {
-  const container = createElement("label", { class: "container" })
+  const container = createElement("label", { class: "bes_switch_container" })
   const checkbox = createElement(
     "input",
     options.checked ? { type: "checkbox", checked: "" } : { type: "checkbox" }
   )
   addElement(container, checkbox)
-  const switchElm = createElement("span", { class: "switch" })
-  addElement(switchElm, "span", { class: "slider" })
+  const switchElm = createElement("span", { class: "bes_switch" })
+  addElement(switchElm, "span", { class: "bes_slider" })
   addElement(container, switchElm)
   if (options.onchange) {
     addEventListener(checkbox, "change", options.onchange)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "browser-extension-settings",
-  "version": "0.5.4",
+  "version": "0.5.5",
   "description": "Settings module for developing browser extensions and userscripts",
   "type": "module",
   "main": "./lib/index.ts",