v1.2.0-beta/website 404 and remove old
This commit is contained in:
+2
-61
@@ -1,69 +1,10 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<link rel="apple-touch-icon" sizes="57x57" href="apple-icon-57x57.png" />
|
<meta http-equiv="refresh" content="0; URL='./'" />
|
||||||
<link rel="apple-touch-icon" sizes="60x60" href="apple-icon-60x60.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="72x72" href="apple-icon-72x72.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="76x76" href="apple-icon-76x76.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="114x114" href="apple-icon-114x114.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="120x120" href="apple-icon-120x120.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="144x144" href="apple-icon-144x144.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="152x152" href="apple-icon-152x152.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="180x180" href="apple-icon-180x180.png" />
|
|
||||||
<link rel="icon" type="image/png" sizes="192x192" href="android-icon-192x192.png" />
|
|
||||||
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png" />
|
|
||||||
<link rel="icon" type="image/png" sizes="96x96" href="favicon-96x96.png" />
|
|
||||||
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png" />
|
|
||||||
<link rel="manifest" href="manifest.json" />
|
|
||||||
<meta name="msapplication-TileImage" content="ms-icon-144x144.png" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="font.css" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="style.css" />
|
|
||||||
<title>Watch Party | 404</title>
|
<title>Watch Party | 404</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<section>
|
Redirecting...
|
||||||
<div class="page" style="background-color: rgba(0, 0, 0, 0.7);">
|
|
||||||
<a class="cta-container" href="https://chrome.google.com/webstore/category/extensions">
|
|
||||||
<mark class="cta">
|
|
||||||
That page doesn't exist, but you can still get the Chrome Extension.
|
|
||||||
</mark>
|
|
||||||
</a>
|
|
||||||
<a href="https://chrome.google.com/webstore/category/extensions" class="title">
|
|
||||||
<span>
|
|
||||||
WATCH PARTY
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
<a class="cta-container support" href="https://www.chromewatchparty.com" target="_self">
|
|
||||||
<mark class="cta">
|
|
||||||
▶ Go To Home ◀
|
|
||||||
</mark>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<footer>
|
|
||||||
<div>
|
|
||||||
<span class="full">© Ayushya Amitabh, 2020</span>
|
|
||||||
<span
|
|
||||||
>Built with ❤️ for <a href="https://www.google.com/chrome/">Google Chrome</a> using
|
|
||||||
<a href="https://firebase.google.com/">Firebase</a>,
|
|
||||||
<a href="https://material-ui.com/">Material-UI</a>,
|
|
||||||
<a href="https://reactjs.org/">React JS </a>&
|
|
||||||
<a href="https://nodejs.org/en/">Node.js</a>.</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<span class="full">
|
|
||||||
<a>
|
|
||||||
<mark>Get Chrome Extension</mark>
|
|
||||||
</a>
|
|
||||||
</span>
|
|
||||||
<span>
|
|
||||||
Help keep Watch Party free -
|
|
||||||
<a>
|
|
||||||
<mark>Support Watch Party</mark>
|
|
||||||
</a>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -1,158 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<link rel="apple-touch-icon" sizes="57x57" href="apple-icon-57x57.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="60x60" href="apple-icon-60x60.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="72x72" href="apple-icon-72x72.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="76x76" href="apple-icon-76x76.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="114x114" href="apple-icon-114x114.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="120x120" href="apple-icon-120x120.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="144x144" href="apple-icon-144x144.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="152x152" href="apple-icon-152x152.png" />
|
|
||||||
<link rel="apple-touch-icon" sizes="180x180" href="apple-icon-180x180.png" />
|
|
||||||
<link rel="icon" type="image/png" sizes="192x192" href="android-icon-192x192.png" />
|
|
||||||
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png" />
|
|
||||||
<link rel="icon" type="image/png" sizes="96x96" href="favicon-96x96.png" />
|
|
||||||
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png" />
|
|
||||||
<link rel="manifest" href="manifest.json" />
|
|
||||||
<meta name="msapplication-TileImage" content="ms-icon-144x144.png" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="font.css" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="style.css" />
|
|
||||||
<title>Watch Party</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<section>
|
|
||||||
<div class="page">
|
|
||||||
<!-- <a class="cta-container" href="http://get.chromewatchparty.com">
|
|
||||||
<mark class="cta">
|
|
||||||
Get Chrome Extension. It's Free.
|
|
||||||
</mark>
|
|
||||||
</a> -->
|
|
||||||
|
|
||||||
<a class="cta-container request" href="./beta/#request">
|
|
||||||
<mark class="cta">
|
|
||||||
Request Beta Access
|
|
||||||
</mark>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="title">
|
|
||||||
<span>
|
|
||||||
WATCH PARTY
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
<a class="cta-container support" href="https://www.paypal.me/Ayushya">
|
|
||||||
<mark class="cta">
|
|
||||||
Support Watch Party
|
|
||||||
</mark>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section data-page="2">
|
|
||||||
<div class="page">
|
|
||||||
<img src="./intro.gif" alt="Watch Party Intro" />
|
|
||||||
<p>
|
|
||||||
Watch your favorites on Netflix, Disney+, Amazon Prime, & Hulu (Beta) with your favorite
|
|
||||||
people
|
|
||||||
</p>
|
|
||||||
<mark>More Coming Soon.</mark>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section data-page="3">
|
|
||||||
<div class="page">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col image">
|
|
||||||
<img src="./hideable.gif" alt="No time sync" />
|
|
||||||
</div>
|
|
||||||
<div class="col text">
|
|
||||||
Hide the chat - focus on the show, <br />
|
|
||||||
while staying synced. <br />
|
|
||||||
Built to not be in your way but, <br />
|
|
||||||
also be there when you need it.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col text left">
|
|
||||||
No signup or login required.<br />
|
|
||||||
Just ready to go.
|
|
||||||
</div>
|
|
||||||
<div class="col image">
|
|
||||||
<img src="./noauth.gif" alt="No time sync" />
|
|
||||||
</div>
|
|
||||||
<div class="col text right">
|
|
||||||
No signup or login required. Just ready to go.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col image">
|
|
||||||
<img src="./beforeorafter.gif" alt="No time sync" />
|
|
||||||
</div>
|
|
||||||
<div class="col text">
|
|
||||||
Start the party before the show, <br />
|
|
||||||
or after the show. <br />
|
|
||||||
Just do what you want.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col text left">
|
|
||||||
What happens in Watch Party, <br />
|
|
||||||
stays in Watch Party -<br />
|
|
||||||
for 24 hours - then it's gone.
|
|
||||||
</div>
|
|
||||||
<div class="col image">
|
|
||||||
<img src="./timed.gif" alt="No time sync" />
|
|
||||||
</div>
|
|
||||||
<div class="col text right">
|
|
||||||
What happens in Watch Party, stays in Watch Party - for 24 hours - then it's gone.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row">
|
|
||||||
<div class="col image">
|
|
||||||
<img src="./track.jpeg" alt="No time sync" />
|
|
||||||
</div>
|
|
||||||
<div class="col text">
|
|
||||||
Know when your friends pause and play
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col text left">
|
|
||||||
When words aren't enough, <br />
|
|
||||||
use a GIF from Giphy
|
|
||||||
</div>
|
|
||||||
<div class="col image">
|
|
||||||
<img src="./giphy.gif" alt="No time sync" />
|
|
||||||
</div>
|
|
||||||
<div class="col text right">
|
|
||||||
When words aren't enough use a GIF from Giphy
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<footer>
|
|
||||||
<div>
|
|
||||||
<span class="full">© Ayushya Amitabh, 2020</span>
|
|
||||||
<span>
|
|
||||||
Built with ❤️ for
|
|
||||||
<a href="https://www.google.com/chrome/">Google Chrome</a>
|
|
||||||
using
|
|
||||||
<a href="https://firebase.google.com/">Firebase</a>,
|
|
||||||
<a href="https://material-ui.com/">Material-UI</a>,
|
|
||||||
<a href="https://reactjs.org/">React JS </a>,
|
|
||||||
<a href="https://nodejs.org/en/">Node.js </a>& <a href="https://giphy.com/"> Giphy</a>.
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<span class="full">
|
|
||||||
<a href="http://get.chromewatchparty.com">
|
|
||||||
<mark>Get Chrome Extension</mark>
|
|
||||||
</a>
|
|
||||||
</span>
|
|
||||||
<span>
|
|
||||||
Help keep Watch Party free -
|
|
||||||
<a href="https://www.paypal.me/Ayushya">
|
|
||||||
<mark>Support Watch Party</mark>
|
|
||||||
</a>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@@ -1,325 +0,0 @@
|
|||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
body {
|
|
||||||
height: 100vh;
|
|
||||||
background-color: black !important;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
text-decoration: none;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
section {
|
|
||||||
height: 100%;
|
|
||||||
background-image: url('./static.gif');
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: cover;
|
|
||||||
}
|
|
||||||
section > .page {
|
|
||||||
height: 100%;
|
|
||||||
background: linear-gradient(
|
|
||||||
0deg,
|
|
||||||
rgba(50, 50, 50, 0.8) 0%,
|
|
||||||
rgba(75, 75, 75, 0.5) 25%,
|
|
||||||
rgba(150, 150, 150, 0.2) 100%
|
|
||||||
);
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
B E T A P A G E
|
|
||||||
*/
|
|
||||||
|
|
||||||
.beta-body a.title {
|
|
||||||
font-size: 2rem;
|
|
||||||
}
|
|
||||||
.beta-body .cta {
|
|
||||||
font-size: 0.75rem;
|
|
||||||
}
|
|
||||||
.beta-body footer * {
|
|
||||||
font-size: 1rem;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
.beta-body footer {
|
|
||||||
padding: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cta {
|
|
||||||
font-size: 1rem;
|
|
||||||
font-family: 'GlacialBold';
|
|
||||||
background-color: black;
|
|
||||||
color: #c0f300;
|
|
||||||
padding: 0.5rem 1rem;
|
|
||||||
letter-spacing: 0.2rem;
|
|
||||||
transition: all ease-in-out 0.3s;
|
|
||||||
}
|
|
||||||
.title {
|
|
||||||
text-align: center;
|
|
||||||
color: #c0f300;
|
|
||||||
font-size: 3.5rem;
|
|
||||||
padding: 1rem 5rem;
|
|
||||||
border: 5px solid black;
|
|
||||||
border-radius: 5rem;
|
|
||||||
margin: 2rem 0;
|
|
||||||
transition: all ease-in-out 0.3s;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.title > span {
|
|
||||||
filter: drop-shadow(-10px 10px 0px black);
|
|
||||||
}
|
|
||||||
.title:hover {
|
|
||||||
background-color: black;
|
|
||||||
}
|
|
||||||
section[data-page='2'] .page {
|
|
||||||
background: linear-gradient(
|
|
||||||
0deg,
|
|
||||||
rgba(0, 0, 0, 1) 0%,
|
|
||||||
rgba(43, 43, 43, 1) 65%,
|
|
||||||
rgba(50, 50, 50, 0.8) 100%
|
|
||||||
);
|
|
||||||
}
|
|
||||||
section[data-page='2'] .page img {
|
|
||||||
width: 95%;
|
|
||||||
margin: 0 auto;
|
|
||||||
height: auto;
|
|
||||||
border-radius: 2rem;
|
|
||||||
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8);
|
|
||||||
margin-bottom: 2rem;
|
|
||||||
}
|
|
||||||
section[data-page='2'] .page p {
|
|
||||||
font-family: 'Glacial';
|
|
||||||
font-size: 3rem;
|
|
||||||
word-break: keep-all;
|
|
||||||
word-wrap: break-word;
|
|
||||||
max-width: 95%;
|
|
||||||
text-align: center;
|
|
||||||
margin-bottom: 2rem;
|
|
||||||
color: white;
|
|
||||||
padding: 2px 0;
|
|
||||||
}
|
|
||||||
section[data-page='2'] .page mark {
|
|
||||||
font-family: 'GlacialBold';
|
|
||||||
padding: 2.5px 10px;
|
|
||||||
font-size: 2rem;
|
|
||||||
background-color: black;
|
|
||||||
color: #c0f300;
|
|
||||||
}
|
|
||||||
section[data-page='3'] {
|
|
||||||
height: fit-content;
|
|
||||||
}
|
|
||||||
section[data-page='3'] .page {
|
|
||||||
background: black;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
section[data-page='3'] .page * {
|
|
||||||
color: #c0f300;
|
|
||||||
font-family: 'Glacial';
|
|
||||||
}
|
|
||||||
section[data-page='2']#request {
|
|
||||||
height: fit-content;
|
|
||||||
}
|
|
||||||
#powered {
|
|
||||||
font-size: 1rem !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.row {
|
|
||||||
margin: 0 auto;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-bottom: 0;
|
|
||||||
width: 65%;
|
|
||||||
}
|
|
||||||
.col.text {
|
|
||||||
padding: 2rem 0;
|
|
||||||
text-align: center;
|
|
||||||
color: white !important;
|
|
||||||
flex: 1;
|
|
||||||
font-size: 1.7rem;
|
|
||||||
}
|
|
||||||
.col.image {
|
|
||||||
padding: 0;
|
|
||||||
justify-self: center;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
.col img {
|
|
||||||
width: 100%;
|
|
||||||
height: auto;
|
|
||||||
margin: 4rem 0 2rem 0;
|
|
||||||
position: relative;
|
|
||||||
border-radius: 1.5rem;
|
|
||||||
}
|
|
||||||
.col.text.left {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
footer {
|
|
||||||
padding: 2.5rem 4rem;
|
|
||||||
background-color: black;
|
|
||||||
}
|
|
||||||
footer,
|
|
||||||
footer * {
|
|
||||||
font-size: 1rem;
|
|
||||||
line-height: 2.5rem;
|
|
||||||
color: white;
|
|
||||||
font-family: 'Glacial';
|
|
||||||
}
|
|
||||||
footer > div {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: flex-start;
|
|
||||||
flex-direction: column;
|
|
||||||
margin-bottom: 15px;
|
|
||||||
}
|
|
||||||
footer > div > span.full {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
footer mark {
|
|
||||||
background-color: #c0f300;
|
|
||||||
color: black;
|
|
||||||
padding: 2.5px 7px;
|
|
||||||
}
|
|
||||||
footer > div > span.full {
|
|
||||||
line-height: 2.5rem;
|
|
||||||
}
|
|
||||||
.support,
|
|
||||||
.request {
|
|
||||||
transition: all ease-in-out 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (min-width: 1360px) {
|
|
||||||
.cta {
|
|
||||||
font-size: 1rem;
|
|
||||||
}
|
|
||||||
.stickied {
|
|
||||||
z-index: 9999;
|
|
||||||
}
|
|
||||||
.support {
|
|
||||||
display: none;
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
.support.stickied .cta {
|
|
||||||
letter-spacing: 0rem;
|
|
||||||
}
|
|
||||||
.support.stickied {
|
|
||||||
position: fixed;
|
|
||||||
top: 2rem;
|
|
||||||
right: 2rem;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
.request.stickied .cta {
|
|
||||||
letter-spacing: 0rem;
|
|
||||||
}
|
|
||||||
.request.stickied {
|
|
||||||
position: fixed;
|
|
||||||
top: 2rem;
|
|
||||||
right: 2rem;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
.beta-body a.title,
|
|
||||||
.title {
|
|
||||||
font-size: 5rem;
|
|
||||||
}
|
|
||||||
.title.stickied {
|
|
||||||
position: fixed;
|
|
||||||
top: 1rem;
|
|
||||||
left: 1rem;
|
|
||||||
margin: 0;
|
|
||||||
font-size: 1rem !important;
|
|
||||||
padding: 0.5rem 1.5rem;
|
|
||||||
background: black;
|
|
||||||
}
|
|
||||||
section[data-page='2'] .page img {
|
|
||||||
width: 55%;
|
|
||||||
}
|
|
||||||
section[data-page='2'] .page p {
|
|
||||||
max-width: 55%;
|
|
||||||
font-size: 1.5rem;
|
|
||||||
}
|
|
||||||
section[data-page='2'] .page mark {
|
|
||||||
font-size: 1rem;
|
|
||||||
}
|
|
||||||
section[data-page='3'] .page {
|
|
||||||
padding-top: 15rem;
|
|
||||||
}
|
|
||||||
.row {
|
|
||||||
margin: 0 auto;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
width: 65%;
|
|
||||||
margin-bottom: 5rem;
|
|
||||||
border-bottom: none;
|
|
||||||
}
|
|
||||||
.col.text {
|
|
||||||
color: #909090 !important;
|
|
||||||
flex: 1;
|
|
||||||
padding-left: 5rem;
|
|
||||||
font-size: 1.3rem;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.col.text.right {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.col.text.left {
|
|
||||||
display: flex;
|
|
||||||
text-align: right;
|
|
||||||
justify-content: flex-end;
|
|
||||||
padding-left: 0;
|
|
||||||
padding-right: 5rem;
|
|
||||||
}
|
|
||||||
.col img {
|
|
||||||
width: auto;
|
|
||||||
height: 20rem;
|
|
||||||
position: relative;
|
|
||||||
border-radius: 1.5rem;
|
|
||||||
}
|
|
||||||
.col.image {
|
|
||||||
padding: 0;
|
|
||||||
justify-self: center;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
.beta-body footer > div,
|
|
||||||
footer > div {
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
.beta-body footer > div > span,
|
|
||||||
footer > div > span {
|
|
||||||
line-height: initial;
|
|
||||||
}
|
|
||||||
.beta-body footer *,
|
|
||||||
footer * {
|
|
||||||
font-size: 1rem;
|
|
||||||
line-height: normal;
|
|
||||||
}
|
|
||||||
.beta-body footer * {
|
|
||||||
line-height: 2.5rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media screen and (max-width: 1360px) and (min-width: 1024px) {
|
|
||||||
.beta-body a.title {
|
|
||||||
font-size: 5rem;
|
|
||||||
}
|
|
||||||
section[data-page='2'] .page img {
|
|
||||||
width: 75%;
|
|
||||||
}
|
|
||||||
section[data-page='2'] .page p {
|
|
||||||
font-size: 1.25rem;
|
|
||||||
}
|
|
||||||
section[data-page='2'] .page mark {
|
|
||||||
font-size: 1rem;
|
|
||||||
}
|
|
||||||
section[data-page='2']#request {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
.col.text {
|
|
||||||
font-size: 1.25rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user