deps: update web client build deps (#3095)
* deps: change web build-dep from node-sass to sass https://sass-lang.com/blog/libsass-is-deprecated and dart sass is the recommended replacement. * deps: yarn upgrade-interactive * deps: update babel dep to 7.17 * deps: update eslint * deps: update prettier * deps: update svgo * deps: update webpack to 5.72.1 * deps: update webpack-bundle-analyzer to 4.5.0 * deps: update webpack-cli to 4.9.2 * deps: update webpack-dev-server from 3.11.3 to 4.9.0 * deps: replace svgo, svgo-loader, url-loader with webpack asset/inline * chore: rename "style" dir as "assets" * deps: update stylelint from 13.13.1 to 14.8.2 * deps: bump terser-webpack-plugin from 5.1.4 to 5.3.1 * deps: bump css-loader from 5.2.7 to 6.7.1 * deps: bump css-minimizer-webpack-plugin from 3.0.2 to 3.4.1 * deps: bump mini-css-extract-plugin from 1.6.2 to 2.6.0
|
@ -33,25 +33,27 @@ $yellow-700: #dbab09;
|
||||||
// $z-index-progressbar: 1;
|
// $z-index-progressbar: 1;
|
||||||
$z-index-popup: 2;
|
$z-index-popup: 2;
|
||||||
|
|
||||||
// SVG ICONS -- see images/README.md for sources and license details
|
// ICONS -- see assets/img/README.md for sources and license details
|
||||||
// Are you a designer? New icon PRs welcomed!
|
// Are you a designer? New icon PRs welcomed!
|
||||||
$image-analytics: 'images/analytics.svg';
|
$image-alt-speed-disabled: '../img/turtle.png';
|
||||||
$image-baseline: 'images/horizontal-rule.svg';
|
$image-alt-speed-enabled: '../img/blue-turtle.png';
|
||||||
$image-files: 'images/files.svg';
|
$image-analytics: '../img/analytics.svg';
|
||||||
$image-chevron-dn: 'images/chevron-down.svg';
|
$image-baseline: '../img/horizontal-rule.svg';
|
||||||
$image-chevron-up: 'images/chevron-up.svg';
|
$image-chevron-dn: '../img/chevron-down.svg';
|
||||||
$image-lock-fill: 'images/lock-fill.svg';
|
$image-chevron-up: '../img/chevron-up.svg';
|
||||||
$image-network: 'images/router.svg';
|
$image-files: '../img/files.svg';
|
||||||
$image-magnet: 'images/magnet.svg';
|
$image-lock-fill: '../img/lock-fill.svg';
|
||||||
$image-overflow: 'images/three-dots-vertical.svg';
|
$image-magnet: '../img/magnet.svg';
|
||||||
$image-pause-circle-active: 'images/pause-circle-active.svg';
|
$image-network: '../img/router.svg';
|
||||||
$image-pause-circle-idle: 'images/pause-circle-idle.svg';
|
$image-overflow: '../img/three-dots-vertical.svg';
|
||||||
$image-peers: 'images/team.svg';
|
$image-pause-circle-active: '../img/pause-circle-active.svg';
|
||||||
$image-play-circle-active: 'images/play-circle-active.svg';
|
$image-pause-circle-idle: '../img/pause-circle-idle.svg';
|
||||||
$image-play-circle-idle: 'images/play-circle-idle.svg';
|
$image-peers: '../img/team.svg';
|
||||||
$image-speed: 'images/checkered-flag.svg';
|
$image-play-circle-active: '../img/play-circle-active.svg';
|
||||||
$image-tiers: 'images/diagram-3-fill.svg';
|
$image-play-circle-idle: '../img/play-circle-idle.svg';
|
||||||
$image-upload-download: 'images/up-and-down-arrows.svg';
|
$image-speed: '../img/checkered-flag.svg';
|
||||||
|
$image-tiers: '../img/diagram-3-fill.svg';
|
||||||
|
$image-upload-download: '../img/up-and-down-arrows.svg';
|
||||||
|
|
||||||
@mixin for-phone-only {
|
@mixin for-phone-only {
|
||||||
@media (max-width: 599px) {
|
@media (max-width: 599px) {
|
||||||
|
@ -167,6 +169,7 @@ a {
|
||||||
.even {
|
.even {
|
||||||
background-color: var(--color-bg-even);
|
background-color: var(--color-bg-even);
|
||||||
}
|
}
|
||||||
|
|
||||||
.odd {
|
.odd {
|
||||||
background-color: var(--color-bg-odd);
|
background-color: var(--color-bg-odd);
|
||||||
}
|
}
|
||||||
|
@ -241,23 +244,23 @@ $toolbar-height: $toolbar-height-number * 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#toolbar-open {
|
#toolbar-open {
|
||||||
background-image: url('images/toolbar-folder.png');
|
background-image: url('../img/toolbar-folder.png');
|
||||||
}
|
}
|
||||||
|
|
||||||
#toolbar-remove {
|
#toolbar-remove {
|
||||||
background-image: url('images/toolbar-close.png');
|
background-image: url('../img/toolbar-close.png');
|
||||||
}
|
}
|
||||||
|
|
||||||
#toolbar-start {
|
#toolbar-start {
|
||||||
background-image: url('images/toolbar-start.png');
|
background-image: url('../img/toolbar-start.png');
|
||||||
}
|
}
|
||||||
|
|
||||||
#toolbar-pause {
|
#toolbar-pause {
|
||||||
background-image: url('images/toolbar-pause.png');
|
background-image: url('../img/toolbar-pause.png');
|
||||||
}
|
}
|
||||||
|
|
||||||
#toolbar-inspector {
|
#toolbar-inspector {
|
||||||
background-image: url('images/toolbar-info.png');
|
background-image: url('../img/toolbar-info.png');
|
||||||
}
|
}
|
||||||
|
|
||||||
#toolbar-overflow {
|
#toolbar-overflow {
|
||||||
|
@ -269,7 +272,7 @@ $toolbar-height: $toolbar-height-number * 1px;
|
||||||
width: 36px;
|
width: 36px;
|
||||||
|
|
||||||
&.alt-speed-enabled {
|
&.alt-speed-enabled {
|
||||||
background-image: url('images/blue-turtle.png'), url($image-overflow);
|
background-image: url($image-alt-speed-enabled), url($image-overflow);
|
||||||
background-position: bottom left, center, center;
|
background-position: bottom left, center, center;
|
||||||
background-size: 16px 9px, 26px, 26px;
|
background-size: 16px 9px, 26px, 26px;
|
||||||
}
|
}
|
||||||
|
@ -294,9 +297,11 @@ $toolbar-height: $toolbar-height-number * 1px;
|
||||||
> :not(select):not(input) {
|
> :not(select):not(input) {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
> input {
|
> input {
|
||||||
min-width: 50px;
|
min-width: 50px;
|
||||||
}
|
}
|
||||||
|
|
||||||
> input,
|
> input,
|
||||||
> select {
|
> select {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
@ -359,15 +364,15 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
}
|
}
|
||||||
|
|
||||||
.torrent-list {
|
.torrent-list {
|
||||||
$app-image: 'images/application-x-executable.png';
|
$app-image: '../img/application-x-executable.png';
|
||||||
$audio-image: 'images/audio-x-generic.png';
|
$audio-image: '../img/audio-x-generic.png';
|
||||||
$folder-image: 'images/folder.png';
|
$folder-image: '../img/folder.png';
|
||||||
$font-image: 'images/font-x-generic.png';
|
$font-image: '../img/font-x-generic.png';
|
||||||
$image-image: 'images/image-x-generic.png';
|
$image-image: '../img/image-x-generic.png';
|
||||||
$package-image: 'images/package-x-generic.png';
|
$package-image: '../img/package-x-generic.png';
|
||||||
$text-image: 'images/folder.png';
|
$text-image: '../img/folder.png';
|
||||||
$text-image: 'images/text-x-generic.png';
|
$text-image: '../img/text-x-generic.png';
|
||||||
$video-image: 'images/video-x-generic.png';
|
$video-image: '../img/video-x-generic.png';
|
||||||
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
|
@ -517,13 +522,16 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
|
|
||||||
&[data-action='pause'] {
|
&[data-action='pause'] {
|
||||||
background-image: url($image-pause-circle-idle);
|
background-image: url($image-pause-circle-idle);
|
||||||
|
|
||||||
&:active,
|
&:active,
|
||||||
&:hover {
|
&:hover {
|
||||||
background-image: url($image-pause-circle-active);
|
background-image: url($image-pause-circle-active);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&[data-action='resume'] {
|
&[data-action='resume'] {
|
||||||
background-image: url($image-play-circle-idle);
|
background-image: url($image-play-circle-idle);
|
||||||
|
|
||||||
&:active,
|
&:active,
|
||||||
&:hover {
|
&:hover {
|
||||||
background-image: url($image-play-circle-active);
|
background-image: url($image-play-circle-active);
|
||||||
|
@ -586,6 +594,7 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
margin: 2px 0;
|
margin: 2px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.compact {
|
&.compact {
|
||||||
min-width: 50px;
|
min-width: 50px;
|
||||||
width: 50px;
|
width: 50px;
|
||||||
|
@ -610,48 +619,56 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
var(--color-progressbar-leech-paused-2)
|
var(--color-progressbar-leech-paused-2)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.leech.queued {
|
&.leech.queued {
|
||||||
@include progressbar-background(
|
@include progressbar-background(
|
||||||
var(--color-progressbar-leech-queued-1),
|
var(--color-progressbar-leech-queued-1),
|
||||||
var(--color-progressbar-leech-queued-2)
|
var(--color-progressbar-leech-queued-2)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.leech {
|
&.leech {
|
||||||
@include progressbar-background(
|
@include progressbar-background(
|
||||||
var(--color-progressbar-leech-1),
|
var(--color-progressbar-leech-1),
|
||||||
var(--color-progressbar-leech-2)
|
var(--color-progressbar-leech-2)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.magnet.paused {
|
&.magnet.paused {
|
||||||
@include progressbar-background(
|
@include progressbar-background(
|
||||||
var(--color-progressbar-magnet-paused-1),
|
var(--color-progressbar-magnet-paused-1),
|
||||||
var(--color-progressbar-magnet-paused-2)
|
var(--color-progressbar-magnet-paused-2)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.magnet {
|
&.magnet {
|
||||||
@include progressbar-background(
|
@include progressbar-background(
|
||||||
var(--color-progressbar-magnet-1),
|
var(--color-progressbar-magnet-1),
|
||||||
var(--color-progressbar-magnet-2)
|
var(--color-progressbar-magnet-2)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.seed.paused {
|
&.seed.paused {
|
||||||
@include progressbar-background(
|
@include progressbar-background(
|
||||||
var(--color-progressbar-seed-paused-1),
|
var(--color-progressbar-seed-paused-1),
|
||||||
var(--color-progressbar-seed-paused-2)
|
var(--color-progressbar-seed-paused-2)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.seed.queued {
|
&.seed.queued {
|
||||||
@include progressbar-background(
|
@include progressbar-background(
|
||||||
var(--color-progressbar-seed-queued-1),
|
var(--color-progressbar-seed-queued-1),
|
||||||
var(--color-progressbar-seed-queued-2)
|
var(--color-progressbar-seed-queued-2)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.seed {
|
&.seed {
|
||||||
@include progressbar-background(
|
@include progressbar-background(
|
||||||
var(--color-progressbar-seed-1),
|
var(--color-progressbar-seed-1),
|
||||||
var(--color-progressbar-seed-2)
|
var(--color-progressbar-seed-2)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.verify {
|
&.verify {
|
||||||
@include progressbar-background(
|
@include progressbar-background(
|
||||||
var(--color-progressbar-verify-1),
|
var(--color-progressbar-verify-1),
|
||||||
|
@ -739,7 +756,7 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
}
|
}
|
||||||
|
|
||||||
.alt-speed-section-label {
|
.alt-speed-section-label {
|
||||||
background: transparent url('images/blue-turtle.png') no-repeat;
|
background: transparent url($image-alt-speed-enabled) no-repeat;
|
||||||
background-position: left 4px;
|
background-position: left 4px;
|
||||||
padding-left: 22px;
|
padding-left: 22px;
|
||||||
}
|
}
|
||||||
|
@ -775,6 +792,7 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
.blocklist-size-label {
|
.blocklist-size-label {
|
||||||
font-size: smaller;
|
font-size: smaller;
|
||||||
}
|
}
|
||||||
|
|
||||||
.blocklist-size-number {
|
.blocklist-size-number {
|
||||||
font-weight: bolder;
|
font-weight: bolder;
|
||||||
}
|
}
|
||||||
|
@ -783,9 +801,11 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
|
|
||||||
&[data-open='true'] {
|
&[data-open='true'] {
|
||||||
color: var(--color-fg-port-open);
|
color: var(--color-fg-port-open);
|
||||||
}
|
}
|
||||||
|
|
||||||
&[data-open='false'] {
|
&[data-open='false'] {
|
||||||
color: var(--color-fg-port-closed);
|
color: var(--color-fg-port-closed);
|
||||||
}
|
}
|
||||||
|
@ -852,7 +872,7 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
}
|
}
|
||||||
|
|
||||||
#alternative-speed-limits-title {
|
#alternative-speed-limits-title {
|
||||||
background: transparent url('images/blue-turtle.png') no-repeat;
|
background: transparent url($image-alt-speed-enabled) no-repeat;
|
||||||
padding-left: 18px;
|
padding-left: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -898,10 +918,12 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
.file-priority-radiobox,
|
.file-priority-radiobox,
|
||||||
.tabs-buttons {
|
.tabs-buttons {
|
||||||
$radius: 8px;
|
$radius: 8px;
|
||||||
|
|
||||||
:first-child {
|
:first-child {
|
||||||
border-bottom-left-radius: $radius;
|
border-bottom-left-radius: $radius;
|
||||||
border-top-left-radius: $radius;
|
border-top-left-radius: $radius;
|
||||||
}
|
}
|
||||||
|
|
||||||
:last-child {
|
:last-child {
|
||||||
border-bottom-right-radius: $radius;
|
border-bottom-right-radius: $radius;
|
||||||
border-top-right-radius: $radius;
|
border-top-right-radius: $radius;
|
||||||
|
@ -1141,6 +1163,7 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
|
|
||||||
.encryption {
|
.encryption {
|
||||||
width: 16px;
|
width: 16px;
|
||||||
|
|
||||||
&[data-encrypted='true'] {
|
&[data-encrypted='true'] {
|
||||||
background: transparent url($image-lock-fill) center center no-repeat;
|
background: transparent url($image-lock-fill) center center no-repeat;
|
||||||
height: 16px;
|
height: 16px;
|
||||||
|
@ -1158,10 +1181,12 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
.percent-done {
|
.percent-done {
|
||||||
width: 10%;
|
width: 10%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.speed-down,
|
.speed-down,
|
||||||
.speed-up {
|
.speed-up {
|
||||||
width: 15%;
|
width: 15%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.peer-address {
|
.peer-address {
|
||||||
width: 25%;
|
width: 25%;
|
||||||
}
|
}
|
||||||
|
@ -1381,11 +1406,11 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
|
||||||
grid-area: check;
|
grid-area: check;
|
||||||
|
|
||||||
&:checked ~ #alt-speed-image {
|
&:checked ~ #alt-speed-image {
|
||||||
background-image: url('images/blue-turtle.png');
|
background-image: url($image-alt-speed-enabled);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:not(:checked) ~ #alt-speed-image {
|
&:not(:checked) ~ #alt-speed-image {
|
||||||
background-image: url('images/turtle.png');
|
background-image: url($image-alt-speed-disabled);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1524,7 +1549,7 @@ $logo-size: 64px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dialog-logo {
|
.dialog-logo {
|
||||||
background: transparent url('images/logo.png') top left no-repeat;
|
background: transparent url('../img/logo.png') top left no-repeat;
|
||||||
height: $logo-size;
|
height: $logo-size;
|
||||||
width: $logo-size;
|
width: $logo-size;
|
||||||
}
|
}
|
Before Width: | Height: | Size: 274 B After Width: | Height: | Size: 274 B |
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 227 B After Width: | Height: | Size: 227 B |
Before Width: | Height: | Size: 3.0 KiB After Width: | Height: | Size: 3.0 KiB |
Before Width: | Height: | Size: 292 B After Width: | Height: | Size: 292 B |
Before Width: | Height: | Size: 273 B After Width: | Height: | Size: 273 B |
Before Width: | Height: | Size: 683 B After Width: | Height: | Size: 683 B |
Before Width: | Height: | Size: 425 B After Width: | Height: | Size: 425 B |
Before Width: | Height: | Size: 344 B After Width: | Height: | Size: 344 B |
Before Width: | Height: | Size: 796 B After Width: | Height: | Size: 796 B |
Before Width: | Height: | Size: 841 B After Width: | Height: | Size: 841 B |
Before Width: | Height: | Size: 254 B After Width: | Height: | Size: 254 B |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 315 B After Width: | Height: | Size: 315 B |
Before Width: | Height: | Size: 5.3 KiB After Width: | Height: | Size: 5.3 KiB |
Before Width: | Height: | Size: 303 B After Width: | Height: | Size: 303 B |
Before Width: | Height: | Size: 610 B After Width: | Height: | Size: 610 B |
Before Width: | Height: | Size: 246 B After Width: | Height: | Size: 246 B |
Before Width: | Height: | Size: 246 B After Width: | Height: | Size: 246 B |
Before Width: | Height: | Size: 241 B After Width: | Height: | Size: 241 B |
Before Width: | Height: | Size: 241 B After Width: | Height: | Size: 241 B |
Before Width: | Height: | Size: 456 B After Width: | Height: | Size: 456 B |
Before Width: | Height: | Size: 389 B After Width: | Height: | Size: 389 B |
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 484 B After Width: | Height: | Size: 484 B |
Before Width: | Height: | Size: 308 B After Width: | Height: | Size: 308 B |
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.7 KiB |
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
Before Width: | Height: | Size: 677 B After Width: | Height: | Size: 677 B |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 183 B After Width: | Height: | Size: 183 B |
Before Width: | Height: | Size: 873 B After Width: | Height: | Size: 873 B |
Before Width: | Height: | Size: 797 B After Width: | Height: | Size: 797 B |
|
@ -6,49 +6,47 @@
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "WEBPACK_MODE=development webpack serve --config webpack.config.js",
|
"dev": "WEBPACK_MODE=development webpack serve --config webpack.config.js",
|
||||||
"build": "webpack --config webpack.config.js",
|
"build": "webpack --config webpack.config.js",
|
||||||
"css": "sass --no-source-map style/",
|
"css": "sass --no-source-map assets/css/",
|
||||||
"css:map": "sass style/",
|
"css:map": "sass assets/css/",
|
||||||
"lint": "run-p --silent lint:eslint lint:stylelint lint:prettier",
|
"lint": "run-p --silent lint:eslint lint:stylelint lint:prettier",
|
||||||
"lint:fix": "run-s lint:eslint:fix lint:stylelint:fix lint:prettier:fix",
|
"lint:fix": "run-s lint:eslint:fix lint:stylelint:fix lint:prettier:fix",
|
||||||
"lint:eslint": "eslint src/*.js",
|
"lint:eslint": "eslint src/*.js",
|
||||||
"lint:eslint:fix": "eslint --fix src/*.js",
|
"lint:eslint:fix": "eslint --fix src/*.js",
|
||||||
"lint:prettier": "prettier --loglevel warn --check package.json public_html/index.html style/*scss src/*.js",
|
"lint:prettier": "prettier --loglevel warn --check package.json public_html/index.html assets/css/*scss src/*.js",
|
||||||
"lint:prettier:fix": "prettier --loglevel warn -w package.json public_html/index.html style/*scss src/*.js",
|
"lint:prettier:fix": "prettier --loglevel warn -w package.json public_html/index.html assets/css/*scss src/*.js",
|
||||||
"lint:stylelint": "stylelint style/*scss",
|
"lint:stylelint": "stylelint assets/css/*scss",
|
||||||
"lint:stylelint:fix": "stylelint --fix style/*scss"
|
"lint:stylelint:fix": "stylelint --fix assets/css/*scss"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@babel/core": "^7.14.8",
|
"@babel/core": "^7.17.10",
|
||||||
"@babel/eslint-parser": "^7.14.9",
|
"@babel/eslint-parser": "^7.17.0",
|
||||||
"@babel/plugin-proposal-class-properties": "^7.13.0",
|
"@babel/plugin-proposal-class-properties": "^7.16.7",
|
||||||
"css-loader": "^5.2.7",
|
"@primer/stylelint-config": "12.5.0",
|
||||||
"css-minimizer-webpack-plugin": "^3.0.2",
|
"css-loader": "^6.7.1",
|
||||||
"eslint": "^7.26.0",
|
"css-minimizer-webpack-plugin": "^3.4.1",
|
||||||
"eslint-plugin-sonarjs": "^0.7.0",
|
"eslint": "^8.15.0",
|
||||||
"eslint-plugin-unicorn": "^32.0.1",
|
"eslint-plugin-sonarjs": "^0.13.0",
|
||||||
|
"eslint-plugin-unicorn": "^42.0.0",
|
||||||
"file-loader": "^6.2.0",
|
"file-loader": "^6.2.0",
|
||||||
"mini-css-extract-plugin": "^1.6.2",
|
"mini-css-extract-plugin": "^2.6.0",
|
||||||
"node-sass": "^7.0.0",
|
|
||||||
"npm-run-all": "^4.1.5",
|
"npm-run-all": "^4.1.5",
|
||||||
"prettier": "^2.3.2",
|
"prettier": "^2.6.2",
|
||||||
"sass": "^1.32.13",
|
"sass": "^1.32.13",
|
||||||
"sass-loader": "^11.1.1",
|
"sass-loader": "^11.1.1",
|
||||||
"style-loader": "^2.0.0",
|
"style-loader": "^2.0.0",
|
||||||
"stylelint": "^13.13.1",
|
"stylelint": "^14.8.2",
|
||||||
"stylelint-config-prettier": "^8.0.2",
|
"stylelint-config-prettier": "^9.0.3",
|
||||||
"stylelint-config-primer": "^11.0.1",
|
"stylelint-config-sass-guidelines": "^9.0.1",
|
||||||
"stylelint-config-sass-guidelines": "^8.0.0",
|
"stylelint-config-standard": "^25.0.0",
|
||||||
"stylelint-config-standard": "^22.0.0",
|
"terser-webpack-plugin": "^5.3.1",
|
||||||
"svgo": "^2.3.1",
|
"webpack": "^5.72.1",
|
||||||
"svgo-loader": "^3.0.0",
|
"webpack-bundle-analyzer": "^4.5.0",
|
||||||
"terser-webpack-plugin": "^5.1.4",
|
"webpack-cli": "^4.9.2",
|
||||||
"url-loader": "^4.1.1",
|
"webpack-dev-server": "^4.9.0"
|
||||||
"webpack": "^5.37.1",
|
|
||||||
"webpack-bundle-analyzer": "^4.4.2",
|
|
||||||
"webpack-cli": "^4.7.2",
|
|
||||||
"webpack-dev-server": "^3.11.3"
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"lodash.isequal": "^4.5.0"
|
"lodash.isequal": "^4.5.0",
|
||||||
|
"package.json": "^2.0.1",
|
||||||
|
"yarn.lock": "^0.0.1-security"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -9,7 +9,7 @@ import { Prefs } from './prefs.js';
|
||||||
import { Transmission } from './transmission.js';
|
import { Transmission } from './transmission.js';
|
||||||
import { debounce } from './utils.js';
|
import { debounce } from './utils.js';
|
||||||
|
|
||||||
import '../style/transmission-app.scss';
|
import '../assets/css/transmission-app.scss';
|
||||||
|
|
||||||
function main() {
|
function main() {
|
||||||
const action_manager = new ActionManager();
|
const action_manager = new ActionManager();
|
||||||
|
@ -21,7 +21,7 @@ function main() {
|
||||||
transmission.elements.torrent_list.scrollTo(0, 1)
|
transmission.elements.torrent_list.scrollTo(0, 1)
|
||||||
);
|
);
|
||||||
window.addEventListener('load', scroll_soon);
|
window.addEventListener('load', scroll_soon);
|
||||||
window.onorientationchange = scroll_soon;
|
window.addEventListener('orientationchange', scroll_soon);
|
||||||
}
|
}
|
||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', main);
|
document.addEventListener('DOMContentLoaded', main);
|
||||||
|
|
|
@ -44,7 +44,7 @@ export class Notifications {
|
||||||
const title = `${event.type === 'downloadComplete' ? 'Download' : 'Seeding'} complete`;
|
const title = `${event.type === 'downloadComplete' ? 'Download' : 'Seeding'} complete`;
|
||||||
const content = torrent.getName();
|
const content = torrent.getName();
|
||||||
const notification = window.webkitNotifications.createNotification(
|
const notification = window.webkitNotifications.createNotification(
|
||||||
'style/transmission/images/logo.png',
|
'assets/img/logo.png',
|
||||||
title,
|
title,
|
||||||
content
|
content
|
||||||
);
|
);
|
||||||
|
|
|
@ -44,7 +44,7 @@ export class PrefsDialog extends EventTarget {
|
||||||
|
|
||||||
_checkPort() {
|
_checkPort() {
|
||||||
const element = this.elements.network.port_status_label;
|
const element = this.elements.network.port_status_label;
|
||||||
element.removeAttribute('data-open');
|
delete element.dataset.open;
|
||||||
setTextContent(element, 'Checking...');
|
setTextContent(element, 'Checking...');
|
||||||
this.remote.checkPort(this._onPortChecked, this);
|
this.remote.checkPort(this._onPortChecked, this);
|
||||||
}
|
}
|
||||||
|
|
|
@ -317,8 +317,6 @@ export class Transmission extends EventTarget {
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
case Prefs.AltSpeedEnabled:
|
|
||||||
case Prefs.NotificationsEnabled:
|
|
||||||
default:
|
default:
|
||||||
/*noop*/
|
/*noop*/
|
||||||
break;
|
break;
|
||||||
|
|
|
@ -5,8 +5,8 @@ module.exports = {
|
||||||
"stylelint-config-prettier"
|
"stylelint-config-prettier"
|
||||||
],
|
],
|
||||||
"plugins": [
|
"plugins": [
|
||||||
"stylelint-config-primer/plugins/no-undefined-vars",
|
"@primer/stylelint-config/plugins/no-undefined-vars",
|
||||||
"stylelint-config-primer/plugins/no-unused-vars"
|
"@primer/stylelint-config/plugins/no-unused-vars"
|
||||||
],
|
],
|
||||||
"rules": {
|
"rules": {
|
||||||
"block-no-empty": true,
|
"block-no-empty": true,
|
||||||
|
@ -15,7 +15,6 @@ module.exports = {
|
||||||
"declaration-block-no-duplicate-properties": true,
|
"declaration-block-no-duplicate-properties": true,
|
||||||
"declaration-block-no-shorthand-property-overrides": true,
|
"declaration-block-no-shorthand-property-overrides": true,
|
||||||
"font-family-no-duplicate-names": true,
|
"font-family-no-duplicate-names": true,
|
||||||
"function-calc-no-invalid": true,
|
|
||||||
"function-calc-no-unspaced-operator": true,
|
"function-calc-no-unspaced-operator": true,
|
||||||
"function-linear-gradient-no-nonstandard-direction": true,
|
"function-linear-gradient-no-nonstandard-direction": true,
|
||||||
"max-nesting-depth": null,
|
"max-nesting-depth": null,
|
||||||
|
|
|
@ -27,18 +27,12 @@ const config = {
|
||||||
test: /\.css$/i,
|
test: /\.css$/i,
|
||||||
use: [ 'style-loader', 'css-loader' ],
|
use: [ 'style-loader', 'css-loader' ],
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
test: /\.(png|jpe?g|)$/i,
|
exclude: /(node_modules)/,
|
||||||
use: [
|
include: /(assets)\/(img)/,
|
||||||
'url-loader',
|
test: /\.(jpe?g|png|gif|svg|webp)$/,
|
||||||
],
|
type: 'asset/inline',
|
||||||
},
|
|
||||||
{
|
|
||||||
test: /\.svg$/i,
|
|
||||||
use: [
|
|
||||||
'url-loader',
|
|
||||||
'svgo-loader'
|
|
||||||
],
|
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
@ -70,7 +64,6 @@ const config = {
|
||||||
if (mode === 'development') {
|
if (mode === 'development') {
|
||||||
config.devServer = {
|
config.devServer = {
|
||||||
compress: true,
|
compress: true,
|
||||||
contentBase: path.join(__dirname, 'public_html'),
|
|
||||||
historyApiFallback: {
|
historyApiFallback: {
|
||||||
rewrites: [
|
rewrites: [
|
||||||
{ from: '/transmission/web', to: '/' },
|
{ from: '/transmission/web', to: '/' },
|
||||||
|
@ -80,7 +73,8 @@ if (mode === 'development') {
|
||||||
port: devPort,
|
port: devPort,
|
||||||
proxy: {
|
proxy: {
|
||||||
'/rpc': rpcUrl
|
'/rpc': rpcUrl
|
||||||
}
|
},
|
||||||
|
static: './public_html'
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|