Skip to content

Commit

Permalink
Add gallery
Browse files Browse the repository at this point in the history
  • Loading branch information
@KaeruCT
KaeruCT committed Sep 3, 2024
1 parent c9c9f6f commit 4268c83
Show file tree
Hide file tree
Showing 5 changed files with 93 additions and 31 deletions.
3 changes: 3 additions & 0 deletions .gitmodules
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
[submodule "themes/hugo-ficurinia"]
path = themes/hugo-ficurinia
url = https://gitlab.com/gabmus/hugo-ficurinia.git
[submodule "static/projects/short-experiments"]
path = static/projects/short-experiments
url = git@github.com:KaeruCT/short-experiments.git
11 changes: 5 additions & 6 deletions config.toml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,12 +53,11 @@ summaryLength = 70 # number of words for article summaries
name = "About"
url = "/about/"
weight = 0
# TODO: enable when ready to show
#[[menu.main]]
# identifier = "gallery"
# name = "Gallery"
# url = "/gallery/"
# weight = 0
[[menu.main]]
identifier = "gallery"
name = "Gallery"
url = "/gallery/"
weight = 0
[[menu.icons]]
identifier = "github"
name = "GitHub"
Expand Down
106 changes: 81 additions & 25 deletions content/gallery.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,19 +4,33 @@ date: 2024-09-02T23:46:00+01:00
norss: true
nosearch: true
showDate: false
draft: false
---

<style type="text/css">
.video-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 10px;
}

.video-grid a {
display: block;
border-bottom: 0;
/* overflow: hidden; */
}

.video-grid video {
width: 100%;
height: auto;
background-color: #000;
height: 100%;
background-color: transparent;
border-radius: 0;
transition: all 0.3s ease;
}

.video-grid a:hover video {
filter: brightness(1.3);
transform: scale(1.05);

}

@media (max-width: 768px) {
Expand All @@ -26,25 +40,67 @@ showDate: false
}
</style>
<div class="video-grid">
<video src="/images/screenshots/gallery/3d.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/cityscape.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/earthbound.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/lel.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/rainbow-sprinkler2.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/starry-sky.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/turtle.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/beings.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/dance.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/fireworks.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/lines.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/random-blocks.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/tap.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/tyc.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/checker.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/dots.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/grid.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/p2.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/starfield.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/tunnel.webm" autoplay loop muted></video>
<video src="/images/screenshots/gallery/vs.webm" autoplay loop muted></video>
<a href="/projects/short-experiments/dots" title="Dots">
<video src="/images/screenshots/gallery/dots.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/turtle" title="Turtle">
<video src="/images/screenshots/gallery/turtle.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/random-blocks" title="Random Blocks">
<video src="/images/screenshots/gallery/random-blocks.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/earthbound" title="Earthbound">
<video src="/images/screenshots/gallery/earthbound.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/rainbow-sprinkler2" title="Rainbow Sprinkler 2">
<video src="/images/screenshots/gallery/rainbow-sprinkler2.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/tyc" title="TYC">
<video src="/images/screenshots/gallery/tyc.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/beings" title="Beings">
<video src="/images/screenshots/gallery/beings.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/dance" title="Dance">
<video src="/images/screenshots/gallery/dance.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/grid" title="Grid">
<video src="/images/screenshots/gallery/grid.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/lines" title="Lines">
<video src="/images/screenshots/gallery/lines.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/fireworks" title="Fireworks">
<video src="/images/screenshots/gallery/fireworks.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/cityscape" title="Cityscape">
<video src="/images/screenshots/gallery/cityscape.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/lel" title="LEL">
<video src="/images/screenshots/gallery/lel.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/p2" title="P2">
<video src="/images/screenshots/gallery/p2.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/checker" title="Checkers">
<video src="/images/screenshots/gallery/checker.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/3d" title="3D">
<video src="/images/screenshots/gallery/3d.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/tap" title="Tap">
<video src="/images/screenshots/gallery/tap.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/tunnel" title="Rainbow Tunnel">
<video src="/images/screenshots/gallery/tunnel.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/starry-sky" title="Starry Sky">
<video src="/images/screenshots/gallery/starry-sky.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/vs" title="VS">
<video src="/images/screenshots/gallery/vs.webm" autoplay loop muted></video>
</a>
<a href="/projects/short-experiments/starfield" title="Starfield">
<video src="/images/screenshots/gallery/starfield.webm" autoplay loop muted></video>
</a>
</div>
3 changes: 3 additions & 0 deletions layouts/partials/inject/head.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,12 @@
.notlist li { display: inline-block; margin: 0; }
.notlist a { margin-right: 8px; }
footer:nth-child(2) > p:nth-child(4) { display: none; }
article > h1, article > h2, main > h1, main > h2 { margin-top: 0; }
header { margin-bottom: 0; }
h1 { font-size: 26px; }
hr { display: none; }
article img { margin: unset; }
#content { padding-top: 0; }
#main-nav li { border-right: 0 !important; }
#main-nav li a { padding: 0 !important; padding-right: 10px !important; font-weight: bold; }
@media (prefers-color-scheme: dark) {
Expand Down
1 change: 1 addition & 0 deletions static/projects/short-experiments
Submodule short-experiments added at 6b4a2f

0 comments on commit 4268c83

Please sign in to comment.