retro portable new pics and vids
@ -125,6 +125,14 @@
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<button class="button" onclick="window.location.href='/retro-portable'">
|
||||
<div class="button-inner">
|
||||
<span class="button-text">Retro Portable <br>
|
||||
Build Instructions
|
||||
</span>
|
||||
</div>
|
||||
</button>
|
||||
<br>
|
||||
<footer><i id="footer-text"></i></footer>
|
||||
<script>
|
||||
// Ladeanimation beim Laden der Seite anzeigen
|
||||
|
||||
@ -72,12 +72,31 @@
|
||||
.pre-text {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.footer-container {
|
||||
border-top: 2px solid #000; /* Eine 1px dicke, durchgezogene schwarze Linie */
|
||||
padding-top: 20px; /* Optional: Abstand zwischen Linie und Inhalt */
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<br>
|
||||
<img class="center-img" src="logo.png" alt="Logo" width="15%">
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<video controls width="25%" class="center-img" poster="videopic.jpg">
|
||||
<source src="video.mp4" type="video/mp4">
|
||||
</video>
|
||||
|
||||
<br>
|
||||
|
||||
<img src="pic1.jpg" alt="pic of the console" width="25%" class="center-img">
|
||||
|
||||
|
||||
|
||||
|
||||
<h2>
|
||||
Material:
|
||||
</h2>
|
||||
@ -173,3 +192,20 @@ Instructions:
|
||||
|
||||
</div>
|
||||
|
||||
<br>
|
||||
|
||||
<footer class="footer-container">
|
||||
Game played in the video: <a href="https://technik-freak.itch.io/minecraft-game-boy-technik-freak" >Minecraft Fan-Project by Technik Freak</a>
|
||||
|
||||
<br>
|
||||
|
||||
Music used in the video: Music by <a href="https://pixabay.com/de/users/hitslab-47305729/?utm_source=link-attribution&utm_medium=referral&utm_campaign=music&utm_content=270173">HitsLab</a> from <a href="https://pixabay.com/music//?utm_source=link-attribution&utm_medium=referral&utm_campaign=music&utm_content=270173">Pixabay</a>
|
||||
|
||||
|
||||
|
||||
</footer>
|
||||
|
||||
<br>
|
||||
|
||||
</html>
|
||||
|
||||
|
Before Width: | Height: | Size: 43 KiB After Width: | Height: | Size: 43 KiB |
BIN
retro-portable/pic1.jpg
Normal file
|
After Width: | Height: | Size: 166 KiB |
|
Before Width: | Height: | Size: 72 KiB After Width: | Height: | Size: 72 KiB |
|
Before Width: | Height: | Size: 1.6 MiB After Width: | Height: | Size: 1.6 MiB |
BIN
retro-portable/video.mp4
Normal file
BIN
retro-portable/videopic.jpg
Normal file
|
After Width: | Height: | Size: 234 KiB |
@ -1,61 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Retro Portable</title>
|
||||
<script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #1a1a1a;
|
||||
font-family: Arial, sans-serif;
|
||||
color: white;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-bottom: 20px;
|
||||
font-size: 2em;
|
||||
color: #f0f0f0;
|
||||
text-shadow: 0 0 5px #666;
|
||||
}
|
||||
|
||||
model-viewer {
|
||||
width: 80vw;
|
||||
height: 80vh;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
|
||||
border-radius: 12px;
|
||||
background-color: #222;
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
margin-top: 12px;
|
||||
font-size: 0.95em;
|
||||
color: #ccc;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Retro Portable</h1>
|
||||
|
||||
<model-viewer
|
||||
src="RetroPortable.glb"
|
||||
alt="Retro Portable"
|
||||
auto-rotate
|
||||
camera-controls
|
||||
interaction-prompt="none"
|
||||
ar
|
||||
shadow-intensity="1.5"
|
||||
exposure="0.75"
|
||||
environment-image="neutral"
|
||||
tone-mapping="commerce"
|
||||
></model-viewer>
|
||||
|
||||
<div class="tooltip">🔄 Click and drag to rotate the model. Use the mouse wheel to zoom.</div>
|
||||
</body>
|
||||
</html>
|
||||