Update extension dependencies

filips123 · Jan 22, 2024 · 6a43d21 · 6a43d21
1 parent 78d66bd
commit 6a43d21
Show file tree

Hide file tree

Showing 14 changed files with 1,848 additions and 2,392 deletions.
diff --git a/extension/package.json b/extension/package.json
@@ -17,47 +17,46 @@
  ],
  "scripts": {
  "watch": "run-s prepare:* watch:*",
- "watch:parcel": "parcel watch src/manifest.json src/**/*.html src/images/**/*.svg --no-content-hash",
+ "watch:parcel": "parcel watch src/manifest.json src/{background,content}.js src/**/*.{html,svg} --no-content-hash",
  "build": "run-s prepare:* build:*",
- "build:parcel": "parcel build src/manifest.json src/**/*.html src/images/**/*.svg --no-content-hash --no-source-maps",
+ "build:parcel": "parcel build src/manifest.json src/{background,content}.js src/**/*.{html,svg} --no-content-hash --no-source-maps",
  "build:webext": "web-ext build -s dist -a dist -n firefoxpwa-{version}.zip",
  "lint": "run-s -c lint:*",
  "lint:eslint": "eslint src tools",
  "lint:webext": "web-ext lint -s src",
  "fix": "run-s -c fix:*",
  "fix:eslint": "eslint --fix src tools",
- "prepare:clean": "rimraf dist",
+ "prepare:clean": "rimraf dist .parcel-cache",
  "prepare:icons": "node ./tools/icons/generate.js",
  "set-version": "node ./tools/set-version.js"
  },
  "dependencies": {
- "@popperjs/core": "^2.11.6",
+ "@popperjs/core": "^2.11.8",
  "base64-js": "^1.5.1",
- "bootstrap": "~5.1.3",
- "bootstrap-dark-5": "^1.1.3",
- "bootstrap-icons": "^1.10.3",
- "bootstrap5-tags": "^1.5.1",
- "dompurify": "^3.0.6",
- "iframe-resizer": "^4.3.2",
- "semver": "^7.3.8"
+ "bootstrap": "^5.3.2",
+ "bootstrap-icons": "^1.11.3",
+ "bootstrap5-tags": "^1.6.15",
+ "dompurify": "^3.0.8",
+ "iframe-resizer": "^4.3.9",
+ "semver": "^7.5.4"
  },
  "devDependencies": {
- "@parcel/config-webextension": "~2.4.1",
- "@parcel/plugin": "^2.10.3",
- "@parcel/resolver-glob": "~2.4.1",
- "@parcel/transformer-raw": "^~2.4.1",
- "@parcel/transformer-sass": "~2.4.1",
- "eslint": "^8.36.0",
- "eslint-config-standard": "^17.0.0",
- "eslint-plugin-import": "^2.27.5",
- "eslint-plugin-n": "^15.6.1",
+ "@parcel/config-webextension": "^2.11.0",
+ "@parcel/plugin": "^2.11.0",
+ "@parcel/resolver-glob": "^2.11.0",
+ "@parcel/transformer-raw": "^2.11.0",
+ "@parcel/transformer-sass": "2.11.0",
+ "@twbs/fantasticon": "^2.7.2",
+ "eslint": "^8.56.0",
+ "eslint-config-standard": "^17.1.0",
+ "eslint-plugin-import": "^2.29.1",
+ "eslint-plugin-n": "^16.6.2",
  "eslint-plugin-promise": "^6.1.1",
  "eslint-plugin-simple-import-sort": "^10.0.0",
- "fantasticon": "^1.2.3",
  "npm-run-all": "^4.1.5",
- "parcel": "^2.10.3",
- "rimraf": "^4.4.1",
- "web-ext": "^7.6.0"
+ "parcel": "^2.11.0",
+ "rimraf": "^5.0.5",
+ "web-ext": "^7.10.0"
  },
  "icons": [
  "box-arrow-up-right",

diff --git a/extension/src/setup/install.html b/extension/src/setup/install.html
@@ -8,7 +8,7 @@
  <link rel="stylesheet" href="install.scss" />
  </head>
 
- <body class="bg-light">
+ <body class="bg-body-tertiary">
  <div class="container-fluid vh-100">
  <div class="row justify-content-center">
  <div class="wrapper my-4 px-4 py-0">
@@ -25,7 +25,7 @@ <h1 class="text-center" data-i18n="setupPageTitle"></h1>
 
  <!-- License Agreement -->
  <div id="license-agreement-view" class="px-3 d-none">
- <blockquote class="text-justify text-secondary">
+ <blockquote class="text-justify bg-body-tertiary border-start border-5 p-3">
  <p data-i18n="setupPageLicenseBase"></p>
  <hr />
  <p data-i18n="setupPageLicenseThirdPartyIncluded"></p>

diff --git a/extension/src/setup/install.scss b/extension/src/setup/install.scss
@@ -6,22 +6,23 @@
 @import "../icons/bootstrap-icons.css";
 
 //////////////////////////////
-// Setup Wizard
+// Progress Bar
 //////////////////////////////
 
 #progressbar {
  margin-top: 20px;
  margin-bottom: 30px;
  padding: 0;
  overflow: hidden;
- color: #6c757d;
+ color: #495057;
+ @media (prefers-color-scheme: dark) { color: #e1e1e1; }
 }
 
 #progressbar li {
  position: relative;
  float: left;
  width: 25%;
- list-style-type: none;
+ list-style: none;
  font-size: 12px;
 }
 
@@ -31,7 +32,6 @@
  height: 50px;
  line-height: 45px;
  font-size: 18px;
- background-color: #6c757d;
  color: white;
  border-radius: 50%;
  margin: 0 auto 10px auto;
@@ -45,43 +45,22 @@
  content: '';
  width: 100%;
  height: 2px;
- background-color: #6c757d;
  z-index: -1;
 }
 
+#progressbar li:before, #progressbar li:after {
+ background-color: #6c757d;
+}
+
 #progressbar li.active:before, #progressbar li.active:after {
  background-color: #0d6efd;
 }
 
 //////////////////////////////
-// Various Modifications
+// Text Utilities
 //////////////////////////////
 
 .text-justify {
  text-align: justify;
  text-justify: inter-word;
 }
-
-blockquote {
- background: #f9f9f9;
- border-left: 5px solid #ccc;
- padding: 0.5em 10px;
-}
-
-//////////////////////////////
-// Dark Theme Modifications
-//////////////////////////////
-
-@media (prefers-color-scheme: dark) {
- .bg-light, blockquote {
- background-color: #2f2f2f !important
- }
-
- blockquote {
- border-left: 5px solid #161616;
- }
-
- .text-secondary, #progressbar {
- color: #e1e1e1 !important;
- }
-}
diff --git a/extension/src/setup/instructions.scss b/extension/src/setup/instructions.scss
@@ -2,23 +2,12 @@
 // Bootstrap
 //////////////////////////////
 
-@import "/node_modules/bootstrap-dark-5/dist/css/bootstrap-dark.css";
+@import "../styles/bootstrap.css";
 
 //////////////////////////////
 // Various Modifications
 //////////////////////////////
 
-.text-justify {
- text-align: justify;
- text-justify: inter-word;
-}
-
-blockquote {
- background: #f9f9f9;
- border-left: 5px solid #ccc;
- padding: 0.5em 10px;
-}
-
 .nav-link {
  text-align: left;
  min-width: 13em;

diff --git a/extension/src/setup/setup.scss b/extension/src/setup/setup.scss
@@ -2,7 +2,7 @@
 // Bootstrap
 //////////////////////////////
 
-@import "/node_modules/bootstrap-dark-5/dist/css/bootstrap-dark.css";
+@import "../styles/bootstrap.css";
 
 //////////////////////////////
 // Content Card

diff --git a/extension/src/setup/update.html b/extension/src/setup/update.html
@@ -8,7 +8,7 @@
  <link rel="stylesheet" href="update.scss" />
  </head>
 
- <body class="bg-light">
+ <body class="bg-body-tertiary">
  <div class="container-fluid vh-100">
  <div class="row justify-content-center">
  <div class="wrapper my-4 px-4 py-0">

diff --git a/extension/src/setup/update.scss b/extension/src/setup/update.scss
@@ -3,13 +3,3 @@
 //////////////////////////////
 
 @import "setup.scss";
-
-//////////////////////////////
-// Dark Theme Modifications
-//////////////////////////////
-
-@media (prefers-color-scheme: dark) {
- .bg-light {
- background-color: #2f2f2f !important
- }
-}
diff --git a/extension/src/sites/manage.html b/extension/src/sites/manage.html
@@ -255,11 +255,12 @@
  <button type="button" class="col-1 btn-close my-auto tiny" id="extension-outdated-close" data-i18n data-i18n-aria-label="commonClose"></button>
  </div>
  <div class="card-footer px-2 mx-0 row" id="search-box">
+ <label for="search-input" class="form-label visually-hidden" data-i18n="managePageFooterSearchPlaceholder"></label>
  <input class="form-control" id="search-input" type="search" data-i18n data-i18n-placeholder="managePageFooterSearchPlaceholder" data-i18n-aria-label="managePageFooterSearchPlaceholder" />
  </div>
  </div>
 
- <div class="offcanvas offcanvas-start" tabindex="-1" id="site-edit-offcanvas" aria-labelledby="site-edit-label">
+ <div class="offcanvas offcanvas-start card-offcanvas" tabindex="-1" id="site-edit-offcanvas" aria-labelledby="site-edit-label">
  <div class="card-header card-offcanvas-header sticky-top">
  <span data-i18n="managePageAppListEdit"></span>
  <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" data-i18n data-i18n-aria-label="commonClose"></button>

diff --git a/extension/src/sites/manage.scss b/extension/src/sites/manage.scss
@@ -27,6 +27,15 @@ html, body {
  width: 100%;
 }
 
+.card-offcanvas {
+ --bs-card-cap-padding-y: .5rem;
+ --bs-card-cap-padding-x: 1rem;
+ --bs-card-cap-bg: rgba(var(--bs-body-color-rgb), .03);
+ --bs-card-border-width: var(--bs-border-width);
+ --bs-card-border-color: var(--bs-border-color-translucent);
+ --bs-card-border-radius: var(--bs-border-radius);
+}
+
 .card-offcanvas-header {
  display: flex;
  align-items: center;
@@ -42,6 +51,14 @@ html, body {
  padding: 1rem 1rem;
 }
 
+.tiny {
+ font-size: 0.7em;
+}
+
+//////////////////////////////
+// List Styles
+//////////////////////////////
+
 .list-group-flush > .list-group-item {
  padding: 0.5rem 0.75rem;
 }
@@ -60,11 +77,6 @@ html, body {
  border-top: none;
 }
 
-.site-icon {
- height: 32px;
- width: 32px;
-}
-
 .text-overflow-hide, .text-overflow-hide > * {
  width: 100%;
  white-space: nowrap;
@@ -73,9 +85,9 @@ html, body {
  line-height: 1.25rem;
 }
 
-.tiny {
- font-size: 0.7em;
-}
+//////////////////////////////
+// Search Styles
+//////////////////////////////
 
 #search-box {
  transition: visibility 0.18s linear, opacity 0.18s linear;
@@ -88,6 +100,15 @@ html, body {
  opacity: 0;
 }
 
+//////////////////////////////
+// Image Icon
+//////////////////////////////
+
+.site-icon {
+ height: 32px;
+ width: 32px;
+}
+
 //////////////////////////////
 // Letter Icon
 //////////////////////////////
@@ -111,31 +132,17 @@ html, body {
 }
 
 //////////////////////////////
-// Icon Link Tab
+// Navigation Colors
 //////////////////////////////
 
-.icon-link {
- color: #555d65 !important;
-}
-
-.icon-link:hover {
- color: #3e4449 !important;
-}
-
-.icon-link.active {
- color: #272a2d !important;
+#card-navigation {
+ --bs-nav-link-color: #555d65;
+ --bs-nav-link-hover-color: #3e4449;
 }
 
 @media (prefers-color-scheme: dark) {
- .icon-link {
- color: #989898 !important;
- }
-
- .icon-link:hover {
- color: #b1b1b1 !important;
- }
-
- .icon-link.active {
- color: #cbcbcb !important;
+ #card-navigation {
+ --bs-nav-link-color: #b9b9b9;
+ --bs-nav-link-hover-color: #b0b0b0;
  }
 }