1
0
mirror of https://github.com/jellyfin/jellyfin-web.git synced 2025-04-18 20:24:10 +03:00

Use logos from @jellyfin/ux-web

This commit is contained in:
Bill Thornton 2025-04-10 17:38:51 -04:00
parent 8671b6e0c3
commit 458614d361
24 changed files with 88 additions and 85 deletions

23
package-lock.json generated
View File

@ -19,6 +19,7 @@
"@fontsource/noto-sans-tc": "5.2.5",
"@jellyfin/libass-wasm": "4.2.3",
"@jellyfin/sdk": "0.0.0-unstable.202504100501",
"@jellyfin/ux-web": "1.0.0",
"@mui/icons-material": "6.4.10",
"@mui/material": "6.4.10",
"@mui/x-date-pickers": "7.28.2",
@ -4097,6 +4098,11 @@
"axios": "^1.3.4"
}
},
"node_modules/@jellyfin/ux-web": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/@jellyfin/ux-web/-/ux-web-1.0.0.tgz",
"integrity": "sha512-3uBl/CMkWBsL2aD5xmg5qEQcN57ZJE/d5JktbwxXgWPrfa9A6KltivvcEltY4zVyT6btGgLy7sKmtFyu6gQ7dw=="
},
"node_modules/@jridgewell/gen-mapping": {
"version": "0.3.5",
"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz",
@ -24604,9 +24610,9 @@
}
},
"node_modules/tslib": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w==",
"version": "2.8.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
"devOptional": true
},
"node_modules/tunnel-agent": {
@ -28558,6 +28564,11 @@
"integrity": "sha512-Qpmn8+TQz//EJjkhcXmhq5cytcIsQhxRQz943udlKoRXbz9UdnnMq/VUngMg+F+FHbDM1TTpb3h1Ki3tCH/HFw==",
"requires": {}
},
"@jellyfin/ux-web": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/@jellyfin/ux-web/-/ux-web-1.0.0.tgz",
"integrity": "sha512-3uBl/CMkWBsL2aD5xmg5qEQcN57ZJE/d5JktbwxXgWPrfa9A6KltivvcEltY4zVyT6btGgLy7sKmtFyu6gQ7dw=="
},
"@jridgewell/gen-mapping": {
"version": "0.3.5",
"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz",
@ -42679,9 +42690,9 @@
}
},
"tslib": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w==",
"version": "2.8.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
"devOptional": true
},
"tunnel-agent": {

View File

@ -85,6 +85,7 @@
"@fontsource/noto-sans-tc": "5.2.5",
"@jellyfin/libass-wasm": "4.2.3",
"@jellyfin/sdk": "0.0.0-unstable.202504100501",
"@jellyfin/ux-web": "1.0.0",
"@mui/icons-material": "6.4.10",
"@mui/material": "6.4.10",
"@mui/x-date-pickers": "7.28.2",

View File

@ -6,7 +6,7 @@ import React from 'react';
import { useSystemInfo } from 'hooks/useSystemInfo';
import ListItemLink from 'components/ListItemLink';
import appIcon from 'assets/img/icon-transparent.png';
import appIcon from '@jellyfin/ux-web/icon-transparent.png';
const DrawerHeaderLink = () => {
const { data: systemInfo } = useSystemInfo();

Binary file not shown.

Before

Width:  |  Height:  |  Size: 85 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 82 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 6.7 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.6 KiB

View File

@ -15,9 +15,9 @@
<meta id="themeColor" name="theme-color" content="#202020">
<link rel="apple-touch-icon" sizes="180x180" href="touchicon.png">
<link rel="shortcut icon" href="favicon.ico">
<meta name="msapplication-TileImage" content="touchicon144.png">
<link rel="apple-touch-icon" sizes="180x180" href="../node_modules/@jellyfin/ux-web/favicons/touchicon.png">
<link rel="shortcut icon" href="../node_modules/@jellyfin/ux-web/favicons/favicon.ico">
<meta name="msapplication-TileImage" content="../node_modules/@jellyfin/ux-web/favicons/touchicon144.png">
<meta name="msapplication-TileColor" content="#333333">
<title>Jellyfin</title>
@ -80,37 +80,6 @@
[dir="rtl"] .mainDrawerHandle {
left: 0;
}
@keyframes fadein {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.splashLogo {
animation: fadein 0.5s;
width: 30%;
height: 30%;
background-image: url(assets/img/icon-transparent.png);
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
@media screen
and (min-device-width: 992px) {
.splashLogo {
background-image: url(assets/img/banner-light.png);
}
}
</style>
</head>
<body dir="ltr">

View File

@ -10,22 +10,22 @@
"icons": [
{
"sizes": "72x72",
"src": "touchicon72.png",
"src": "favicons/touchicon72.png",
"type": "image/png"
},
{
"sizes": "114x114",
"src": "touchicon114.png",
"src": "favicons/touchicon114.png",
"type": "image/png"
},
{
"sizes": "144x144",
"src": "touchicon144.png",
"src": "favicons/touchicon144.png",
"type": "image/png"
},
{
"sizes": "512x512",
"src": "touchicon512.png",
"src": "favicons/touchicon512.png",
"type": "image/png"
}
]

View File

@ -1,3 +1,5 @@
import icon from '@jellyfin/ux-web/icon-transparent.png';
import { PluginType } from '../../types/plugin.ts';
import { randomInt } from '../../utils/number.ts';
@ -133,7 +135,7 @@ export default function () {
elem.classList.add('logoScreenSaver');
document.body.appendChild(elem);
elem.innerHTML = '<img class="logoScreenSaverImage" src="assets/img/banner-light.png" />';
elem.innerHTML = `<img class="logoScreenSaverImage" src="${icon}" />`;
}
stopInterval();

View File

@ -4,6 +4,37 @@
height: 100%;
}
@keyframes fadein {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.splashLogo {
animation: fadein 0.5s;
width: 30%;
height: 30%;
background-image: url(@jellyfin/ux-web/icon-transparent.png);
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
@media screen
and (min-device-width: 992px) {
.splashLogo {
background-image: url(@jellyfin/ux-web/banner-light.png);
}
}
html {
@include fullpage;
line-height: 1.35;

View File

@ -35,11 +35,11 @@ html {
}
.pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-dark.png);
background-image: url(@jellyfin/ux-web/banner-dark.png);
}
.layout-tv .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/icon-transparent.png);
background-image: url(@jellyfin/ux-web/icon-transparent.png);
}
html {

View File

@ -35,11 +35,11 @@ html {
}
.pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-light.png);
background-image: url(@jellyfin/ux-web/banner-light.png);
}
.layout-tv .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/icon-transparent.png);
background-image: url(@jellyfin/ux-web/icon-transparent.png);
}
.dialog,

View File

@ -34,11 +34,11 @@ html {
}
.pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-light.png);
background-image: url(@jellyfin/ux-web/banner-light.png);
}
.layout-tv .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/icon-transparent.png);
background-image: url(@jellyfin/ux-web/icon-transparent.png);
}
.backgroundContainer,

View File

@ -44,11 +44,11 @@ html {
}
.pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-light.png);
background-image: url(@jellyfin/ux-web/banner-light.png);
}
.layout-tv .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/icon-transparent.png);
background-image: url(@jellyfin/ux-web/icon-transparent.png);
}
.backgroundContainer,

View File

@ -31,11 +31,11 @@ html {
}
.pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-light.png);
background-image: url(@jellyfin/ux-web/banner-light.png);
}
.layout-tv .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/icon-transparent.png);
background-image: url(@jellyfin/ux-web/icon-transparent.png);
}
.dialog,

View File

@ -41,11 +41,11 @@ html {
}
.pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-light.png);
background-image: url(@jellyfin/ux-web/banner-light.png);
}
.layout-tv .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/icon-transparent.png);
background-image: url(@jellyfin/ux-web/icon-transparent.png);
}
.backgroundContainer,

Binary file not shown.

Before

Width:  |  Height:  |  Size: 8.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.4 KiB

View File

@ -80,35 +80,24 @@ const config = {
new CopyPlugin({
patterns: [
{
from: 'assets/**',
globOptions: {
dot: true,
ignore: ['**/css/*']
}
from: 'assets',
to: 'assets'
},
'config.json',
'robots.txt',
{
from: '*.*',
globOptions: {
dot: true,
ignore: [
'**.js',
'**.jsx',
'**.html',
'**.ts',
'**.tsx'
]
}
}
from: 'touchicon*.png',
context: path.resolve(__dirname, 'node_modules/@jellyfin/ux-web/favicons'),
to: 'favicons'
},
...Assets.map(asset => {
return {
from: path.resolve(__dirname, `node_modules/${asset}`),
to: 'libraries'
};
})
]
}),
new CopyPlugin({
patterns: Assets.map(asset => {
return {
from: path.resolve(__dirname, `./node_modules/${asset}`),
to: path.resolve(__dirname, './dist/libraries')
};
})
}),
// The libarchive.js worker-bundle is copied manually.
// If it is automatically bundled, escheck will fail since it uses import.meta.url.
new IgnorePlugin({
@ -139,7 +128,7 @@ const config = {
if (pathData.filename.startsWith('assets/') || pathData.filename.startsWith('themes/')) {
return '[path][base][query]';
}
return '[hash][ext][query]';
return '[name].[hash][ext][query]';
},
path: path.resolve(__dirname, 'dist'),
publicPath: ''
@ -359,7 +348,7 @@ const config = {
]
},
{
test: /\.(png|jpg|gif|svg)$/i,
test: /\.(ico|png|jpg|gif|svg)$/i,
type: 'asset/resource'
},
{