update layout and colors

This commit is contained in:
yequari 2024-08-02 21:55:34 -07:00
parent f8eeb0f218
commit 2901a05633
9 changed files with 79 additions and 44 deletions

View File

@ -1,6 +1,7 @@
--- ---
title: yequari.com title: yequari.com
--- ---
# Back at it again, for the very first time
Welcome to my homepage! I like to program and tinker with computers. My other hobbies include video games, tabletop RPGs, and collecting Transformers figures. On this site I like to write about the web, games, and random thoughts I have. I also publish my notes on various topics. # Hello
Welcome to my homepage! I program and tinker with computers. This site is a collection of notes, ramblings, things I like, and more. My hobbies include video games, TTRPGs, and collecting Transformers figures.

View File

@ -1,29 +1,20 @@
{{ define "main" }} {{ define "main" }}
<div class="index-wrapper"> <div class="index-wrapper">
<div class="box index-status"> <div class="box index-content">
</div>
<div class="box index-content">
{{ .Content }} {{ .Content }}
</div> </div>
<div class="box index-blog"> <div class="box index-blog">
<h3>Latest Blog Posts</h3> {{- partial "index-latest-blogs.html" . -}}
<ul> </div>
{{ range first 3 (where .Site.RegularPages.ByDate.Reverse "Section" "blog") }} <div class="box index-social">
<li><a class="title u-url p-name" href="{{ .RelPermalink }}">{{ .Title }}</a></li> {{- partial "index-socials.html" . -}}
{{ end }} </div>
</ul> <!-- <div class="box index-banners"> -->
</div> <!-- </div> -->
<div class="box index-social"> <div class="box index-recent">
<h3>Social</h3> {{- partial "index-now.html" . -}}
{{- partial "social.html" . -}} </div>
</div> <!-- <div class="box index-bookmarks"> -->
<div class="box index-banners"> <!-- </div> -->
<h3>Check Out These Sites</h3>
<a href="/links">More Links</a>
</div>
<div class="box index-recent">
<h3>What I'm Up To</h3>
<a href="/now">See More</a>
</div>
</div> </div>
{{ end }} {{ end }}

View File

@ -0,0 +1 @@
<h3>Read These Articles</h3>

View File

@ -0,0 +1,9 @@
<h3>Latest Blog Posts</h3>
<ul>
{{ range first 3 (where .Site.RegularPages.ByDate.Reverse "Section" "blog") }}
<li>
<time class="dt-published" datetime="{{ .PublishDate }}">{{ .PublishDate.Format "1/2/06" }}</time>
<a class="title u-url p-name" href="{{ .RelPermalink }}">{{ .Title }}</a>
</li>
{{ end }}
</ul>

View File

@ -0,0 +1,12 @@
<h3>Check Out These Sites</h3>
<div id="index-links">
<a href="#"><img src="/images/link-banners/manatee_banner2.png"></a>
<a href="#"><img src="/images/link-banners/isthisloss.png"></a>
<a href="#"><img src="/images/link-banners/iusearchbtw.png"></a>
<a href="#"><img src="/images/link-banners/poweredbymozilla.png"></a>
<a href="#"><img src="/images/link-banners/yqbanner.png"></a>
<a href="#"><img src="/images/link-banners/sendmeawebmention.png"></a>
</div>
<p>
<a href="/links">/links</a> =&gt;
</p>

View File

@ -0,0 +1,6 @@
<h3>What I'm Up To</h3>
<ul>
<li>Helping out at the <a href="https://32bit.cafe">32-Bit Cafe</a></li>
<li>Playing <strong>Zenless Zone Zero</strong></li>
<li>Learning C#</li>
</ul>

View File

@ -1,3 +1,4 @@
<h3>Socials</h3>
<ul class="social"> <ul class="social">
{{ range site.Menus.social }} {{ range site.Menus.social }}
<li class="social"> <li class="social">

View File

@ -15,7 +15,7 @@
</section> </section>
<section> <section>
<!-- <h1>Social</h1> --> <!-- <h1>Social</h1> -->
{{ partial "social.html" .}} {{ partial "index-socials.html" .}}
</section> </section>
<!-- <section> --> <!-- <section> -->
<!-- <h1>Quote of the Day</h1> --> <!-- <h1>Quote of the Day</h1> -->

View File

@ -72,9 +72,8 @@
.index-wrapper { .index-wrapper {
display: grid; display: grid;
grid-template-columns: repeat(5, 20% [col-start]); grid-template-columns: repeat(10, 10% [col-start]);
grid-template-rows: repeat(5, 33% [row-start]); grid-template-rows: repeat(6, 33% [row-start]);
column-gap: 0.5vw;
} }
.box { .box {
@ -85,7 +84,7 @@
.index-content { .index-content {
grid-row: 1 / 2; grid-row: 1 / 2;
grid-column: 2 / 5; grid-column: 1 / span 6;
} }
/* .index-status { */ /* .index-status { */
@ -96,38 +95,53 @@
.index-social { .index-social {
grid-row: 2 / 3; grid-row: 2 / 3;
grid-column: 5 / 6; grid-column: 9 / span 2;
} }
.index-blog { .index-blog {
grid-row: 2 / 3; grid-row: 2 / 3;
grid-column: 3 / 5; grid-column: 5 / span 4;
} }
.index-banners { .index-banners {
grid-row: 2 / 3; grid-row: 3 / 4;
grid-column: 1 / 3 grid-column: 1 / span 5;
}
.index-recent {
grid-row: 1 / 2;
grid-column: 7 / span 4;
}
.index-bookmarks {
grid-row: 3 / 4;
grid-column: 6 / span 5;
} }
@media only screen and (max-width: 700px) { @media only screen and (max-width: 700px) {
.index-content { .box {
grid-row: 1 / 2;
grid-column: 1 / 6; grid-column: 1 / 6;
} }
.index-status { .index-content {
grid-row: 1 / 2;
}
.index-recent {
grid-row: 2 / 3; grid-row: 2 / 3;
grid-column: 1 / 6; }
.index-banners {
grid-row: 3 / 4;
} }
.index-social { .index-social {
grid-row: 3 / 4; grid-row: 4 / 5;
grid-column: 1 / 6;
} }
.index-blog { .index-blog {
grid-row: 4 / 5; grid-row: 5 / 6;
grid-column: 1 / 6;
} }
} }