organize files, parse description from markdown, video handling

This commit is contained in:
2024-02-19 16:36:55 +01:00
parent adf5e42828
commit 73e4ea148c
8 changed files with 95 additions and 45 deletions
+8 -13
View File
@@ -5,7 +5,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome to Tooloop OS</title>
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
@@ -15,15 +15,12 @@
<template id="slide-template">
<div class="slide">
<section class="image"></section>
<section class="description">
<h1></h1>
<p></p>
</section>
<section class="description"></section>
</div>
</template>
<nav>
<button class="slide-button previous" onclick="slider.previous(); slider.stop();">
<button class="slide-button previous" onclick="slider.previous();">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-chevron-left" width="24"
height="24" viewBox="0 0 24 24" stroke-width="1.5" fill="none" stroke-linecap="miter"
stroke-linejoin="miter">
@@ -32,7 +29,7 @@
</svg>
</button>
<button class="slide-button next" onclick="slider.next(); slider.stop();">
<button class="slide-button next" onclick="slider.next();">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-chevron-right" width="24"
height="24" viewBox="0 0 24 24" stroke-width="1.5" fill="none" stroke-linecap="miter"
stroke-linejoin="miter">
@@ -43,8 +40,7 @@
<button class="close-button" onclick="window.close();">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-x" width="24" height="24"
viewBox="0 0 24 24" stroke-width="1.5" fill="none" stroke-linecap="round"
stroke-linejoin="round">
viewBox="0 0 24 24" stroke-width="1.5" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M18 6l-12 12" />
<path d="M6 6l12 12" />
@@ -52,13 +48,12 @@
</button>
</nav>
<script src="js/marked.min.js"></script>
<script src="slides/slides.js"></script>
<script src="Slider.js"></script>
<script src="js/Slider.js"></script>
<script>
var slider = new Slider("#slider", "#slide-template", slides, 12000);
// var scale = document.querySelector("html").clientWidth > 1920 ? 2.0 : 1.0;
// document.querySelector(':root').style.setProperty("--scale", scale);
var slider = new Slider("#slider", "#slide-template", slides, 8000);
</script>
</body>