layout refact

This commit is contained in:
2026-01-29 20:47:18 +01:00
parent 44700d51cb
commit 27131b3029
10 changed files with 150 additions and 55 deletions
+1 -6
View File
@@ -2,12 +2,7 @@
<h1 class="my-4">Welcome</h1>
<p>
Welcome to Teletype Games! This site is dedicated to showcasing <strong>open-source indie games</strong>,
created with enthusiasm and as a hobby project.
</p>
<p>
Explore our collection of unique games, navigate using the top menu to access the <strong>Home</strong> page,
discover more <strong>Softwares</strong>, or check out our <strong>Youtube</strong> channel.
Welcome to Teletype Games! We are an independent, community-driven game development collective. Our mission is to create small, experimental, and full-fledged games in short development cycles while keeping everything open, transparent, and collaborative.
</p>
{{end}}
+21 -6
View File
@@ -20,9 +20,6 @@
<li class="nav-item">
<a class="nav-link" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/software">Softwares</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.youtube.com/@teletypegames" target="_blank">Youtube</a>
</li>
@@ -34,14 +31,32 @@
</div>
</header>
<div class="container mt-4 mb-4 content-border">
{{block "content" .}}{{end}}
<div class="container mt-4 mb-4">
<div class="row">
<div class="col-md-3">
<div class="content-border">
<ul class="list-group">
<li class="list-group-item disabled" aria-disabled="true">Softwares</li>
{{range .Softwares}}
<li class="list-group-item">
<a href="/software/{{.Software.Name}}">{{.Software.Name}}</a>
</li>
{{end}}
</ul>
</div>
</div>
<div class="col-md-9">
<div class="content-border p-3">
{{block "content" .}}{{end}}
</div>
</div>
</div>
</div>
<footer class="footer-border text-center py-3">
<p>
<a class="nav-link" href="http://teletype.hu" target="_blank">
Tasnádi Zsolt 2025
Teletype Games 2025-2026
</a>
</p>
</footer>
+2 -2
View File
@@ -4,9 +4,9 @@
<div class="row">
<div class="col-12 mb-4">
<ul>
{{range .}}
{{range .Softwares}}
<li>
<a href="/software/{{.Name}}">{{.Title}}</a>
<a href="/software/{{.Software.Name}}">{{.Software.Title}}</a>
</li>
{{end}}
</ul>
+56 -21
View File
@@ -1,35 +1,72 @@
{{define "content"}}
<h1 class="my-4">{{.Software.Title}}</h1>
<div class="row">
<div class="col-12 mb-4">
{{if .WebPlayableRelease}}
<div class="col-md-6 mb-4">
<div class="card h-100">
<div class="card-header">
<h3>Play</h3>
</div>
<div class="card-body">
<h5 class="card-title">{{.Software.Title}}</h5>
<h6 class="card-subtitle mb-2 text-muted">{{.Software.Author}}</h6>
<p class="card-text">{{.Software.Desc}}</p>
<p class="card-text"><strong>Version:</strong> {{.LatestRelease.Version}}</p>
<p class="card-text"><strong>License:</strong> {{.Software.License}}</p>
<p class="card-text"><a href="{{.Software.Site}}" target="_blank">Website</a></p>
<div class="ratio ratio-4x3" style="max-width: 960px; margin: 0 auto;">
<iframe id="gameFrame" src="/play/{{.Software.Name}}/{{.WebPlayableRelease.Version}}/content/index.html"
frameborder="0" allowfullscreen></iframe>
</div>
</div>
<div class="card-footer">
<div class="btn-group d-flex justify-content-center" role="group" aria-label="Game controls">
<button id="fullscreenButton" class="btn btn-secondary btn-sm">Fullscreen</button>
</div>
</div>
</div>
</div>
{{end}}
<div class="col-md-6 mb-4">
<div class="card h-100">
<div class="card-header">
<h3>Overview</h3>
</div>
<div class="card-body">
<table class="table table-bordered">
<tbody>
<tr>
<th scope="row" style="width: 30%;">Title</th>
<td>{{.Software.Title}}</td>
</tr>
<tr>
<th scope="row">Author</th>
<td>{{.Software.Author}}</td>
</tr>
<tr>
<th scope="row">Description</th>
<td>{{.Software.Desc}}</td>
</tr>
<tr>
<th scope="row">Version</th>
<td>{{.LatestRelease.Version}}</td>
</tr>
<tr>
<th scope="row">License</th>
<td>{{.Software.License}}</td>
</tr>
<tr>
<th scope="row">Website</th>
<td><a href="{{.Software.Site}}" target="_blank">{{.Software.Site}}</a></td>
</tr>
</tbody>
</table>
</div>
<div class="card-footer">
<div class="btn-group d-flex justify-content-end" role="group" aria-label="Operations">
<a href="/download/{{.Software.Name}}/source" class="btn btn-primary btn-sm">Source</a>
<a href="/download/{{.Software.Name}}/cartridge" class="btn btn-primary btn-sm">Cartridge</a>
<a href="/software/{{.Software.Name}}" class="btn btn-primary btn-sm">Releases</a>
<a href="/play/{{.Software.Name}}/{{.LatestRelease.Version}}" class="btn btn-primary btn-sm">Play</a>
</div>
</div>
</div>
</div>
</div>
{{if .WebPlayableRelease}}
<h3>Play</h3>
<div class="mb-4">
<div class="ratio ratio-4x3" style="max-width: 960px; margin: 0 auto;">
<iframe id="gameFrame" src="/play/{{.Software.Name}}/{{.WebPlayableRelease.Version}}/content/index.html"
frameborder="0" allowfullscreen></iframe>
</div>
</div>
{{end}}
<h3>Releases</h3>
<div class="row">
{{range .Releases}}
@@ -42,7 +79,7 @@
<div class="card-footer">
<div class="btn-group d-flex justify-content-center" role="group" aria-label="Operations">
{{if .HTMLFolderPath}}
<a href="/play/{{$.Software.Name}}/{{.Version}}" class="btn btn-success btn-sm">Play</a>
<a href="/play/{{$.Software.Name}}/{{.Version}}" class="btn btn-primary btn-sm">Play</a>
{{end}}
<a href="/download/{{$.Software.Name}}/{{.Version}}/source"
class="btn btn-primary btn-sm">Source</a>
@@ -54,6 +91,4 @@
</div>
{{end}}
</div>
<p><a href="/" class="btn btn-primary">Back to Softwares</a></p>
{{end}}