Added DeviceTile

This commit is contained in:
aronmal 2023-10-18 02:08:11 +02:00
parent 19b075058e
commit 5ec6a19f09
Signed by: aronmal
GPG key ID: 816B7707426FC612
3 changed files with 55 additions and 200 deletions

View file

@ -0,0 +1,21 @@
import { Show } from "solid-js";
function DeviceTile(props: { href?: string; name: string; src: string }) {
return (
<a href={props.href ?? "soon.HTML"}>
<div class="raster">
<h3>{props.name}</h3>
<Show when={props.src.startsWith("/images")}>
<img src={props.src} alt={props.name} />
</Show>
<Show when={props.src.startsWith("/videos")}>
<video width="auto" height="auto" autoplay muted loop>
<source src={props.src} type="video/mp4" />
</video>
</Show>
</div>
</a>
);
}
export default DeviceTile;

View file

@ -1,4 +1,5 @@
import { Link, Meta, Title, useNavigate } from "solid-start";
import DeviceTile from "~/components/DeviceTile";
function UEberblickDE() {
const navigate = useNavigate();
@ -730,121 +731,37 @@ function UEberblickDE() {
.
</p>
<a href="/KSS22DE">
<div class="raster">
<h3>Kingsong S22</h3>
<video width="auto" height="auto" autoplay muted loop>
<source src="/videos/S20Werbevideo.mp4" type="video/mp4" />
</video>
</div>
</a>
<DeviceTile href="KSS22DE.html" name="Kingsong S22" src="/videos/S20Werbevideo.mp4" />
<a href="/soon">
<div class="raster">
<h3>Kingsong 16X</h3>
<img src="/images/KS16X.jpg" />
</div>
</a>
<DeviceTile name="Kingsong 16X" src="/images/KS16X.jpg" />
<a href="/soon">
<div class="raster">
<h3>Inmotion V8</h3>
<img src="/images/inmotionV8.jfif" />
</div>
</a>
<DeviceTile name="Inmotion V8" src="/images/inmotionV8.jfif" />
<a href="/soon">
<div class="raster">
<h3>Inmotion V10</h3>
<video width="auto" height="auto" autoplay muted loop>
<source src="/videos/V10.mp4" type="video/mp4" />
</video>
</div>
</a>
<DeviceTile name="Inmotion V10" src="/videos/V10.mp4" />
<a href="/soon">
<div class="raster">
<h3>Inmotion V11</h3>
<img src="/images/V11 2.jpg" />
</div>
</a>
<DeviceTile name="Inmotion V11" src="/images/V11 2.jpg" />
<a href="/soon">
<div class="raster">
<h3>Inmotion V12</h3>
<img src="/images/V12 2.jpg" />
</div>
</a>
<DeviceTile name="Inmotion V12" src="/images/V12 2.jpg" />
<a href="/soon">
<div class="raster">
<h3>Inmotion V13</h3>
<img src="/images/V13 2.jpg" />
</div>
</a>
<DeviceTile name="Inmotion V13" src="/images/V13 2.jpg" />
<a href="/soon">
<div class="raster">
<h3>Kingsong S18</h3>
<img src="/images/S18.jpg" />
</div>
</a>
<DeviceTile name="Kingsong S18" src="/images/S18.jpg" />
<a href="/soon">
<div class="raster">
<h3>Begode Master</h3>
<img src="/images/Master.jpg" />
</div>
</a>
<DeviceTile name="Begode Master" src="/images/Master.jpg" />
<a href="/soon">
<div class="raster">
<h3>Begode T4</h3>
<img src="/images/T4.jpg" />
</div>
</a>
<DeviceTile name="Begode T4" src="/images/T4.jpg" />
<a href="/soon">
<div class="raster">
<h3>Begode Mten4</h3>
<img src="/images/Mten4.jpg" />
</div>
</a>
<DeviceTile name="Begode Mten4" src="/images/Mten4.jpg" />
<a href="/soon">
<div class="raster">
<h3>Begode Master Pro</h3>
<img src="/images/Master Pro.jpg" />
</div>
</a>
<DeviceTile name="Begode Master Pro" src="/images/Master Pro.jpg" />
<a href="/soon">
<div class="raster">
<h3>Begode EX30</h3>
<img src="/images/EX30.jpg" />
</div>
</a>
<DeviceTile name="Begode EX30" src="/images/EX30.jpg" />
<a href="/soon">
<div class="raster">
<h3>Gotway Monster Pro</h3>
<img src="/images/MonsterPro.jpg" />
</div>
</a>
<DeviceTile name="Gotway Monster Pro" src="/images/MonsterPro.jpg" />
<a href="/soon">
<div class="raster">
<h3>Veteran Sherman</h3>
<img src="/images/moddedSherman1.jpg" />
</div>
</a>
<DeviceTile name="Veteran Sherman" src="/images/moddedSherman1.jpg" />
<a href="/soon">
<div class="raster">
<h3>Veteran Sherman S</h3>
<img src="/images/ShermanSepic.jpg" />
</div>
</a>
<DeviceTile name="Veteran Sherman S" src="/images/ShermanSepic.jpg" />
</div>
</article>
<footer></footer>

View file

@ -1,4 +1,5 @@
import { Link, Meta, Title, useNavigate } from "solid-start";
import DeviceTile from "~/components/DeviceTile";
function UEberblickENG() {
const navigate = useNavigate();
@ -772,121 +773,37 @@ function UEberblickENG() {
.
</p>
<a href="/KSS22ENG">
<div class="raster">
<h3>Kingsong S22</h3>
<video width="auto" height="auto" autoplay muted loop>
<source src="/videos/S20Werbevideo.mp4" type="video/mp4" />
</video>
</div>
</a>
<DeviceTile href="KSS22ENG.html" name="Kingsong S22" src="/videos/S20Werbevideo.mp4" />
<a href="/soon">
<div class="raster">
<h3>Kingsong 16X</h3>
<img src="/images/KS16X.jpg" />
</div>
</a>
<DeviceTile name="Kingsong 16X" src="/images/KS16X.jpg" />
<a href="/soon">
<div class="raster">
<h3>Inmotion V8</h3>
<img src="/images/inmotionV8.jfif" />
</div>
</a>
<DeviceTile name="Inmotion V8" src="/images/inmotionV8.jfif" />
<a href="/soon">
<div class="raster">
<h3>Inmotion V10</h3>
<video width="auto" height="auto" autoplay muted loop>
<source src="/videos/V10.mp4" type="video/mp4" />
</video>
</div>
</a>
<DeviceTile name="Inmotion V10" src="/videos/V10.mp4" />
<a href="/soon">
<div class="raster">
<h3>Inmotion V11</h3>
<img src="/images/V11 2.jpg" />
</div>
</a>
<DeviceTile name="Inmotion V11" src="/images/V11 2.jpg" />
<a href="/soon">
<div class="raster">
<h3>Inmotion V12</h3>
<img src="/images/V12 2.jpg" />
</div>
</a>
<DeviceTile name="Inmotion V12" src="/images/V12 2.jpg" />
<a href="/soon">
<div class="raster">
<h3>Inmotion V13</h3>
<img src="/images/V13 2.jpg" />
</div>
</a>
<DeviceTile name="Inmotion V13" src="/images/V13 2.jpg" />
<a href="/soon">
<div class="raster">
<h3>Kingsong S18</h3>
<img src="/images/S18.jpg" />
</div>
</a>
<DeviceTile name="Kingsong S18" src="/images/S18.jpg" />
<a href="/soon">
<div class="raster">
<h3>Begode Master</h3>
<img src="/images/Master.jpg" />
</div>
</a>
<DeviceTile name="Begode Master" src="/images/Master.jpg" />
<a href="/soon">
<div class="raster">
<h3>Begode T4</h3>
<img src="/images/T4.jpg" />
</div>
</a>
<DeviceTile name="Begode T4" src="/images/T4.jpg" />
<a href="/soon">
<div class="raster">
<h3>Begode Mten4</h3>
<img src="/images/Mten4.jpg" />
</div>
</a>
<DeviceTile name="Begode Mten4" src="/images/Mten4.jpg" />
<a href="/soon">
<div class="raster">
<h3>Begode Master Pro</h3>
<img src="/images/Master Pro.jpg" />
</div>
</a>
<DeviceTile name="Begode Master Pro" src="/images/Master Pro.jpg" />
<a href="/soon">
<div class="raster">
<h3>Begode EX30</h3>
<img src="/images/EX30.jpg" />
</div>
</a>
<DeviceTile name="Begode EX30" src="/images/EX30.jpg" />
<a href="/soon">
<div class="raster">
<h3>Gotway Monster Pro</h3>
<img src="/images/MonsterPro.jpg" />
</div>
</a>
<DeviceTile name="Gotway Monster Pro" src="/images/MonsterPro.jpg" />
<a href="/soon">
<div class="raster">
<h3>Veteran Sherman</h3>
<img src="/images/moddedSherman1.jpg" />
</div>
</a>
<DeviceTile name="Veteran Sherman" src="/images/moddedSherman1.jpg" />
<a href="/soon">
<div class="raster">
<h3>Veteran Sherman S</h3>
<img src="/images/ShermanSepic.jpg" />
</div>
</a>
<DeviceTile name="Veteran Sherman S" src="/images/ShermanSepic.jpg" />
</div>
</article>
<footer></footer>