1
0
mirror of https://github.com/XFox111/TabsAsideExtension.git synced 2026-07-02 19:52:47 +03:00

Compare commits

...

6 Commits

Author SHA1 Message Date
xfox111 4bdab6acea feat(wip): virtualized collections list #235 2026-06-04 16:08:14 +12:00
xfox111 54844c54d5 build: 3.3.2 version bump 2026-06-03 07:53:24 +00:00
xfox111 46f613f295 build(deps): audit fix 2026-06-03 07:51:58 +00:00
dependabot[bot] 01340f6aef build(deps): Bump the deps group with 8 updates (#237)
* Bump the deps group with 8 updates

Bumps the deps group with 8 updates:

| Package | From | To |
| --- | --- | --- |
| [@fluentui/react-components](https://github.com/microsoft/fluentui) | `9.73.8` | `9.74.1` |
| [@fluentui/react-icons](https://github.com/microsoft/fluentui-system-icons) | `2.0.326` | `2.0.328` |
| [@webext-core/messaging](https://github.com/aklinker1/webext-core/tree/HEAD/packages/messaging) | `2.3.0` | `3.0.1` |
| [@eslint/css](https://github.com/eslint/css) | `0.14.1` | `1.3.0` |
| [@eslint/js](https://github.com/eslint/eslint/tree/HEAD/packages/js) | `9.39.4` | `10.0.1` |
| [@eslint/json](https://github.com/eslint/json) | `0.14.0` | `2.0.0` |
| [eslint](https://github.com/eslint/eslint) | `9.39.4` | `10.4.1` |
| [typescript-eslint](https://github.com/typescript-eslint/typescript-eslint/tree/HEAD/packages/typescript-eslint) | `8.59.3` | `8.60.0` |


Updates `@fluentui/react-components` from 9.73.8 to 9.74.1
- [Release notes](https://github.com/microsoft/fluentui/releases)
- [Commits](https://github.com/microsoft/fluentui/commits/@fluentui/react-components_v9.74.1)

Updates `@fluentui/react-icons` from 2.0.326 to 2.0.328
- [Changelog](https://github.com/microsoft/fluentui-system-icons/blob/main/docs/releases.md)
- [Commits](https://github.com/microsoft/fluentui-system-icons/commits)

Updates `@webext-core/messaging` from 2.3.0 to 3.0.1
- [Release notes](https://github.com/aklinker1/webext-core/releases)
- [Changelog](https://github.com/aklinker1/webext-core/blob/main/packages/messaging/CHANGELOG.md)
- [Commits](https://github.com/aklinker1/webext-core/commits/messaging-v3.0.1/packages/messaging)

Updates `@eslint/css` from 0.14.1 to 1.3.0
- [Release notes](https://github.com/eslint/css/releases)
- [Changelog](https://github.com/eslint/css/blob/main/CHANGELOG.md)
- [Commits](https://github.com/eslint/css/compare/css-v0.14.1...css-v1.3.0)

Updates `@eslint/js` from 9.39.4 to 10.0.1
- [Release notes](https://github.com/eslint/eslint/releases)
- [Commits](https://github.com/eslint/eslint/commits/v10.0.1/packages/js)

Updates `@eslint/json` from 0.14.0 to 2.0.0
- [Release notes](https://github.com/eslint/json/releases)
- [Changelog](https://github.com/eslint/json/blob/main/CHANGELOG.md)
- [Commits](https://github.com/eslint/json/compare/json-v0.14.0...json-v2.0.0)

Updates `eslint` from 9.39.4 to 10.4.1
- [Release notes](https://github.com/eslint/eslint/releases)
- [Commits](https://github.com/eslint/eslint/compare/v9.39.4...v10.4.1)

Updates `typescript-eslint` from 8.59.3 to 8.60.0
- [Release notes](https://github.com/typescript-eslint/typescript-eslint/releases)
- [Changelog](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/typescript-eslint/CHANGELOG.md)
- [Commits](https://github.com/typescript-eslint/typescript-eslint/commits/v8.60.0/packages/typescript-eslint)

---
updated-dependencies:
- dependency-name: "@fluentui/react-components"
  dependency-version: 9.74.1
  dependency-type: direct:production
  update-type: version-update:semver-minor
  dependency-group: deps
- dependency-name: "@fluentui/react-icons"
  dependency-version: 2.0.328
  dependency-type: direct:production
  update-type: version-update:semver-patch
  dependency-group: deps
- dependency-name: "@webext-core/messaging"
  dependency-version: 3.0.1
  dependency-type: direct:production
  update-type: version-update:semver-major
  dependency-group: deps
- dependency-name: "@eslint/css"
  dependency-version: 1.3.0
  dependency-type: direct:development
  update-type: version-update:semver-major
  dependency-group: deps
- dependency-name: "@eslint/js"
  dependency-version: 10.0.1
  dependency-type: direct:development
  update-type: version-update:semver-major
  dependency-group: deps
- dependency-name: "@eslint/json"
  dependency-version: 2.0.0
  dependency-type: direct:development
  update-type: version-update:semver-major
  dependency-group: deps
- dependency-name: eslint
  dependency-version: 10.4.1
  dependency-type: direct:development
  update-type: version-update:semver-major
  dependency-group: deps
- dependency-name: typescript-eslint
  dependency-version: 8.60.0
  dependency-type: direct:development
  update-type: version-update:semver-minor
  dependency-group: deps
...

Signed-off-by: dependabot[bot] <support@github.com>

* fix(deps): eslint-plugin-react incompatible with eslint 10

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Eugene Fox <eugene@xfox111.net>
2026-06-03 19:48:38 +12:00
dependabot[bot] b4a454f463 build(deps): Bump the react group across 1 directory with 3 updates (#239)
Bumps the react group with 3 updates in the / directory: [react](https://github.com/facebook/react/tree/HEAD/packages/react), [@types/react](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/react) and [react-dom](https://github.com/facebook/react/tree/HEAD/packages/react-dom).


Updates `react` from 19.2.6 to 19.2.7
- [Release notes](https://github.com/facebook/react/releases)
- [Changelog](https://github.com/facebook/react/blob/main/CHANGELOG.md)
- [Commits](https://github.com/facebook/react/commits/v19.2.7/packages/react)

Updates `@types/react` from 19.2.14 to 19.2.16
- [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases)
- [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/react)

Updates `react-dom` from 19.2.6 to 19.2.7
- [Release notes](https://github.com/facebook/react/releases)
- [Changelog](https://github.com/facebook/react/blob/main/CHANGELOG.md)
- [Commits](https://github.com/facebook/react/commits/v19.2.7/packages/react-dom)

Updates `@types/react` from 19.2.14 to 19.2.16
- [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases)
- [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/react)

---
updated-dependencies:
- dependency-name: react
  dependency-version: 19.2.7
  dependency-type: direct:production
  update-type: version-update:semver-patch
  dependency-group: react
- dependency-name: "@types/react"
  dependency-version: 19.2.16
  dependency-type: direct:development
  update-type: version-update:semver-patch
  dependency-group: react
- dependency-name: react-dom
  dependency-version: 19.2.7
  dependency-type: direct:production
  update-type: version-update:semver-patch
  dependency-group: react
- dependency-name: "@types/react"
  dependency-version: 19.2.16
  dependency-type: direct:development
  update-type: version-update:semver-patch
  dependency-group: react
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2026-06-03 19:02:01 +12:00
xfox111 8d9864b276 Patch 3.3.1 (#232)
* fix: opening tab context menu causes tab to open on Firefox #224 (#225)

* build(deps): dependency bump + audit fix + manifest version update

* chore(ci): dependabot group policy update

* docs: copyright dates

* chore(ui): minor branding update
2026-05-17 21:03:44 +12:00
14 changed files with 1911 additions and 1678 deletions
+8 -2
View File
@@ -52,7 +52,10 @@ updates:
schedule:
interval: monthly
rebase-strategy: disabled
open-pull-requests-limit: 20
groups:
actions:
patterns:
- "*"
- package-ecosystem: "devcontainers"
directory: "/"
@@ -62,4 +65,7 @@ updates:
schedule:
interval: monthly
rebase-strategy: disabled
open-pull-requests-limit: 20
groups:
devcontainers:
patterns:
- "*"
+1 -1
View File
@@ -1,6 +1,6 @@
MIT License
Copyright (c) 2025 Eugene Fox
Copyright (c) 2026 Eugene Fox
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
+1 -1
View File
@@ -97,4 +97,4 @@ If you are interested in fixing issues and contributing directly to the code bas
[![GitHub](https://img.shields.io/badge/%40xfox111-GitHub?logo=github&logoColor=%23181717&label=GitHub&labelColor=white&color=%23181717)](https://github.com/xfox111)
[![Buy Me a Coffee](https://img.shields.io/badge/%40xfox111-BMC?logo=buymeacoffee&logoColor=black&label=Buy%20me%20a%20coffee&labelColor=white&color=%23FFDD00)](https://buymeacoffee.com/xfox111)
> ©2025 Eugene Fox. Licensed under [MIT license](https://github.com/XFox111/TabsAsideExtension/blob/main/LICENSE)
> ©2026 Eugene Fox. Licensed under [MIT license](https://github.com/XFox111/TabsAsideExtension/blob/main/LICENSE)
+98
View File
@@ -0,0 +1,98 @@
export default function VirtualList<T>(props: VirtualListProps<T>): React.ReactElement
{
const [columns, setColumns] = useState<number>(1);
const [rowsToRender, setRowsToRender] = useState<number>(0);
const [rowIndex, setRowIndex] = useState<number>(0);
const additionalRows = 3;
const heights: number[] = useMemo(() =>
{
if (typeof props.itemHeight === "number")
return props.items.map(() => props.itemHeight as number);
return props.items.map(props.itemHeight);
}, [props.items, props.itemHeight]);
const minHeight: number = Math.min(...heights);
const totalRows: number = Math.ceil(props.items.length / columns);
const takeCount: number = rowsToRender * columns;
const renderStartIndex: number = rowIndex * columns;
const paddingTop: number = calculateHeight(heights, 0, rowIndex, columns);
const paddingBottom: number = calculateHeight(heights, rowIndex + rowsToRender, totalRows, columns);
const renderedItems = props.items.slice(renderStartIndex, renderStartIndex + takeCount);
useEffect(() =>
{
const container = document.querySelector(props.containerSelector);
const handleResize = (): void =>
{
if (!container)
return;
const newRowsToRender: number = Math.ceil(container.clientHeight / minHeight) + additionalRows;
setRowsToRender(newRowsToRender);
if (!props.columnMinWidth)
{
setColumns(1);
return;
}
const newColumns: number = Math.floor((container.clientWidth - (props.horizontalOffset ?? 0)) / (props.columnMinWidth));
setColumns(Math.max(1, newColumns));
};
handleResize();
const handleScroll = (e: Event): void =>
{
const target = e.target as HTMLElement;
const topOffset: number = target.scrollHeight - calculateHeight(heights, 0, totalRows, columns);
const scrollTop: number = Math.max(0, target.scrollTop - topOffset);
const newIndex: number = Math.floor(scrollTop / minHeight - Math.floor(additionalRows / 2));
console.log("scroll", scrollTop, newIndex);
setRowIndex(Math.max(0, newIndex));
};
container?.addEventListener("scroll", handleScroll);
window.addEventListener("resize", handleResize);
return () =>
{
container?.removeEventListener("scroll", handleScroll);
window.removeEventListener("resize", handleResize);
};
}, [totalRows, props.columnMinWidth, props.horizontalOffset, heights, columns]);
return (
<section tabIndex={ 0 } style={ { paddingTop, paddingBottom } } className={ props.className }>
{ renderedItems.map((item, index) => props.itemRenderer(item, rowIndex * columns + index)) }
</section>
);
}
export type VirtualListProps<T> = {
className?: string;
itemHeight: number | ((item: T, index: number) => number);
containerSelector: string;
horizontalOffset?: number;
columnMinWidth?: number;
items: T[];
itemRenderer: (item: T, index: number) => React.ReactElement;
};
function calculateHeight(heights: number[], rowStart: number, rowEnd: number, columns: number): number
{
let height = 0;
for (let i = rowStart; i < rowEnd; i++)
{
const rowHeights = heights.slice(i * columns, (i + 1) * columns);
height += Math.max(...rowHeights);
}
return height;
}
@@ -41,5 +41,11 @@ export const useOptionsStyles = makeStyles({
flexFlow: "column",
alignItems: "flex-start",
gap: tokens.spacingVerticalSNudge
},
img:
{
height: "100px",
flexGrow: 1,
alignSelf: "flex-end"
}
});
+22 -20
View File
@@ -2,7 +2,7 @@ import { BuyMeACoffee20Regular } from "@/assets/BuyMeACoffee20";
import { bskyLink, buyMeACoffeeLink, githubLinks, storeLink, websiteLink } from "@/data/links";
import { useBmcStyles } from "@/hooks/useBmcStyles";
import extLink from "@/utils/extLink";
import { Body1, Button, Caption1, Link, Subtitle1, Text } from "@fluentui/react-components";
import { Body1, Button, Caption1, Image, Link, Subtitle1, Text } from "@fluentui/react-components";
import { PersonFeedback20Regular } from "@fluentui/react-icons";
import { useOptionsStyles } from "../hooks/useOptionsStyles";
import Package from "@/package.json";
@@ -19,25 +19,6 @@ export default function AboutSection(): React.ReactElement
<sup><Caption1> v{ Package.version }</Caption1></sup>
</Text>
<Body1 as="p">
{ i18n.t("options_page.about.developed_by") } (<Link { ...extLink(bskyLink) }>@xfox111.net</Link>)<br />
{ i18n.t("options_page.about.licensed_under") } <Link { ...extLink(githubLinks.license) }>{ i18n.t("options_page.about.mit_license") }</Link>
</Body1>
<Body1 as="p">
{ i18n.t("options_page.about.translation_cta.text") }<br />
<Link { ...extLink(githubLinks.translationGuide) }>
{ i18n.t("options_page.about.translation_cta.button") }
</Link>
</Body1>
<Body1 as="p">
<Link { ...extLink(websiteLink) }>{ i18n.t("options_page.about.links.website") }</Link><br />
<Link { ...extLink(githubLinks.repo) }>{ i18n.t("options_page.about.links.source") }</Link><br />
<Link { ...extLink(githubLinks.release) }>{ i18n.t("options_page.about.links.changelog") }</Link><br />
<Link { ...extLink(githubLinks.privacy) }>{ i18n.t("options_page.about.links.privacy") }</Link>
</Body1>
<div className={ cls.horizontalButtons }>
<Button
as="a" { ...extLink(storeLink) }
@@ -54,6 +35,27 @@ export default function AboutSection(): React.ReactElement
{ i18n.t("common.cta.sponsor") }
</Button>
</div>
<Body1 as="p">
{ i18n.t("options_page.about.translation_cta.text") }<br />
<Link { ...extLink(githubLinks.translationGuide) }>
{ i18n.t("options_page.about.translation_cta.button") }
</Link>
</Body1>
<Body1 as="p">
<Link { ...extLink(websiteLink) }>{ i18n.t("options_page.about.links.website") }</Link><br />
<Link { ...extLink(githubLinks.repo) }>{ i18n.t("options_page.about.links.source") }</Link><br />
<Link { ...extLink(githubLinks.release) }>{ i18n.t("options_page.about.links.changelog") }</Link><br />
<Link { ...extLink(githubLinks.privacy) }>{ i18n.t("options_page.about.links.privacy") }</Link>
</Body1>
<Body1 as="p">
{ i18n.t("options_page.about.developed_by") } (<Link { ...extLink(bskyLink) }>@xfox111.net</Link>)<br />
{ i18n.t("options_page.about.licensed_under") } <Link { ...extLink(githubLinks.license) }>{ i18n.t("options_page.about.mit_license") }</Link>
</Body1>
<Image className={ cls.img } src="/fox.svg" />
</>
);
}
@@ -9,13 +9,19 @@ export default function TabMoreButton({ onEdit, onDelete, ...props }: TabMoreBut
const DeleteIcon = bundleIcon(Delete20Filled, Delete20Regular);
const dangerCls = useDangerStyles();
const onClick = (ev: React.MouseEvent): void =>
{
ev.stopPropagation();
ev.preventDefault();
};
return (
<Menu>
<Tooltip relationship="label" content={ i18n.t("common.tooltips.more") }>
<MenuTrigger>
<MenuTrigger disableButtonEnhancement>
<Button
appearance="subtle" icon={ <MoreHorizontal20Regular /> }
onClick={ ev => ev.stopPropagation() }
onClick={ onClick }
{ ...props } />
</MenuTrigger>
</Tooltip>
@@ -45,7 +45,37 @@ export default function CollectionsProvider({ children }: React.PropsWithChildre
const addCollection = async (collection: CollectionItem): Promise<void> =>
{
await updateStorage([collection, ...collections]);
// TEMP
// await updateStorage([collection, ...collections]);
const items: CollectionItem[] = [];
for (let i = 0; i < 128; i++)
items.push({
title: i.toString(),
items: [
{
type: "tab",
title: "Google",
url: "https://www.google.com"
},
{
type: "group",
title: "Group",
color: "blue",
items: [
{
type: "tab",
title: "Facebook",
url: "https://www.facebook.com"
}
]
}
],
timestamp: Date.now() + i,
type: "collection"
});
await updateStorage(items);
};
const removeItem = async (...indices: number[]): Promise<void> =>
@@ -22,6 +22,8 @@ import { snapHandleToCursor } from "../../utils/dnd/snapHandleToCursor";
import { useStyles_CollectionListView } from "./CollectionListView.styles";
import SearchBar from "./SearchBar";
import StorageCapacityIssueMessage from "./messages/StorageCapacityIssueMessage";
import VirtualList from "@/components/VirtualList";
import calculateCollectionHeight from "../../utils/calculateCollectionHeight";
export default function CollectionListView(): ReactElement
{
@@ -60,6 +62,8 @@ export default function CollectionListView(): ReactElement
setShowHidden(newShowHidden);
}, []);
// FIXME: disable drag and drop if filters are active!!!
const handleDragStart = (event: DragStartEvent): void =>
{
setActive(event.active.data.current as DndItem);
@@ -115,7 +119,55 @@ export default function CollectionListView(): ReactElement
</Button>
</div>
:
<section className={ mergeClasses(cls.collectionList, !tilesView && cls.listView, !!(!tilesView && compactView) && cls.compactList) }>
<DndContext
sensors={ sensors }
collisionDetection={ collisionDetector(!tilesView) }
onDragStart={ handleDragStart }
onDragEnd={ handleDragEnd }
modifiers={ [snapHandleToCursor] }
>
<SortableContext
items={ resultList.map((_, index) => index.toString()) }
strategy={ tilesView ? verticalListSortingStrategy : rectSortingStrategy }
>
<VirtualList
className={ mergeClasses(cls.collectionList, !tilesView && cls.listView, !!(!tilesView && compactView) && cls.compactList) }
itemHeight={ item => calculateCollectionHeight(item, tilesView, compactView ?? true) }
horizontalOffset={ 32 }
columnMinWidth={ !tilesView ? 360 : undefined }
items={ resultList }
containerSelector="article"
itemRenderer={ (item, index) =>
<CollectionView key={ item.timestamp } collection={ item } index={ index } compact={ compactView } />
} />
</SortableContext>
<DragOverlay dropAnimation={ null }>
{ active !== null ?
active.item.type === "collection" ?
<CollectionView collection={ active.item } index={ -1 } dragOverlay />
:
<CollectionContext.Provider
value={ {
tabCount: 0,
collection: resultList[active.indices[0]],
hasPinnedGroup: true
} }
>
{ active.item.type === "group" ?
<GroupView group={ active.item } indices={ [-1] } collectionId={ -1 } dragOverlay />
:
<TabView tab={ active.item } indices={ [-1] } collectionId={ -1 } dragOverlay />
}
</CollectionContext.Provider>
:
<></>
}
</DragOverlay>
</DndContext>
/* <section className={ mergeClasses(cls.collectionList, !tilesView && cls.listView, !!(!tilesView && compactView) && cls.compactList) }>
<DndContext
sensors={ sensors }
collisionDetection={ collisionDetector(!tilesView) }
@@ -155,7 +207,7 @@ export default function CollectionListView(): ReactElement
}
</DragOverlay>
</DndContext>
</section>
</section> */
}
</article>
);
@@ -0,0 +1,37 @@
import { CollectionItem, GroupItem } from "@/models/CollectionModels";
export default function calculateCollectionHeight(collection: CollectionItem, tilesView: boolean, compactView: boolean): number
{
if (compactView)
return collection.color ? 69.2 : 67.6;
if (collection.items.length < 1)
return collection.color ? 217.6 : 219.2;
if (tilesView)
{
let height = 201.6;
if (collection.items.some(i => i.type === "group"))
height = 242.4;
if (collection.color)
height += 1.6;
return height;
}
else
{
let baseHeight: number = collection.color ? 81.2 : 79.6;
baseHeight += 39.6 * collection.items.flatMap(i => i.type === "group" ? i.items : [i]).length - 6;
const groups: GroupItem[] = collection.items.filter(i => i.type === "group");
for (const group of groups)
baseHeight += group.items.length < 1 ? 126 : 50;
return Math.min(baseHeight, 572);
}
}
+1534 -1630
View File
File diff suppressed because it is too large Load Diff
+26 -18
View File
@@ -1,7 +1,7 @@
{
"name": "tabs-aside",
"private": true,
"version": "3.3.0",
"version": "3.3.2",
"type": "module",
"scripts": {
"dev": "wxt",
@@ -16,27 +16,35 @@
"@dnd-kit/modifiers": "^9.0.0",
"@dnd-kit/sortable": "^10.0.0",
"@dnd-kit/utilities": "^3.2.2",
"@fluentui/react-components": "^9.72.9",
"@fluentui/react-icons": "^2.0.316",
"@webext-core/messaging": "^2.3.0",
"@wxt-dev/analytics": "^0.5.1",
"@wxt-dev/i18n": "^0.2.4",
"@fluentui/react-components": "^9.74.1",
"@fluentui/react-icons": "^2.0.328",
"@webext-core/messaging": "^3.0.1",
"@wxt-dev/analytics": "^0.5.4",
"@wxt-dev/i18n": "^0.2.5",
"lzutf8": "^0.6.3",
"react": "^19.2.3",
"react-dom": "^19.2.3"
"react": "^19.2.7",
"react-dom": "^19.2.7"
},
"devDependencies": {
"@eslint/css": "^0.14.1",
"@eslint/js": "^9.39.2",
"@eslint/json": "^0.14.0",
"@stylistic/eslint-plugin": "^5.6.1",
"@types/react": "^19.2.7",
"@eslint/css": "^1.3.0",
"@eslint/js": "^9.39.4",
"@eslint/json": "^2.0.0",
"@stylistic/eslint-plugin": "^5.10.0",
"@types/react": "^19.2.16",
"@types/react-dom": "^19.2.3",
"@wxt-dev/module-react": "^1.1.5",
"eslint": "^9.39.2",
"@wxt-dev/module-react": "^1.2.2",
"eslint": "^9.39.4",
"eslint-plugin-react": "^7.37.5",
"typescript": "^5.9.3",
"typescript-eslint": "^8.51.0",
"wxt": "^0.20.11"
"typescript": "^6.0.3",
"typescript-eslint": "^8.60.0",
"wxt": "^0.20.26"
},
"overrides": {
"node-notifier": {
"uuid": "^11.1.1"
},
"web-ext-run": {
"tmp": "^0.2.6"
}
}
}
+85
View File
@@ -0,0 +1,85 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Layer_5" data-name="Layer 5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2000 1000">
<defs>
<style>
.cls-1,
.cls-2,
.cls-3 {
stroke-width: 0px;
}
.cls-1,
.cls-4 {
fill: #ff7545;
}
.cls-2,
.cls-6 {
fill: #242424;
}
.cls-5 {
stroke-width: 12px;
stroke-linejoin: round;
}
.cls-6,
.cls-4 {
stroke: #242424;
stroke-linejoin: round;
}
.cls-6,
.cls-4 {
stroke-linecap: round;
stroke-width: 8px;
}
.cls-3 {
fill: #fff;
}
.laptop {
fill: #424242;
stroke: #424242;
}
@media (prefers-color-scheme: dark) {
.laptop {
fill: #d6d6d6;
stroke: #d6d6d6;
}
}
</style>
</defs>
<g>
<path class="cls-1"
d="M1656,996.17c-62.9,0-124.32-15.87-177.6-45.9-48.31-27.23-88.43-65.09-116.63-109.96,42.24,16.15,87.02,24.34,133.29,24.34,191.24,0,346.83-142.61,346.83-317.91,0-49.29-17.77-79.71-40.27-118.22-.25-.44-.51-.87-.77-1.31,56.26,25.15,103.09,59.13,135.92,98.71,38.75,46.72,58.4,100.56,58.4,160,0,82.81-35.24,160.68-99.22,219.27-64.08,58.67-149.29,90.99-239.96,90.99Z" />
<path class="cls-2"
d="M1810.27,435.77c21.37,10.21,41.26,21.71,59.35,34.32,24.99,17.43,46.59,37.03,64.2,58.27,38.17,46.02,57.52,99.03,57.52,157.56,0,41.28-8.83,81.34-26.25,119.04-16.85,36.47-40.98,69.24-71.73,97.4-30.8,28.2-66.67,50.34-106.62,65.82-41.4,16.04-85.39,24.17-130.75,24.17-62.25,0-123.01-15.7-175.72-45.4-44.28-24.95-81.59-58.94-108.99-99.08,39.45,13.69,80.98,20.62,123.77,20.62,193.35,0,350.66-144.33,350.66-321.74,0-46.31-15.25-76.1-35.44-110.97M1791.69,419.07c25.27,43.77,46.37,74.72,46.37,127.67,0,173.46-153.57,314.08-343,314.08-50.83,0-99.07-10.14-142.46-28.3,57.52,99.6,171.79,167.48,303.4,167.48,189.44,0,343-140.62,343-314.08,0-126.92-88.98-217.31-207.31-266.85h0Z" />
</g>
<path class="cls-4"
d="M1850.7,210.11c40.63,49.7,33.28,122.93-16.42,163.56-49.7,40.63-174.15,75.16-214.78,25.46-40.63-49.7,17.94-164.81,67.64-205.44,49.7-40.63,122.93-33.28,163.56,16.42Z" />
<g>
<path class="cls-1"
d="M1141.23,996c-107.8,0-211.68-30.24-292.51-85.15-34.04-23.13-63.19-50-86.62-79.87-30.95-39.44-50.89-82.52-59.27-128.07,2.74-4.13,13.24-18.52,34.99-33.02,23.72-15.81,66.05-35,133.04-36.62,3.24-.07,6.3-.11,9.33-.11,43.77,0,86.56,14.88,130.79,45.49,38.84,26.88,73.68,62.33,104.42,93.61,24.59,25.02,47.83,48.66,69.78,64.67,62.27,45.4,122.66,67.87,162.35,78.74,26.53,7.27,47.34,10.45,59.7,11.84-35.66,20.71-74.9,37.05-116.83,48.62-47.77,13.19-97.96,19.88-149.17,19.88Z" />
<path class="cls-2"
d="M880.19,637.16c42.93,0,84.97,14.65,128.51,44.78,38.53,26.66,73.23,61.97,103.85,93.12,24.71,25.14,48.06,48.89,70.28,65.1,62.76,45.75,123.63,68.41,163.65,79.36,19.52,5.35,36,8.51,48.36,10.37-32.55,17.79-67.94,32.01-105.51,42.38-47.43,13.09-97.26,19.73-148.11,19.73-54.46,0-107.6-7.59-157.95-22.55-48.57-14.43-93.08-35.26-132.31-61.91-33.7-22.89-62.54-49.48-85.72-79.03-30.18-38.46-49.75-80.41-58.19-124.72,8.21-11.64,51.24-63.8,163.88-66.52,3.21-.07,6.24-.11,9.25-.11M880.19,629.16c-3.2,0-6.34.04-9.43.11-132.17,3.19-172.15,72.82-172.15,72.82,8.48,47.56,29.48,92.03,60.34,131.36,23.74,30.26,53.31,57.47,87.52,80.71,78.67,53.44,181.82,85.84,294.76,85.84,105.42,0,202.3-28.24,278.72-75.46,0,0-28.21-.92-71.36-12.74-43.16-11.81-101.26-34.52-161.05-78.11-76.68-55.9-167.65-204.53-307.35-204.53h0Z" />
</g>
<g>
<path class="cls-3"
d="M760.28,828.65c-29.91-38.81-49.23-81.08-57.46-125.74,2.74-4.13,13.24-18.52,34.99-33.02,23.38-15.59,64.87-34.46,130.24-36.54l51.71,133.53-159.48,61.77Z" />
<path class="cls-2"
d="M865.35,637.45l49.24,127.14-152.95,59.24c-28.13-37.18-46.48-77.52-54.58-120.04,8.07-11.44,49.8-62.07,158.29-66.35M870.76,629.27c-132.17,3.19-172.15,72.82-172.15,72.82,8.48,47.56,29.48,92.03,60.34,131.36l165.99-64.29-54.18-139.89h0Z" />
</g>
<rect class="cls-5 laptop" x="1219.11" y="766.83" width="270.32" height="9.95"
transform="translate(304.74 -380.67) rotate(18)" />
<rect class="cls-5 laptop" x="1059.2" y="596.18" width="270.32" height="9.95"
transform="translate(1479.19 -705.28) rotate(75.58)" />
<path class="cls-6"
d="M1666.04,416.09c1.06-29.87-22.29-54.95-52.17-56.01-2.32-.08-4.6,0-6.85.2.75,15,4.9,28.4,13.47,38.89,10.4,12.71,26.28,19.9,44.99,22.9.29-1.96.48-3.95.55-5.98Z" />
<path class="cls-4"
d="M1851.96,176.25c-29.01-25.87-78.84-33.24-78.84-33.24,0,0,37.28-38.45,83.99-62.26,46.65-23.78,102.73-32.92,102.73-32.92,0,0-26.34,46.29-43.76,93.12-19.06,51.23-22.35,98.62-22.35,98.62,0,0-13.99-38.55-41.77-63.33Z" />
<ellipse class="cls-2" cx="1700.37" cy="301.32" rx="10.19" ry="17.93"
transform="translate(271.38 1270.89) rotate(-44.21)" />
</svg>

After

Width:  |  Height:  |  Size: 4.6 KiB

-1
View File
@@ -87,7 +87,6 @@ export default defineConfig({
id: "tabsaside@xfox111.net",
strict_min_version: "139.0",
// @ts-expect-error Introduced in Firefox 139
data_collection_permissions: {
required: ["browsingActivity"],
optional: ["technicalAndInteraction"]