youtube embed component, libreevent page

This commit is contained in:
2024-08-30 11:22:06 +02:00
parent f70b846a40
commit 242ec159a2
11 changed files with 175 additions and 232 deletions

View File

@@ -0,0 +1,82 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- CSS -->
<link rel="stylesheet" href="https://static.janishutz.com/css/slider.css">
<link rel="stylesheet" href="/css/style.css">
<!-- SEO -->
<title>libreevent - free and open source event management solution | janishutz.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="og:title" content="" />
<meta name="og:description" content="" />
<meta name="og:image" content="https://static.janishutz.com/seo/home-card.jpg" />
<meta name="og:type" content="website" />
<meta name="og:url" content="https://janishutz.com" />
<meta name="og:locale" content="en_GB" />
<meta property="twitter:card" content="summary_large_image">
<meta name="theme-color" content="#152b5c">
<style>
#yt-embed {
width: 70vw;
height: 40vw;
}
</style>
</head>
<body>
<nav></nav>
<div class="slider" style="width: 100vw; height: 80vh;">
<div class="slider-container">
<div class="slider-element" style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-title.jpg' );">
<a href="https://libreevent.janishutz.com" class="button" style="margin-top: 30%;">Project Website</a>
</div>
<div class="slider-element" style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-admin-eventsettings.jpg' );">
<h1>Create Events with Ease</h1>
<p>Using the libreevent's powerful admin panel</p>
<a href="https://libreevent.janishutz.com/docs/admin-panel/" class="button">Docs</a>
</div>
<div class="slider-element" style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-admin-seatplan-editor.jpg' );">
<h1>Create seat plans</h1>
<p>libreevent's seat plan editor is designed to make this as easy as possible</p>
<a href="https://libreevent.janishutz.com/docs/admin-panel/seatplan-editor" class="button">Docs</a>
</div>
<div class="slider-element" style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-all-events.jpg' );">
<h1>Order Tickets</h1>
<p>on this page and give users all important data</p>
<a href="https://libreevent.janishutz.com/download" class="button">Install today</a>
</div>
<div class="slider-element" style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-login.jpg' );">
<h1>User Accounts</h1>
<p>Your customers can do everything in self-service!</p>
<a href="https://libreevent.janishutz.com/download" class="button">Install today</a>
</div>
<div class="slider-element" style="background-image: url( 'https://store-cdn.janishutz.com/assets/libreevent/libreevent-ticket-sel.jpg' );">
<h1>Open Source Project</h1>
<p>Free Software, developed by Janis Hutz & the community</p>
<a href="https://libreevent.janishutz.com" class="button">Learn more about libreevent</a>
</div>
</div>
<div class="slider-controls slider-control-left" onclick="sliderControl( 'previous' )">&#11164;</div>
<div class="slider-controls slider-control-right" onclick="sliderControl( 'next' )">&#11166;</div>
</div>
<div id="yt-embed"></div>
<footer></footer>
<script src="https://static.janishutz.com/js/yt-embed.js"></script>
<script src="https://static.janishutz.com/js/slider.js"></script>
<script>
YTEmbed( 'yt-embed', 'UYMa-xTyZYo' );
activateSlider( 7500 );
</script>
</body>
</html>