mirror of
https://github.com/jellyfin/jellyfin-vue.git
synced 2024-12-01 02:00:25 +00:00
88904dc64c
* Remove the animation, showing only the Vuetify's background colors for each color scheme. * Move all the splashscreen logic to App.vue, so we can hide the splashscreen only when suspense has finished resolving everything Signed-off-by: Fernando Fernández <ferferga@hotmail.com>
62 lines
1.6 KiB
HTML
62 lines
1.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" class="no-forced-scrollbar">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<link rel="icon" type="image/x-icon" href="/favicon.ico">
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover">
|
|
<meta name="mobile-web-app-capable" content="yes">
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
<style>
|
|
.light {
|
|
background: #f2f2f2;
|
|
}
|
|
|
|
.dark {
|
|
background: #111827;
|
|
}
|
|
|
|
.splashBackground {
|
|
position: absolute;
|
|
padding: 0;
|
|
margin: 0;
|
|
top: 0;
|
|
left: 0;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-size: 400% 400%;
|
|
z-index: 99999999;
|
|
}
|
|
|
|
.splashLogo {
|
|
width: 30%;
|
|
height: 30%;
|
|
/* This file is in the 'public' folder, so it will be placed at the root when the client is built */
|
|
background-image: url(/icon.png);
|
|
background-position: center center;
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
}
|
|
|
|
/* Class to apply when the load process is finished */
|
|
.loadFinished {
|
|
opacity: 0;
|
|
transition: opacity 0.75s linear;
|
|
}
|
|
</style>
|
|
<script type="module" src="src/splashscreen.ts"></script>
|
|
<script type="module" src="src/main.ts"></script>
|
|
<title>Jellyfin Vue</title>
|
|
</head>
|
|
<body>
|
|
<div class="splashBackground">
|
|
<div class="splashLogo"></div>
|
|
</div>
|
|
<div id="app"></div>
|
|
</body>
|
|
</html>
|