jellyfin-web/src/index.html

163 lines
8.2 KiB
HTML

<!DOCTYPE html>
<html class="preload" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover">
<link rel="manifest" href="manifest.json">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta http-equiv="X-UA-Compatibility" content="IE=Edge">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes">
<meta name="application-name" content="Jellyfin">
<meta name="robots" content="noindex, nofollow, noarchive">
<meta name="referrer" content="no-referrer">
<meta id="themeColor" name="theme-color" content="#202020">
<link rel="apple-touch-icon" sizes="180x180" href="touchicon.png">
<!-- iPhone 5 -->
<link href="assets/splash/iphone5_splash.png" media="screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" rel="apple-touch-startup-image" />
<link href="assets/splash/iphone5_splash_l.png" media="screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" rel="apple-touch-startup-image" />
<!-- iPhone 6, 6S, 7 and 8 -->
<link href="assets/splash/iphone6_splash.png" media="screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" rel="apple-touch-startup-image" />
<link href="assets/splash/iphone6_splash_l.png" media="screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" rel="apple-touch-startup-image" />
<!-- iPhone 6+, 7+ and 8+ -->
<link href="assets/splash/iphoneplus_splash.png" media="screen and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" rel="apple-touch-startup-image" />
<link href="assets/splash/iphoneplus_splash_l.png" media="screen and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" rel="apple-touch-startup-image" />
<!-- iPhone X -->
<link href="assets/splash/iphonex_splash.png" media="screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" rel="apple-touch-startup-image" />
<link href="assets/splash/iphonex_splash_l.png" media="screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" rel="apple-touch-startup-image" />
<!-- iPhone Xr -->
<link href="assets/splash/iphonexr_splash.png" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" rel="apple-touch-startup-image" />
<link href="assets/splash/iphonexr_splash_l.png" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" rel="apple-touch-startup-image" />
<!-- iPhone Xs -->
<link href="assets/splash/iphonexsmax_splash.png" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" rel="apple-touch-startup-image" />
<link href="assets/splash/iphonexsmax_splash_l.png" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape)" rel="apple-touch-startup-image" />
<!-- iPad -->
<link href="assets/splash/ipad_splash.png" media="screen and (device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" rel="apple-touch-startup-image" />
<link href="assets/splash/ipad_splash_l.png" media="screen and (device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" rel="apple-touch-startup-image" />
<!-- iPad Pro 1 -->
<link href="assets/splash/ipadpro1_splash.png" media="screen and (device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" rel="apple-touch-startup-image" />
<link href="assets/splash/ipadpro1_splash_l.png" media="screen and (device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" rel="apple-touch-startup-image" />
<!-- iPad Pro 3 -->
<link href="assets/splash/ipadpro3_splash.png" media="screen and (device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" rel="apple-touch-startup-image" />
<link href="assets/splash/ipadpro3_splash_l.png" media="screen and (device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" rel="apple-touch-startup-image" />
<!-- iPad Pro 2 -->
<link href="assets/splash/ipadpro2_splash.png" media="screen and (device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" rel="apple-touch-startup-image" />
<link href="assets/splash/ipadpro2_splash_l.png" media="screen and (device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)" rel="apple-touch-startup-image" />
<link rel="shortcut icon" href="favicon.ico">
<meta name="msapplication-TileImage" content="touchicon144.png">
<meta name="msapplication-TileColor" content="#333333">
<title>Jellyfin</title>
<style>
.transparentDocument,
.backgroundContainer-transparent:not(.withBackdrop) {
background: none !important;
background-color: transparent !important;
}
.layout-tv .mouseIdle,
.layout-tv .mouseIdle button,
.layout-tv .mouseIdle select,
.layout-tv .mouseIdle input,
.layout-tv .mouseIdle textarea,
.layout-tv .mouseIdle a,
.layout-tv .mouseIdle label,
.transparentDocument .mouseIdle,
.transparentDocument .mouseIdle button,
.transparentDocument .mouseIdle select,
.transparentDocument .mouseIdle input,
.transparentDocument .mouseIdle textarea,
.transparentDocument .mouseIdle a,
.transparentDocument .mouseIdle label,
.screensaver-noScroll.mouseIdle,
.screensaver-noScroll.mouseIdle button,
.screensaver-noScroll.mouseIdle select,
.screensaver-noScroll.mouseIdle input,
.screensaver-noScroll.mouseIdle textarea,
.screensaver-noScroll.mouseIdle a,
.screensaver-noScroll.mouseIdle label {
cursor: none !important;
}
.preload {
background-color: #101010;
}
.hide,
.mouseIdle .hide-mouse-idle,
.mouseIdle-tv .hide-mouse-idle-tv {
display: none !important;
}
.mainDrawerHandle {
position: fixed;
top: 0;
bottom: 0;
z-index: 1;
width: 0.8em;
padding-left: env(safe-area-inset-left);
caret-color: transparent;
}
[dir="ltr"] .mainDrawerHandle {
left: 0;
}
[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">
<div id="reactRoot">
<div class="splashLogo"></div>
</div>
</body>
</html>