dofdev/site
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

moves, games, projects carousels

Browse source
This commit is contained in:
ethan merchant 2024-11-03 02:55:19 -05:00
parent 43b2cb6c71
commit 34e029cbb0
1 changed files with 90 additions and 78 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

168
tem/html/pages/mono.html
View file

@ -66,85 +66,97 @@
>degrees of freedom development</div> -->
</div>
<img src='/public/img/dofdev_logo.svg?v22' width='100%'>
<p>degrees of freedom development</p>
<div class='shuffle' style='
display: flex;
flex-flow: column;
align-items: center;
'>
<div style='color: white; font-size: 20px;'>Ethan Merchant
<a href='https://ethanmerchant.com' style='color: var(--light);'>@spatialfree</a>
</div>
<div style='color: white; font-size: 20px;'>Niko Ryan
<a href='https://twitter.com/opendegree' style='color: var(--light);'>@opendegree</a>
</div>
</div>
<div class='t_symbol' style='
font-size: 32px;
'>&times;</div>
<div id='x'>
<a href='https://stereokit.net' target='_blank'>
<div style='
background-image: url("https://stereokit.net/img/StereoKitLogoLight.svg");
'></div>
</a>
<a href='https://www.projectnorthstar.org/' target='_blank'>
<div style='
background-image: url("/public/img/icons/northstar.svg");
'></div>
</a>
<a href='https://stardustxr.org' target='_blank'>
<div style='
background-image: url("https://stardustxr.org/img/icon.gif");
'></div>
</a>
</div>
<div class='t_symbol' style='
margin-top: 4rem;
'>&conint;</div>
<!-- <div style='height: 32px;'></div> -->
<!-- <div id='fdeg'>&plus;</div> -->
<h1>projects</h1>
<p class='subtitle'>xr based interfaces</p>
<a href='/braille_xr'>braille_xr</a>
<div style='height: 32px;'></div>
<img src='/public/img/logo.svg' width='64px'>
<div style='height: 24px;'></div>
<input type='password' autofocus
name='pass' placeholder='pass'
hx-post='/pass'
hx-vals='{"pass": this.value}'
hx-swap='outerHTML'
<h2>moves</h2>
<div
style="
width: 100%;
display: flex;
gap: 6px;
overflow-x: auto;
"
>
<!-- <button hx-post='/clicked' hx-swap='outerHTML'>
Click Me
</button> -->
{{ range $hash, $move := .Data.Moves }}
<div
style="
width: 400px;
background-color: #00000080;
"
>
<div>
<video autoplay muted
style="
width: 100%;
height: 100%;
object-fit: cover;
padding: 0;
margin: 0;
"
>
<source src="/public/moves/{{ $hash }}.webm" type="video/webm" />
</video>
</div>
<div>{{ $move.Name }}</div>
<a href="/move/{{ $hash }}">see more</a>
</div>
{{ end }}
</div>
<footer>&copy; 2018-2024 dofdev</footer>
<h2>games</h2>
<div
style="
width: 100%;
display: flex;
gap: 6px;
overflow-x: auto;
"
>
{{ range $hash, $game := .Data.Games }}
<div
style="
width: 400px;
background-color: #00000080;
"
>
<div>
<video autoplay muted
style="
width: 100%;
height: 100%;
object-fit: cover;
padding: 0;
margin: 0;
"
>
<source src="/public/games/{{ $hash }}.webm" type="video/webm" />
</video>
</div>
<div>{{ $game.Name }}</div>
<a href="/game/{{ $hash }}">see more</a>
</div>
{{ end }}
</div>
<h2>projects</h2>
<div
style="
width: 100%;
display: flex;
gap: 6px;
overflow-x: auto;
"
>
{{ range $hash, $project := .Data.Projects }}
<div
style="
width: 400px;
background-color: #00000080;
"
>
<div>{{ $project.Name }}</div>
<a href="/project/{{ $hash }}">see more</a>
</div>
{{ end }}
</div>
<style>
#x {
display: flex;
flex-flow: wrap;
justify-content: center;
gap: 32px;
> a > div {
min-width: 64px;
min-height: 64px;
background-size: contain;
}
}
</style>
<div style='height: 128px; width: 100%;'></div>