-
Notifications
You must be signed in to change notification settings - Fork 54
/
Copy pathindex.html
101 lines (97 loc) · 4.27 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<!DOCTYPE html>
<html>
<head>
<title><%= process.env.VRCA_PRODUCT_NAME %></title>
<meta charset="utf-8">
<meta name="description" content="<%= process.env.VRCA_PRODUCT_DESCRIPTION %>">
<meta name="keywords" content="<%= process.env.VRCA_PRODUCT_KEYWORDS %>" />
<meta name="author" content="Vircadia Contributors" />
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width<% if (ctx.mode.cordova || ctx.mode.capacitor) { %>, viewport-fit=cover<% } %>">
<link rel="apple-touch-icon" sizes="180x180" href="/icons/apple-touch-icon.png?v=1.0.0">
<link rel="icon" type="image/png" sizes="32x32" href="/icons/favicon-32x32.png?v=1.0.0">
<link rel="icon" type="image/png" sizes="192x192" href="/icons/android-chrome-192x192.png?v=1.0.0">
<link rel="icon" type="image/png" sizes="16x16" href="/icons/favicon-16x16.png?v=1.0.0">
<link rel="shortcut icon" href="/icons/favicon.ico?v=1.0.0">
<link rel="mask-icon" href="/icons/safari-pinned-tab.svg?v=1.0.0" color="#0c71c3">
<link rel="manifest" href="/icons/site.webmanifest?v=1.0.0">
<meta name="apple-mobile-web-app-title" content="<% process.env.VRCA_PRODUCT_NAME %>">
<meta name="application-name" content="<% process.env.VRCA_PRODUCT_NAME %>">
<meta name="msapplication-TileColor" content="<% process.env.VRCA_COLORS_PRIMARY %>">
<meta name="msapplication-config" content="/icons/browserconfig.xml?v=1.0.0">
<meta name="theme-color" content="<% process.env.VRCA_COLORS_PRIMARY %>">
<meta property="og:title" content="<%= process.env.VRCA_PRODUCT_NAME %>" />
<meta property="og:site_name" content="<%= process.env.VRCA_BRAND_NAME %>" />
<meta property="og:description" content="<%= process.env.VRCA_PRODUCT_DESCRIPTION %>" />
<meta property="og:type" content="website" />
<meta property="og:image" content="<%= process.env.VRCA_BANNER %>" />
<meta property="og:image:alt" content="<%= process.env.VRCA_BANNER_ALT %>" />
<meta property="og:url" content="<%= process.env.VRCA_HOSTED_URL %>" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@vircadia" />
<meta name="twitter:title" content="<%= process.env.VRCA_PRODUCT_NAME %>" />
<meta name="twitter:description" content="<%= process.env.VRCA_PRODUCT_DESCRIPTION %>" />
<meta name="twitter:image" content="<%= process.env.VRCA_BANNER %>" />
<meta name="twitter:image:alt" content="<%= process.env.VRCA_BANNER_ALT %>" />
<style>
html {
background-color: black;
}
#preloader {
position: fixed;
z-index: 0;
inset: 0;
display: block;
background-color: black;
opacity: 1;
transition: 0.2s ease opacity;
}
#preloader::before {
content: '';
position: absolute;
right: 0.5rem;
bottom: 0.5rem;
display: block;
width: 1.2rem;
height: 1.2rem;
box-sizing: border-box;
border: 0.2rem solid white;
border-right-color: transparent;
border-radius: 50%;
-webkit-mask-image: linear-gradient(180deg, #000 30%, transparent 78%);
mask-image: linear-gradient(180deg, #000 30%, transparent 78%);
transform-origin: center;
animation: preloaderSpinner 0.8s linear infinite;
}
@keyframes preloaderSpinner {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
#preloader > video {
width: 100%;
height: 100%;
object-fit: contain;
margin: auto;
animation: preloaderFadeOut 9s ease forwards;
}
@keyframes preloaderFadeOut {
0% { opacity: 1; }
95% { opacity: 1; }
100% { opacity: 0; }
}
#preloader.hide {
opacity: 0;
}
#preloader.hide::before {
animation: unset;
}
</style>
</head>
<body>
<div id="preloader">
<video src="<%= process.env.VRCA_INTRO %>" autoplay></video>
</div>
<!-- quasar:entry-point -->
</body>
</html>