add frontpage
This commit is contained in:
Albatroz Jeremias
parent
73f7698aeb
commit
036160a0a3
|
|
@ -0,0 +1,202 @@
|
|||
<head>
|
||||
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" rel="stylesheet" />
|
||||
<link href="https://vjs.zencdn.net/7.6.6/video-js.css" rel="stylesheet" />
|
||||
|
||||
<!-- If you'd like to support IE8 (for Video.js versions prior to v7) -->
|
||||
<script src="https://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js"></script>
|
||||
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
|
||||
<title>PTRevolutionTV LiveStream!</title>
|
||||
<meta name="theme-color" content="#563d7c">
|
||||
<style>
|
||||
.bd-placeholder-img {
|
||||
font-size: 1.125rem;
|
||||
text-anchor: middle;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.bd-placeholder-img-lg {
|
||||
font-size: 3.5rem;
|
||||
}
|
||||
}
|
||||
/*
|
||||
* Globals
|
||||
*/
|
||||
|
||||
/* Links */
|
||||
a,
|
||||
a:focus,
|
||||
a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* Custom default button */
|
||||
.btn-secondary,
|
||||
.btn-secondary:hover,
|
||||
.btn-secondary:focus {
|
||||
color: #333;
|
||||
text-shadow: none; /* Prevent inheritance from `body` */
|
||||
background-color: #fff;
|
||||
border: .05rem solid #fff;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Base structure
|
||||
*/
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
background-color: #333;
|
||||
}
|
||||
|
||||
body {
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
color: #fff;
|
||||
text-shadow: 0 .05rem .1rem rgba(0, 0, 0, .5);
|
||||
box-shadow: inset 0 0 5rem rgba(0, 0, 0, .5);
|
||||
}
|
||||
|
||||
.cover-container {
|
||||
max-width: 42em;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Header
|
||||
*/
|
||||
.masthead {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.masthead-brand {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.nav-masthead .nav-link {
|
||||
padding: .25rem 0;
|
||||
font-weight: 700;
|
||||
color: rgba(255, 255, 255, .5);
|
||||
background-color: transparent;
|
||||
border-bottom: .25rem solid transparent;
|
||||
}
|
||||
|
||||
.nav-masthead .nav-link:hover,
|
||||
.nav-masthead .nav-link:focus {
|
||||
border-bottom-color: rgba(255, 255, 255, .25);
|
||||
}
|
||||
|
||||
.nav-masthead .nav-link + .nav-link {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.nav-masthead .active {
|
||||
color: #fff;
|
||||
border-bottom-color: #fff;
|
||||
}
|
||||
|
||||
@media (min-width: 48em) {
|
||||
.masthead-brand {
|
||||
float: left;
|
||||
}
|
||||
.nav-masthead {
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Cover
|
||||
*/
|
||||
.cover {
|
||||
padding: 0 1.5rem;
|
||||
}
|
||||
.cover .btn-lg {
|
||||
padding: .75rem 1.25rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Footer
|
||||
*/
|
||||
.mastfoot {
|
||||
color: rgba(255, 255, 255, .5);
|
||||
float:right;
|
||||
}
|
||||
.video-section{
|
||||
padding:20px;
|
||||
}
|
||||
|
||||
.topimage{
|
||||
padding:20px;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="row topimage">
|
||||
<div class="col-lg-1">
|
||||
</div>
|
||||
<div class="col-lg-10 col-sm-12">
|
||||
<img class="img-fluid" src="https://social.coletivos.org/system/accounts/headers/000/123/980/original/39703ff0055ba064.jpg?1576683094">
|
||||
</div>
|
||||
<div class="col-lg-1">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<section class="content-section video-section">
|
||||
|
||||
<div class="row text-center">
|
||||
<div class="col-lg-1">
|
||||
</div>
|
||||
<div class="col-lg-8 col-sm-12">
|
||||
<p class="lead">
|
||||
<video id="myvideo" class="video-js vjs-default-skin vjs-16-9" controls
|
||||
preload="auto" width="640" height="264" poster="https://social.coletivos.org/system/accounts/avatars/000/123/980/original/878ee77f3441f38e.png?1576683094"
|
||||
data-setup="{'liveui': true, 'fluid': true}">
|
||||
<source src="/live/live.m3u8"/>
|
||||
</video>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-lg-1">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-1">
|
||||
</div>
|
||||
<div class="col-lg-10 col-sm-12">
|
||||
<nav class="nav nav-masthead justify-content-center">
|
||||
<a class="nav-link" href="#">Youtube</a>
|
||||
<a class="nav-link" href="#">Facebook</a>
|
||||
<a class="nav-link" href="https://social.coletivos.org/@ptrevolutiontv">Mastodon</a>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="col-lg-1">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<footer class="mastfoot mt-auto">
|
||||
<div class="inner">
|
||||
<p>Powered by <a href="https://coletivos.org">coletivos.org</a> with <3</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<script src="https://vjs.zencdn.net/7.6.6/video.js"></script>
|
||||
</body>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue