Merge pull request #83 from BetterSEQTA/vite-dev
Change build tool to parcel
@@ -10,5 +10,22 @@
|
||||
"ecmaVersion": "latest",
|
||||
"sourceType": "module" // add this line to allow 'import' and 'export' statements
|
||||
},
|
||||
"rules": {}
|
||||
"rules": {
|
||||
// allow importing ts extensions
|
||||
"sort-imports": ["error", {
|
||||
"ignoreCase": true,
|
||||
"ignoreDeclarationSort": true,
|
||||
"ignoreMemberSort": false,
|
||||
"memberSyntaxSortOrder": ["none", "all", "multiple", "single"]
|
||||
}],
|
||||
"import/extensions": [
|
||||
"error",
|
||||
"ignorePackages",
|
||||
{
|
||||
"js": "never",
|
||||
"ts": "never",
|
||||
"tsx": "never"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
name: NodeJS with Webpack
|
||||
name: NodeJS Testing
|
||||
|
||||
on:
|
||||
push:
|
||||
@@ -12,7 +12,7 @@ jobs:
|
||||
|
||||
strategy:
|
||||
matrix:
|
||||
node-version: [14.x, 16.x, 18.x]
|
||||
node-version: [20.x]
|
||||
|
||||
steps:
|
||||
- uses: actions/checkout@v3
|
||||
@@ -24,9 +24,5 @@ jobs:
|
||||
|
||||
- name: Build
|
||||
run: |
|
||||
cd interface
|
||||
npm install
|
||||
npm run build
|
||||
cd ..
|
||||
npm install
|
||||
npm run build
|
||||
@@ -2,6 +2,10 @@
|
||||
node_modules/
|
||||
package-lock.json
|
||||
bun.lockb
|
||||
pnpm-lock.yaml
|
||||
yarn.lock
|
||||
|
||||
.parcel-cache
|
||||
|
||||
# Build
|
||||
package.zip
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"plugins": {
|
||||
"tailwindcss": {}
|
||||
}
|
||||
}
|
||||
@@ -1,4 +1,5 @@
|
||||
{
|
||||
"tabWidth": 2,
|
||||
"useTabs": false
|
||||
"useTabs": false,
|
||||
"semi": false
|
||||
}
|
||||
|
||||
@@ -0,0 +1,37 @@
|
||||
{
|
||||
"manifest_version": 2,
|
||||
"name": "BetterSEQTA+",
|
||||
"version": "3.2.2",
|
||||
"description": "Make SEQTA usable and beautiful! A fork of BetterSEQTA to continue development and add WAY more features!!!",
|
||||
"icons": {
|
||||
"32": "../src/resources/icons/icon-32.png",
|
||||
"48": "../src/resources/icons/icon-48.png",
|
||||
"64": "../src/resources/icons/icon-64.png"
|
||||
},
|
||||
"browser_action": {
|
||||
"browser_style": true,
|
||||
"default_popup": "../src/interface/index.html#settings",
|
||||
"default_icon": {
|
||||
"32": "../src/resources/icons/icon-32.png",
|
||||
"48": "../src/resources/icons/icon-48.png",
|
||||
"64": "../src/resources/icons/icon-64.png"
|
||||
}
|
||||
},
|
||||
"permissions": ["tabs", "notifications", "storage", "https://newsapi.org/"],
|
||||
"background": {
|
||||
"scripts": [
|
||||
"../src/background.ts"
|
||||
]
|
||||
},
|
||||
"content_scripts": [
|
||||
{
|
||||
"matches": ["*://*/*"],
|
||||
"js": ["../src/SEQTA.ts"],
|
||||
"run_at": "document_start"
|
||||
}
|
||||
],
|
||||
"web_accessible_resources": [
|
||||
"../src/*",
|
||||
"../public/*"
|
||||
]
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: { browser: true, es2020: true },
|
||||
extends: [
|
||||
'eslint:recommended',
|
||||
'plugin:@typescript-eslint/recommended',
|
||||
'plugin:react-hooks/recommended',
|
||||
],
|
||||
ignorePatterns: ['dist', '.eslintrc.cjs'],
|
||||
parser: '@typescript-eslint/parser',
|
||||
plugins: ['react-refresh'],
|
||||
rules: {
|
||||
'react-refresh/only-export-components': [
|
||||
'warn',
|
||||
{ allowConstantExport: true },
|
||||
],
|
||||
},
|
||||
overrides: [
|
||||
{
|
||||
files: ['*.ts', '*.tsx'],
|
||||
rules: {
|
||||
'@typescript-eslint/no-explicit-any': 'off',
|
||||
},
|
||||
},
|
||||
],
|
||||
}
|
||||
@@ -1,9 +0,0 @@
|
||||
|
||||
# Sentry Config File
|
||||
.env.sentry-build-plugin
|
||||
|
||||
# Sentry Config File
|
||||
.env.sentry-build-plugin
|
||||
|
||||
# Sentry Config File
|
||||
.env.sentry-build-plugin
|
||||
@@ -1,40 +0,0 @@
|
||||
{
|
||||
"name": "popup",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite build --watch",
|
||||
"build": "tsc && vite build",
|
||||
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@sentry/react": "^7.85.0",
|
||||
"@sentry/vite-plugin": "^2.10.2",
|
||||
"@types/chrome": "^0.0.246",
|
||||
"@types/webextension-polyfill": "^0.10.7",
|
||||
"framer-motion": "^10.16.4",
|
||||
"react": "^18.2.0",
|
||||
"react-best-gradient-color-picker": "2.2.24",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-router-dom": "latest",
|
||||
"tinycolor2": "^1.6.0",
|
||||
"webextension-polyfill": "^0.10.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^18.2.15",
|
||||
"@types/react-dom": "^18.2.7",
|
||||
"@typescript-eslint/eslint-plugin": "^6.0.0",
|
||||
"@typescript-eslint/parser": "^6.0.0",
|
||||
"@vitejs/plugin-react": "^4.0.3",
|
||||
"autoprefixer": "^10.4.15",
|
||||
"eslint": "^8.45.0",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.3",
|
||||
"postcss": "^8.4.29",
|
||||
"tailwindcss": "^3.3.3",
|
||||
"typescript": "^5.0.2",
|
||||
"vite": "^4.4.5"
|
||||
}
|
||||
}
|
||||
@@ -1,9 +0,0 @@
|
||||
import tailwindcss from "tailwindcss";
|
||||
import autoprefixer from "autoprefixer";
|
||||
|
||||
export default {
|
||||
plugins: [
|
||||
tailwindcss,
|
||||
autoprefixer,
|
||||
],
|
||||
};
|
||||
@@ -1,37 +0,0 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: [
|
||||
"./index.html",
|
||||
"./src/**/*.{js,ts,jsx,tsx}",
|
||||
],
|
||||
darkMode: "class",
|
||||
theme: {
|
||||
fontSize: {
|
||||
"xs": ".65rem",
|
||||
"sm": ".775rem",
|
||||
"base": "0.65rem",
|
||||
"md": "0.65rem",
|
||||
"lg": "1rem",
|
||||
"xl": "1.25rem",
|
||||
"2xl": "1.5rem",
|
||||
"3xl": "1.875rem",
|
||||
"4xl": "2.25rem",
|
||||
"5xl": "3rem",
|
||||
"6xl": "4rem",
|
||||
"7xl": "5rem",
|
||||
"8xl": "6rem",
|
||||
"9xl": "8rem",
|
||||
"10xl": "10rem",
|
||||
"11xl": "12rem",
|
||||
"12xl": "14rem",
|
||||
"13xl": "16rem",
|
||||
"14xl": "18rem",
|
||||
},
|
||||
extend: {
|
||||
fontFamily: {
|
||||
"IconFamily": "IconFamily"
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [],
|
||||
};
|
||||
@@ -1,24 +0,0 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2020",
|
||||
"useDefineForClassFields": true,
|
||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||
"module": "ESNext",
|
||||
"skipLibCheck": true,
|
||||
|
||||
/* Bundler mode */
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx",
|
||||
|
||||
/* Linting */
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noFallthroughCasesInSwitch": true
|
||||
},
|
||||
"include": ["src"]
|
||||
}
|
||||
@@ -1,2 +0,0 @@
|
||||
declare const _default: import("vite").UserConfig;
|
||||
export default _default;
|
||||
@@ -1,23 +0,0 @@
|
||||
import { sentryVitePlugin } from "@sentry/vite-plugin";
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [react(), sentryVitePlugin({
|
||||
org: "betterseqta-plus",
|
||||
project: "betterseqtaplus-popup"
|
||||
})],
|
||||
build: {
|
||||
//outDir: '../../public/popup-dist',
|
||||
rollupOptions: {
|
||||
output: {
|
||||
assetFileNames: 'client/rsc/[ext]/[name][extname]',
|
||||
chunkFileNames: 'client/rsc/[chunks]/[name].[hash].js',
|
||||
entryFileNames: 'client/public/client.js'
|
||||
}
|
||||
},
|
||||
|
||||
sourcemap: true
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,42 @@
|
||||
{
|
||||
"manifest_version": 3,
|
||||
"name": "BetterSEQTA+",
|
||||
"version": "3.2.2",
|
||||
"description": "Make SEQTA usable and beautiful! A fork of BetterSEQTA to continue development and add WAY more features!!!",
|
||||
"icons": {
|
||||
"32": "src/resources/icons/icon-32.png",
|
||||
"48": "src/resources/icons/icon-48.png",
|
||||
"64": "src/resources/icons/icon-64.png"
|
||||
},
|
||||
"action": {
|
||||
"browser_style": true,
|
||||
"default_popup": "src/interface/index.html#settings",
|
||||
"default_icon": {
|
||||
"32": "src/resources/icons/icon-32.png",
|
||||
"48": "src/resources/icons/icon-48.png",
|
||||
"64": "src/resources/icons/icon-64.png"
|
||||
}
|
||||
},
|
||||
"permissions": ["tabs", "notifications", "storage"],
|
||||
"host_permissions": ["https://newsapi.org/", "*://*/*"],
|
||||
"background": {
|
||||
"service_worker": "src/background.ts",
|
||||
"type": "module"
|
||||
},
|
||||
"content_scripts": [
|
||||
{
|
||||
"matches": ["*://*/*"],
|
||||
"js": ["src/SEQTA.ts"],
|
||||
"run_at": "document_start"
|
||||
}
|
||||
],
|
||||
"web_accessible_resources": [
|
||||
{
|
||||
"resources": [
|
||||
"public/*",
|
||||
"src/*"
|
||||
],
|
||||
"matches": ["*://*/*"]
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -3,51 +3,72 @@
|
||||
"version": "3.2.2",
|
||||
"type": "module",
|
||||
"description": "BetterSEQTA+ is a browser extension that adds features to SEQTA.",
|
||||
"main": "webpack.config.js",
|
||||
"scripts": {
|
||||
"build": "webpack --config webpack.config.js --mode production && sh ./package.sh",
|
||||
"dev": "webpack --config webpack.config.js --watch --mode development",
|
||||
"eslint": "eslint --fix ."
|
||||
"dev": "parcel watch manifest.json --host localhost --config @parcel/config-webextension --no-hmr --no-content-hash",
|
||||
"build": "parcel build manifest.json --config @parcel/config-webextension --no-content-hash --no-cache",
|
||||
"dev-firefox": "parcel watch firefox/manifest.json --host localhost --config @parcel/config-webextension --no-hmr --no-content-hash",
|
||||
"build-firefox": "parcel build firefox/manifest.json --config @parcel/config-webextension --no-content-hash --no-cache",
|
||||
"eslint": "eslint --fix .",
|
||||
"package": "7z a -tzip extension.zip ./build/*"
|
||||
},
|
||||
"keywords": [],
|
||||
"author": "",
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"copy-webpack-plugin": "^11.0.0",
|
||||
"css-loader": "^6.8.1",
|
||||
"dompurify": "^3.0.5",
|
||||
"@parcel/config-webextension": "^2.11.0",
|
||||
"@parcel/optimizer-data-url": "^2.11.0",
|
||||
"@parcel/transformer-inline-string": "^2.11.0",
|
||||
"@parcel/transformer-sass": "2.11.0",
|
||||
"assert": "^2.0.0",
|
||||
"browserify-zlib": "^0.2.0",
|
||||
"crypto-browserify": "^3.12.0",
|
||||
"eslint": "^8.48.0",
|
||||
"eslint-config-prettier": "^9.0.0",
|
||||
"eslint-webpack-plugin": "^4.0.1",
|
||||
"file-loader": "^6.2.0",
|
||||
"mini-css-extract-plugin": "^2.7.6",
|
||||
"prettier": "3.0.2",
|
||||
"https-browserify": "^1.0.0",
|
||||
"os-browserify": "^0.3.0",
|
||||
"parcel": "^2.10.3",
|
||||
"path-browserify": "^1.0.0",
|
||||
"prettier": "^3.2.2",
|
||||
"process": "^0.11.10",
|
||||
"querystring-es3": "^0.2.1",
|
||||
"sass": "^1.69.5",
|
||||
"sass-loader": "^13.3.2",
|
||||
"stream-browserify": "^3.0.0",
|
||||
"stream-http": "^3.1.0",
|
||||
"style-loader": "^3.3.3",
|
||||
"webextension-polyfill": "^0.10.0",
|
||||
"webpack": "^5.88.2",
|
||||
"webpack-cli": "^5.1.4"
|
||||
"tty-browserify": "^0.0.1",
|
||||
"url": "^0.11.0",
|
||||
"util": "^0.12.3",
|
||||
"yarn": "^1.22.21"
|
||||
},
|
||||
"dependencies": {
|
||||
"@sentry/browser": "^7.85.0",
|
||||
"@sentry/react": "^7.88.0",
|
||||
"@sentry/webpack-plugin": "^2.10.2",
|
||||
"@types/color": "^3.0.4",
|
||||
"@types/dompurify": "^3.0.5",
|
||||
"@types/react": "^18.2.21",
|
||||
"@types/react-dom": "^18.2.18",
|
||||
"@types/sortablejs": "^1.15.7",
|
||||
"@types/webextension-polyfill": "^0.10.7",
|
||||
"autoprefixer": "^10.4.15",
|
||||
"color": "^4.2.3",
|
||||
"dompurify": "^3.0.8",
|
||||
"framer-motion": "^10.16.16",
|
||||
"install": "^0.13.0",
|
||||
"localforage": "^1.10.0",
|
||||
"motion": "^10.16.4",
|
||||
"npm": "^10.1.0",
|
||||
"postcss": "^8.4.29",
|
||||
"react": "^18.2.0",
|
||||
"react-best-gradient-color-picker": "^2.3.5",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-router-dom": "^6.21.0",
|
||||
"sortablejs": "^1.15.0",
|
||||
"tailwindcss": "^3.3.3",
|
||||
"ts-loader": "^9.5.1",
|
||||
"typescript": "^5.2.2"
|
||||
"typescript": "^5.2.2",
|
||||
"webextension-polyfill": "^0.10.0"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +0,0 @@
|
||||
module.exports = {
|
||||
plugins: [
|
||||
require("tailwindcss"),
|
||||
require("autoprefixer"),
|
||||
],
|
||||
};
|
||||
@@ -1,14 +0,0 @@
|
||||
.hide {
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.outside-container {
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 80px;
|
||||
height: 590px;
|
||||
z-index: 20;
|
||||
}
|
||||
@@ -1,78 +0,0 @@
|
||||
{
|
||||
"manifest_version": 3,
|
||||
"name": "BetterSEQTA+",
|
||||
"version": "3.2.2",
|
||||
"description": "Make SEQTA usable and beautiful! A fork of BetterSEQTA to continue development and add WAY more features!!!",
|
||||
"icons": {
|
||||
"32": "icons/icon-32.png",
|
||||
"48": "icons/icon-48.png",
|
||||
"64": "icons/icon-64.png"
|
||||
},
|
||||
"action": {
|
||||
"browser_style": true,
|
||||
"default_popup": "interface/index.html#settings",
|
||||
"default_icon": {
|
||||
"32": "icons/icon-32.png",
|
||||
"48": "icons/icon-48.png",
|
||||
"64": "icons/icon-64.png"
|
||||
}
|
||||
},
|
||||
"permissions": ["tabs", "notifications", "storage"],
|
||||
"host_permissions": ["https://newsapi.org/", "*://*/*"],
|
||||
"background": {
|
||||
"service_worker": "background.js"
|
||||
},
|
||||
"content_scripts": [
|
||||
{
|
||||
"matches": ["*://*/*"],
|
||||
"js": ["browser-polyfill.js", "purify.min.js", "SEQTA.js"],
|
||||
"run_at": "document_start"
|
||||
}
|
||||
],
|
||||
"web_accessible_resources": [
|
||||
{
|
||||
"resources": ["icons/*"],
|
||||
"matches": ["*://*/*"]
|
||||
},
|
||||
{
|
||||
"resources": ["fonts/*"],
|
||||
"matches": ["*://*/*"]
|
||||
},
|
||||
{
|
||||
"resources": ["images/*"],
|
||||
"matches": ["*://*/*"]
|
||||
},
|
||||
{
|
||||
"resources": ["css/*"],
|
||||
"matches": ["*://*/*"]
|
||||
},
|
||||
{
|
||||
"resources": ["popup/*"],
|
||||
"matches": ["*://*/*"]
|
||||
},
|
||||
{
|
||||
"resources": ["client.js"],
|
||||
"matches": ["*://*/*"]
|
||||
},
|
||||
{
|
||||
"resources": ["index.css"],
|
||||
"matches": ["*://*/*"]
|
||||
},
|
||||
{
|
||||
"resources": ["interface/*"],
|
||||
"matches": ["*://*/*"]
|
||||
},
|
||||
{
|
||||
"resources": ["client/*"],
|
||||
"matches": ["*://*/*"]
|
||||
},
|
||||
{
|
||||
"resources": ["resources/*"],
|
||||
"matches": ["*://*/*"]
|
||||
},
|
||||
{
|
||||
"resources": ["backgrounds/*"],
|
||||
"matches": ["*://*/*"]
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -1,4 +1,5 @@
|
||||
import * as Sentry from "@sentry/browser";
|
||||
import browser from 'webextension-polyfill'
|
||||
|
||||
browser.storage.local.get([ "telemetry" ]).then((telemetry) => {
|
||||
if (telemetry.telemetry === true) {
|
||||
@@ -20,7 +21,6 @@ browser.storage.local.get([ "telemetry" ]).then((telemetry) => {
|
||||
}
|
||||
})
|
||||
|
||||
import browser from 'webextension-polyfill'
|
||||
import { onError } from './seqta/utils/onError';
|
||||
export const openDB = () => {
|
||||
return new Promise((resolve, reject) => {
|
||||
|
||||
@@ -1 +0,0 @@
|
||||
import './iframe.scss';
|
||||
@@ -15,7 +15,14 @@
|
||||
* along with EvenBetterSEQTA. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
html, p, div, span {
|
||||
body {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.dark {
|
||||
p,
|
||||
div,
|
||||
span {
|
||||
color: white !important;
|
||||
text-shadow: 1px 1px 2px #161616, 0 0 1em #161616;
|
||||
}
|
||||
@@ -26,15 +33,28 @@ body {
|
||||
|
||||
blockquote.forward > .preamble {
|
||||
color: rgba(255, 255, 255, 0.7) !important;
|
||||
|
||||
> p,
|
||||
div,
|
||||
span {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
blockquote.forward > .preamble > .date > .value, blockquote.forward > .preamble > .sender > .value {
|
||||
> .date > .value,
|
||||
blockquote.forward > .preamble > .sender > .value {
|
||||
color: rgba(255, 255, 255, 0.7) !important;
|
||||
}
|
||||
|
||||
blockquote.forward > .preamble > .date > .label, blockquote.forward > .preamble > .sender > .label {
|
||||
> .date > .label,
|
||||
blockquote.forward > .preamble > .sender > .label {
|
||||
color: rgba(255, 255, 255, 0.7) !important;
|
||||
}
|
||||
}
|
||||
|
||||
[bgcolor="#ffffff"] > * {
|
||||
color: black !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
table th {
|
||||
background-color: #161616;
|
||||
@@ -67,13 +87,6 @@ table th {
|
||||
border-top-right-radius: 1rem;
|
||||
}
|
||||
|
||||
html, p, div, span {
|
||||
color: white !important;
|
||||
background-color: #232323;
|
||||
}
|
||||
body {
|
||||
background-color: #232323;
|
||||
}
|
||||
blockquote.forward > .preamble {
|
||||
color: rgba(255, 255, 255, 0.7) !important;
|
||||
}
|
||||
@@ -97,3 +110,4 @@ blockquote.forward > .preamble > .sender > .label {
|
||||
text-decoration: underline;
|
||||
transition: text-shadow 0.5s;
|
||||
}
|
||||
}
|
||||
@@ -1,16 +1,19 @@
|
||||
@charset "UTF-8";
|
||||
@import url("https://fonts.googleapis.com/css?family=Rubik:300,400,500,600");
|
||||
@import url('https://fonts.googleapis.com/css?family=Rubik:300,400,500,600');
|
||||
|
||||
@import "./injected/popup.scss";
|
||||
@import "./injected/sidebar-animation.scss";
|
||||
@import "./injected/theme.scss";
|
||||
@import "./injected/transparency.scss";
|
||||
@import './injected/popup.scss';
|
||||
@import './injected/sidebar-animation.scss';
|
||||
@import './injected/theme.scss';
|
||||
@import './injected/transparency.scss';
|
||||
|
||||
:root {
|
||||
background: var(--better-main) !important;
|
||||
--navy: #1a1a1a !important;
|
||||
--auto-background: var(--better-pale, var(--background-secondary)) !important;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
body,
|
||||
html {
|
||||
font-family: Rubik, sans-serif !important;
|
||||
@@ -167,9 +170,6 @@ ul.magicDelete > li.deleting {
|
||||
background: transparent !important;
|
||||
color: var(--text-color) !important;
|
||||
}
|
||||
.tooltip {
|
||||
z-index: 5 !important;
|
||||
}
|
||||
|
||||
#menu li,
|
||||
#menu section {
|
||||
@@ -200,6 +200,7 @@ ul.magicDelete > li.deleting {
|
||||
}
|
||||
#menu {
|
||||
width: 270px;
|
||||
z-index: 19;
|
||||
background: var(--better-main) !important;
|
||||
color: var(--text-color);
|
||||
border-right: none;
|
||||
@@ -321,7 +322,7 @@ ol:has(.MessageList__avatar___2wxyb svg) {
|
||||
box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.2) !important;
|
||||
}
|
||||
|
||||
[style="--better-sub: #161616; --better-alert-highlight: #c61851; --background-primary: #ffffff; --background-secondary: #e5e7eb; --text-primary: black; --text-color: white; --betterseqta-logo: url(chrome-extension://boikofabjaholheekefimfojfncpjfib/icons/betterseqta-light-full.png); --better-main: #1a1a1a; --better-light: #333333;"] .menuShown > :last-child
|
||||
[style="--better-sub: #161616; --better-alert-highlight: #c61851; --background-primary: #ffffff; --background-secondary: #e5e7eb; --text-primary: black; --text-color: white; --better-main: #1a1a1a; --better-light: #333333;"] .menuShown > :last-child
|
||||
{
|
||||
top: 18% !important;
|
||||
}
|
||||
@@ -534,6 +535,7 @@ div > ol:has(.uiFileHandlerWrapper) {
|
||||
height: 69.5px;
|
||||
box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.assessmentsWrapper .message {
|
||||
display: none;
|
||||
}
|
||||
@@ -681,6 +683,7 @@ div > ol:has(.uiFileHandlerWrapper) {
|
||||
left: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#title::before {
|
||||
background-image: var(--betterseqta-logo);
|
||||
background-position: left;
|
||||
@@ -1674,7 +1677,7 @@ li.MessageList__unread___3imtO {
|
||||
content: "";
|
||||
width: 14px;
|
||||
height: 12px;
|
||||
background-image: url("../../public/icons/betterseqta-light-outline.png");
|
||||
background-image: url("../resources/icons/betterseqta-light-outline.png");
|
||||
display: inline-block;
|
||||
background-size: 18px 18px;
|
||||
color: #fff;
|
||||
@@ -2528,6 +2531,8 @@ li.MessageList__unread___3imtO {
|
||||
}
|
||||
.tooltip {
|
||||
display: inline-block;
|
||||
background: transparent;
|
||||
z-index: 5 !important;
|
||||
width: 28px;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
declare module '*.mp4';
|
||||
declare module '*.woff';
|
||||
declare module '*.scss';
|
||||
declare module '*.png';
|
||||
declare module '*.html';
|
||||
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 4.0 KiB After Width: | Height: | Size: 4.0 KiB |
|
Before Width: | Height: | Size: 591 KiB After Width: | Height: | Size: 591 KiB |
@@ -11,7 +11,7 @@ export default function Switch(props: SwitchProps) {
|
||||
return (
|
||||
<div
|
||||
className="flex w-14 p-1 cursor-pointer rounded-full dark:bg-[#38373D] bg-[#DDDDDD] switch"
|
||||
data-isOn={props.state}
|
||||
data-ison={props.state}
|
||||
onClick={toggleSwitch}
|
||||
>
|
||||
<motion.div
|
||||
@@ -6,7 +6,7 @@ interface ThemeList {
|
||||
|
||||
export const downloadTheme = async (themeName: string, themeURL: string) => {
|
||||
// send message to the background script
|
||||
const response = await browser.runtime.sendMessage({
|
||||
await browser.runtime.sendMessage({
|
||||
type: 'currentTab',
|
||||
info: 'DownloadTheme',
|
||||
body: {
|
||||
@@ -14,13 +14,11 @@ export const downloadTheme = async (themeName: string, themeURL: string) => {
|
||||
themeURL: themeURL
|
||||
}
|
||||
});
|
||||
|
||||
console.log("Response: ", response);
|
||||
}
|
||||
|
||||
export const setTheme = async (themeName: string, themeURL: string) => {
|
||||
// send message to the background script
|
||||
const response = await browser.runtime.sendMessage({
|
||||
await browser.runtime.sendMessage({
|
||||
type: 'currentTab',
|
||||
info: 'SetTheme',
|
||||
body: {
|
||||
@@ -28,8 +26,6 @@ export const setTheme = async (themeName: string, themeURL: string) => {
|
||||
themeURL: themeURL
|
||||
}
|
||||
});
|
||||
|
||||
console.log("Response: ", response);
|
||||
}
|
||||
|
||||
export const listThemes = async () => {
|
||||
@@ -39,9 +35,6 @@ export const listThemes = async () => {
|
||||
info: 'ListThemes'
|
||||
});
|
||||
|
||||
// response.themes is an array of strings that are identical to the theme names that we loop over. Use this list to see which ones are downloaded and which ones need to see the download icon.
|
||||
console.log("Response: ", response);
|
||||
|
||||
return response;
|
||||
}
|
||||
|
||||
@@ -2,13 +2,12 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Vite + React + TS</title>
|
||||
</head>
|
||||
<body class="">
|
||||
<div id="ExtensionPopup"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
<script type="module" src="./main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -5,7 +5,10 @@ import './index.css';
|
||||
import { SettingsContextProvider } from './SettingsContext.js';
|
||||
import SettingsPage from './SettingsPage.js';
|
||||
import browser from 'webextension-polyfill';
|
||||
import font from 'url:../resources/fonts/IconFamily.woff'
|
||||
|
||||
import * as Sentry from "@sentry/react";
|
||||
|
||||
browser.storage.local.get([ "telemetry" ]).then((telemetry) => {
|
||||
if (telemetry.telemetry === true)
|
||||
Sentry.init({
|
||||
@@ -24,14 +27,13 @@ browser.storage.local.get([ "telemetry" ]).then((telemetry) => {
|
||||
replaysOnErrorSampleRate: 1.0, // If you're not already sampling the entire session, change the sample rate to 100% when sampling sessions where errors occur.
|
||||
});
|
||||
})
|
||||
const fontURL = browser.runtime.getURL("fonts/IconFamily.woff");
|
||||
|
||||
const style = document.createElement("style");
|
||||
style.setAttribute("type", "text/css");
|
||||
style.innerHTML = `
|
||||
@font-face {
|
||||
font-family: 'IconFamily';
|
||||
src: url('${fontURL}') format('woff');
|
||||
src: url('${font}') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}`;
|
||||
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 6.0 KiB After Width: | Height: | Size: 6.0 KiB |
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 6.0 KiB After Width: | Height: | Size: 6.0 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 518 B After Width: | Height: | Size: 518 B |
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 877 B After Width: | Height: | Size: 877 B |
@@ -1,4 +1,4 @@
|
||||
import browser from 'webextension-polyfill'
|
||||
import backgroundPage from 'url:./background/background.html'
|
||||
|
||||
export async function appendBackgroundToUI() {
|
||||
console.log('Starting appendBackgroundToUI...');
|
||||
@@ -10,6 +10,6 @@ export async function appendBackgroundToUI() {
|
||||
background.id = 'background';
|
||||
background.classList.add('imageBackground');
|
||||
background.setAttribute('excludeDarkCheck', 'true');
|
||||
background.src = browser.runtime.getURL('backgrounds/background.html');
|
||||
background.src = backgroundPage;
|
||||
parent!.appendChild(background);
|
||||
}
|
||||
|
||||
@@ -54,18 +54,21 @@ export default function loading() {
|
||||
}
|
||||
.big-circle {
|
||||
margin: -88px;
|
||||
will-change: transform;
|
||||
animation-timing-function: ease;
|
||||
animation: spin 3s linear infinite;
|
||||
-moz-animation: spin 3s linear infinite;
|
||||
}
|
||||
.small-circle {
|
||||
margin: -66px;
|
||||
will-change: transform;
|
||||
animation-timing-function: ease;
|
||||
animation: spin 3s linear infinite;
|
||||
-moz-animation: spin 3s linear infinite;
|
||||
}
|
||||
.outer-circle {
|
||||
margin: -108px;
|
||||
will-change: transform;
|
||||
animation-direction: alternate-reverse;
|
||||
animation: spinback 1s linear infinite;
|
||||
-moz-animation: spinback 1s linear infinite;
|
||||
|
||||
@@ -19,14 +19,11 @@
|
||||
object-fit: cover;
|
||||
}
|
||||
</style>
|
||||
<script type="application/javascript" src="/browser-polyfill.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Container for the media -->
|
||||
<div id="media-container">
|
||||
<!-- Will be populated dynamically -->
|
||||
</div>
|
||||
<div id="media-container"></div>
|
||||
|
||||
<script src="background.js"></script>
|
||||
<script src="background.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,23 +1,33 @@
|
||||
// Open the database
|
||||
const openDB = () => {
|
||||
interface Data {
|
||||
blob: Blob;
|
||||
type: 'image' | 'video';
|
||||
}
|
||||
|
||||
interface DatabaseEventTarget extends EventTarget {
|
||||
result: IDBDatabase;
|
||||
}
|
||||
|
||||
interface DatabaseEvent extends Event {
|
||||
target: DatabaseEventTarget;
|
||||
}
|
||||
|
||||
const openDB = (): Promise<IDBDatabase> => {
|
||||
return new Promise((resolve, reject) => {
|
||||
const request = indexedDB.open('MyDatabase', 1);
|
||||
|
||||
request.onerror = () => reject(request.error);
|
||||
request.onsuccess = () => resolve(request.result);
|
||||
|
||||
request.onupgradeneeded = (event) => {
|
||||
const db = event.target.result;
|
||||
db.createObjectStore('backgrounds', { keyPath: 'id' });
|
||||
request.onupgradeneeded = (event: IDBVersionChangeEvent) => {
|
||||
// @ts-expect-error
|
||||
event?.target?.result.createObjectStore('backgrounds', { keyPath: 'id' });
|
||||
};
|
||||
});
|
||||
};
|
||||
|
||||
// Modified Read Data from IndexedDB
|
||||
const readData = async () => {
|
||||
const readData = async (): Promise<Data | null> => {
|
||||
const selectedBackground = localStorage.getItem('selectedBackground');
|
||||
if (!selectedBackground) {
|
||||
console.log('No selected background in local storage.');
|
||||
return null;
|
||||
}
|
||||
|
||||
@@ -26,20 +36,20 @@ const readData = async () => {
|
||||
const store = tx.objectStore('backgrounds');
|
||||
const request = store.get(selectedBackground);
|
||||
|
||||
return await new Promise((resolve, reject) => {
|
||||
request.onsuccess = () => resolve(request.result);
|
||||
return new Promise((resolve, reject) => {
|
||||
request.onsuccess = () => resolve(request.result as Data);
|
||||
request.onerror = () => reject(request.error);
|
||||
});
|
||||
};
|
||||
|
||||
const updateBackground = async () => {
|
||||
const updateBackground = async (): Promise<void> => {
|
||||
try {
|
||||
const data = await readData();
|
||||
if (!data) {
|
||||
console.log('No data found in IndexedDB.');
|
||||
|
||||
const container = document.getElementById('media-container');
|
||||
const currentMedia = container.querySelector('.current-media');
|
||||
const currentMedia = container?.querySelector('.current-media');
|
||||
if (currentMedia) {
|
||||
currentMedia.remove();
|
||||
}
|
||||
@@ -64,19 +74,19 @@ const updateBackground = async () => {
|
||||
}
|
||||
|
||||
// Mark the old element for removal
|
||||
const oldElement = container.querySelector('.current-media');
|
||||
const oldElement = container?.querySelector('.current-media');
|
||||
if (oldElement) {
|
||||
oldElement.classList.remove('current-media');
|
||||
oldElement.classList.add('old-media');
|
||||
}
|
||||
|
||||
// Add the new element and mark it as current
|
||||
newElement.classList.add('current-media');
|
||||
container.appendChild(newElement);
|
||||
newElement?.classList.add('current-media');
|
||||
container?.appendChild(newElement as Node);
|
||||
|
||||
// Delay removal of old element
|
||||
setTimeout(() => {
|
||||
const oldMedia = container.querySelector('.old-media');
|
||||
const oldMedia = container?.querySelector('.old-media');
|
||||
if (oldMedia) {
|
||||
oldMedia.remove();
|
||||
}
|
||||
@@ -87,13 +97,12 @@ const updateBackground = async () => {
|
||||
};
|
||||
|
||||
// Main function to run on page load
|
||||
const main = async () => {
|
||||
await updateBackground(); // Initial background update
|
||||
const main = async (): Promise<void> => {
|
||||
await updateBackground();
|
||||
|
||||
// Listen for changes to local storage
|
||||
window.addEventListener('storage', async (event) => {
|
||||
if (event.key === 'selectedBackground') {
|
||||
await updateBackground(); // Update background if 'selectedBackground' changes
|
||||
}
|
||||
});
|
||||
};
|
||||
@@ -1,9 +1,12 @@
|
||||
import browser from 'webextension-polyfill'
|
||||
import { GetThresholdOfColor, GetCSSElement } from '../../../SEQTA';
|
||||
import { GetThresholdOfColor } from '../../../SEQTA';
|
||||
import { lightenAndPaleColor } from './lightenAndPaleColor';
|
||||
import ColorLuminance from './ColorLuminance';
|
||||
import { SettingsState } from '../../../types/storage';
|
||||
|
||||
import darkLogo from 'url:../../../resources/icons/betterseqta-light-full.png';
|
||||
import lightLogo from 'url:../../../resources/icons/betterseqta-dark-full.png';
|
||||
|
||||
// Helper functions
|
||||
const setCSSVar = (varName: any, value: any) => document.documentElement.style.setProperty(varName, value);
|
||||
const getChromeURL = (path: any) => browser.runtime.getURL(path);
|
||||
@@ -36,10 +39,10 @@ export function updateAllColors(storedSetting: any, newColor = null) {
|
||||
let modeProps = {};
|
||||
if (DarkMode !== null) {
|
||||
modeProps = DarkMode ? {
|
||||
'--betterseqta-logo': `url(${getChromeURL('icons/betterseqta-light-full.png')})`
|
||||
'--betterseqta-logo': `url(${darkLogo})`
|
||||
} : {
|
||||
'--better-pale': lightenAndPaleColor(selectedColor),
|
||||
'--betterseqta-logo': `url(${getChromeURL('icons/betterseqta-dark-full.png')})`
|
||||
'--betterseqta-logo': `url(${lightLogo})`
|
||||
};
|
||||
|
||||
if (DarkMode) {
|
||||
@@ -67,7 +70,6 @@ export function updateAllColors(storedSetting: any, newColor = null) {
|
||||
}
|
||||
|
||||
let alliframes = document.getElementsByTagName('iframe');
|
||||
let fileref = GetCSSElement('css/iframe.css');
|
||||
|
||||
for (let i = 0; i < alliframes.length; i++) {
|
||||
const element = alliframes[i];
|
||||
@@ -76,11 +78,11 @@ export function updateAllColors(storedSetting: any, newColor = null) {
|
||||
continue;
|
||||
}
|
||||
|
||||
(element.contentDocument!.documentElement.childNodes[1] as HTMLIFrameElement).style.color =
|
||||
DarkMode ? 'white' : 'black';
|
||||
element.contentDocument!.documentElement.firstChild!.appendChild(
|
||||
fileref,
|
||||
);
|
||||
if (DarkMode) {
|
||||
element.contentDocument?.body.classList.add('dark');
|
||||
} else {
|
||||
element.contentDocument?.body.classList.remove('dark');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +0,0 @@
|
||||
const GetPrefs = await fetch(`${location.origin}/seqta/student/load/prefs?`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ asArray: true, request: 'userPrefs' })
|
||||
})
|
||||
export const response = await GetPrefs.json()
|
||||
@@ -45,7 +45,6 @@ export default class StorageListener {
|
||||
|
||||
case 'DarkMode':
|
||||
this.darkMode = changes.DarkMode.newValue;
|
||||
console.log(this.darkMode);
|
||||
break;
|
||||
|
||||
case 'customshortcuts':
|
||||
|
||||
@@ -1,20 +1,35 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: [
|
||||
'./index.html',
|
||||
'./src/**/*.{js,ts,jsx,tsx}',
|
||||
"./src/**/*.{js,ts,jsx,tsx,html}",
|
||||
],
|
||||
darkMode: 'class',
|
||||
darkMode: "class",
|
||||
theme: {
|
||||
fontSize: {
|
||||
'xs': '.65rem',
|
||||
'sm': '.775rem',
|
||||
'base': '0.65rem',
|
||||
'md': '0.65rem',
|
||||
'lg': '1rem',
|
||||
'xl': '1.25rem',
|
||||
'2xl': '1.5rem',
|
||||
'3xl': '1.875rem',
|
||||
"xs": ".65rem",
|
||||
"sm": ".775rem",
|
||||
"base": "0.65rem",
|
||||
"md": "0.65rem",
|
||||
"lg": "1rem",
|
||||
"xl": "1.25rem",
|
||||
"2xl": "1.5rem",
|
||||
"3xl": "1.875rem",
|
||||
"4xl": "2.25rem",
|
||||
"5xl": "3rem",
|
||||
"6xl": "4rem",
|
||||
"7xl": "5rem",
|
||||
"8xl": "6rem",
|
||||
"9xl": "8rem",
|
||||
"10xl": "10rem",
|
||||
"11xl": "12rem",
|
||||
"12xl": "14rem",
|
||||
"13xl": "16rem",
|
||||
"14xl": "18rem",
|
||||
},
|
||||
extend: {
|
||||
fontFamily: {
|
||||
"IconFamily": "IconFamily"
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [],
|
||||
|
||||
@@ -1,87 +0,0 @@
|
||||
import path from 'path';
|
||||
import MiniCssExtractPlugin from 'mini-css-extract-plugin';
|
||||
import CopyWebpackPlugin from 'copy-webpack-plugin';
|
||||
import ESLintPlugin from 'eslint-webpack-plugin';
|
||||
import { sentryWebpackPlugin } from '@sentry/webpack-plugin';
|
||||
|
||||
|
||||
export default {
|
||||
target: 'web',
|
||||
node: {
|
||||
__dirname: true
|
||||
},
|
||||
performance: {
|
||||
hints: false,
|
||||
maxEntrypointSize: 512000,
|
||||
maxAssetSize: 512000,
|
||||
},
|
||||
devtool: 'source-map',
|
||||
entry: {
|
||||
SEQTA: './src/SEQTA.ts',
|
||||
background: './src/background.ts',
|
||||
'css/documentload': './src/css/documentload.scss',
|
||||
'css/iframe': './src/css/iframe.scss',
|
||||
'css/injected': './src/css/injected.scss',
|
||||
},
|
||||
output: {
|
||||
filename: (pathData) => {
|
||||
const name = pathData.chunk.name.replace('css-', '');
|
||||
return name.includes('css') ? `css/${name}.js` : `${name}.js`;
|
||||
},
|
||||
// eslint-disable-next-line no-undef
|
||||
path: path.resolve('build'),
|
||||
publicPath: '',
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.(css|scss)$/,
|
||||
use: [
|
||||
MiniCssExtractPlugin.loader,
|
||||
{
|
||||
loader: 'css-loader',
|
||||
options: {
|
||||
importLoaders: 2
|
||||
}
|
||||
},
|
||||
'sass-loader'
|
||||
]
|
||||
},
|
||||
{
|
||||
test: /\.(png|svg|jpg|jpeg|gif)$/i,
|
||||
type: 'asset/resource',
|
||||
generator: {
|
||||
filename: 'src/[path][name][ext]',
|
||||
},
|
||||
},
|
||||
{
|
||||
test: /\.tsx?$/,
|
||||
use: 'ts-loader',
|
||||
exclude: /node_modules/,
|
||||
}
|
||||
],
|
||||
},
|
||||
resolve: {
|
||||
extensions: ['.tsx', '.ts', '.js'],
|
||||
},
|
||||
plugins: [
|
||||
new ESLintPlugin(),
|
||||
new MiniCssExtractPlugin({
|
||||
filename: '[name].css'
|
||||
}),
|
||||
new CopyWebpackPlugin({
|
||||
patterns: [
|
||||
{ from: 'public', to: '.' },
|
||||
{ from: 'src/css/preview', to: 'css/preview' },
|
||||
{ from: 'node_modules/webextension-polyfill/dist/browser-polyfill.js' },
|
||||
{ from: 'interface/dist/client', to: 'client' },
|
||||
{ from: 'interface/dist/index.html', to: 'interface/index.html' }
|
||||
],
|
||||
}),
|
||||
sentryWebpackPlugin({
|
||||
authToken: process.env.SENTRY_AUTH_TOKEN,
|
||||
org: "betterseqta-plus",
|
||||
project: "betterseqtaplus-main",
|
||||
}),
|
||||
],
|
||||
};
|
||||