revamp links page to use hugo data files

This commit is contained in:
yequari 2023-08-10 20:50:28 -07:00
parent 1d8092dbbf
commit d6b5314977
10 changed files with 100 additions and 120 deletions

View File

@ -1,119 +0,0 @@
---
title: Links
---
<p>
This is a collection of pages and websites I have stumbled upon that I think are cool. Some are members of the greater Yesterweb community and others are pages I want to revisit or share.
</p>
<div id="links-main">
<div class="links-column">
<ul class="link">
<h4>Computing</h4>
<li>
<a class="hover-links" target="_blank" href="https://sbtcvm.blogspot.com/?m=1" data-hover="A virtual machine simulating a base 3 computer. Alternatives to the traditional models of computing are of great interest to me and I want to learn more about programming in base 3.">Simple Balanced Ternary Computer Virtual Machine</a>
</li>
<li>
<a class="hover-links" target="_blank" href="https://sharats.me/posts/shell-script-best-practices/" data-hover="A list of tips when writing shell scripts. Especially useful for me since I'm not super familiar with bash but use it on a daily basis.">Shell Script Best Practices</a>
</li>
<li>
<a class="hover-links" target="_blank" href="http://www.catb.org/esr/structure-packing/" data-hover="An interesting look into how C structs work and how to squeeze some extra optimization out of them.">The Lost Art of Structure Packing</a>
</li>
<li>
<a class="hover-links" target="_blank" href="https://webmentions.neocities.org" data-hover="An excellent tutorial on how to set up webmentions on your site, specifically tailored to neocities users.">how do i webmentions</a>
</li>
<li>
<a class="hover-links" target="_blank" href="https://sebhastian.com/html-hover-text/" data-hover="A tutorial explaining hover text without using JavaScript, which I used to set up this page.">How to create hover text using HTML and CSS</a>
</li>
<li>
<a class="hover-links" target="_blank" href="https://beej.us/guide/" data-hover="Beej's Guides are all excellent tools to learn various programming languages and technologies. Notably useful for me are Beej's Guide to Network Programming and Beej's Guide to C (both volumes)">Beej's Guides</a>
</li>
</ul>
</div>
<div class="links-column">
<ul class="link">
<h4>Amusement</h4>
<li>
<a class="hover-links" target="_blank" href="http://www.norvig.com/Gettysburg/index.htm" data-hover="A modern interpretation of the Gettysburg Address.">The Gettysburg Powerpoint Presentation</a>
</li>
<li>
<a class="hover-links" target="_blank" href="https://dev.to/miguelmota/how-unix-programmers-at-restaurants-search-menus--46ad" data-hover="A real-world application of UNIX skills.">How Unix programmers at restaurants search menus for their favorite plate</a>
</li>
<li>
<a class="hover-links" target="_blank" href="https://xwellingtonx.github.io/advanced-pet/" data-hover="A web simulation of the old Megaman NT Warrior Advanced PET toy from the mid-2000s">Advanced PET</a>
</li>
</ul>
</div>
<div class="links-column">
<ul class="link">
<h4>Interesting Articles</h4>
<li>
<a class="hover-links" target="_blank" href="https://www.wired.com/2016/07/forget-comcast-heres-the-diy-approach-to-internet-access/" data-hover="A Wired article about a Spanish engineer who built up a distributed wifi network to provide Internet to his town because telecom companies wouldn't.">Forget Comcast. Here's the DIY Approach to Internet Access</a>
</li>
<li>
<a class="hover-links" target="_blank" href="https://socket3.wordpress.com/2018/02/03/designing-windows-95s-user-interface/" data-hover="A retrospective from someone who worked on the Windows 95 user interface detailing the design process and iteration that went into creating an interface that was accessible to both first-time computer users and existing power users.">Designing Windows 95's User Interface</a>
</li>
</ul>
</div>
<div class="links-column">
<ul class="link">
<h4>Food for Thought</h4>
<li>
<a class="hover-links" target="_blank" href="https://32bit.cafe" data-hover="Building a better internet">32-Bit Cafe</a>
</li>
<li>
<a class="hover-links" target="_blank" href="https://permacomputing.net" data-hover="Permacomputing focuses on sustainable computing, inspired by permaculture, aiming to utilize existing compute resources rather than new ones. The wiki is very incomplete, but is something to keep an eye on as it grows. ">Permacomputing Wiki</a>
</li>
<li>
<a class="hover-links" target="_blank" href="https://permies.com/w/better-world" data-hover="On the topic of permaculture, Building a Better World in your Backyard is a book describing how you can get started with permaculture and living a sustainable lifestyle. The website has lots of good resources and is often referenced by the book. You can also buy the book in bulk for cheap to distribute amongst your local community.">Building a Better World in your Backyard</a>
</li>
<li>
<a class="hover-links" target="_blank" href="https://ajroach42.com/the-small-things-manifesto/" data-hover="A manifesto written by Andrew Roach proposing that we should try to do things on a human scale again, instead of trying to design everything to scale infinitely.">The small things Manifesto</a>
</li>
</ul>
</div>
</div>
<h4>Friends</h4>
<a href="https://xandra.cc"><img src="/images/buttons/xandracc.png"></a>
<a href="https://acebit.neocities.org/"><img src="/images/buttons/acebit.png"></a>
<a href="https://supveronica.neocities.org/"><img src="/images/buttons/supveronica.gif"></a>
<a href="https://sinclair-speccy.github.io/The-Mainframe/"><img src="/images/buttons/themainframe.png"></a>

4
content/links/_index.md Normal file
View File

@ -0,0 +1,4 @@
---
title: Links
---
This is a collection of links I want to share. Some are useful resources for learning, some are interesting articles, and some are just novel and fun.

View File

@ -0,0 +1,20 @@
name: Computing
links:
- name: Simple Balanced Ternary Computer Virtual Machine
description: A virtual machine simulating a base 3 computer. Alternatives to the traditional models of computing are of great interest to me and I want to learn more about programming in base 3.
url: https://sbtcvm.blogspot.com/?m=1
- name: Shell Script Best Practices
description: A list of tips when writing shell scripts. Especially useful for me since I'm not super familiar with bash but use it on a daily basis.
url: https://sharats.me/posts/shell-script-best-practices/
- name: The Lost Art of Structure Packing
description: An interesting look into how C structs work and how to squeeze some extra optimization out of them.
url: http://www.catb.org/esr/structure-packing/
- name: how do i webmentions
description: An excellent tutorial on how to set up webmentions on your site, specifically tailored to neocities users.
url: https://webmentions.neocities.org
- name: How to create hover text using HTML and CSS
description: A tutorial explaining hover text without using JavaScript, which I used to set up this page.
url: https://sebhastian.com/html-hover-text/
- name: Beej's Guides
description: Beej's Guides are all excellent tools to learn various programming languages and technologies. Notably useful for me are Beej's Guide to Network Programming and Beej's Guide to C (both volumes)
url: https://beej.us/guide/

View File

@ -0,0 +1,11 @@
name: Amusement
links:
- name: The Gettysburg Powerpoint Presentation
description: A modern interpretation of the Gettysburg Address.
url: http://www.norvig.com/Gettysburg/index.htm
- name: How Unix programmers at restaurants search menus for their favorite plate
description: A real-world application of UNIX skills.
url: https://dev.to/miguelmota/how-unix-programmers-at-restaurants-search-menus--46ad
- name: Advanced PET
description: A web simulation of the old Megaman NT Warrior Advanced PET toy from the mid-2000s
url: https://xwellingtonx.github.io/advanced-pet/

View File

@ -0,0 +1,11 @@
name: Interesting Articles
links:
- name: Forget Comcast. Here's the DIY Approach to Internet Access
description: A Wired article about a Spanish engineer who built up a distributed wifi network to provide Internet to his town because telecom companies wouldn't.
url: https://www.wired.com/2016/07/forget-comcast-heres-the-diy-approach-to-internet-access/
- name: Designing Windows 95's User Interface
description: A retrospective from someone who worked on the Windows 95 user interface detailing the design process and iteration that went into creating an interface that was accessible to both first-time computer users and existing power users.
url: https://socket3.wordpress.com/2018/02/03/designing-windows-95s-user-interface/
- name: Writing when tech has broken the web's social contract
description: An article discussing how writing on the Internet is changing because of AI
url: https://www.baldurbjarnason.com/2023/tech-broke-the-webs-social-contract/https://www.baldurbjarnason.com/2023/tech-broke-the-webs-social-contract/

View File

@ -0,0 +1,14 @@
name: Food for Thought
links:
- name: 32-Bit Cafe
url: "https://32bit.cafe"
description: Building a better internet
- name: Permacomputing Wiki
url: https://permacomputing.net
description: Permacomputing focuses on sustainable computing, inspired by permaculture, aiming to utilize existing compute resources rather than new ones. The wiki is very incomplete, but is something to keep an eye on as it grows.
- name: Building a Better World in your Backyard
url: https://permies.com/w/better-world
description: On the topic of permaculture, Building a Better World in your Backyard is a book describing how you can get started with permaculture and living a sustainable lifestyle. The website has lots of good resources and is often referenced by the book. You can also buy the book in bulk for cheap to distribute amongst your local community.
- name: The small things Manifesto
url: https://ajroach42.com/the-small-things-manifesto/
description: A manifesto written by Andrew Roach proposing that we should try to do things on a human scale again, instead of trying to design everything to scale infinitely.

10
layouts/links/list.html Normal file
View File

@ -0,0 +1,10 @@
{{ define "main" }}
<div id="content">
{{ .Content }}
<div id="links-main">
{{ range $.Site.Data.links }}
{{ partial "linklist.html" . }}
{{ end }}
</div>
</div>
{{ end }}

View File

@ -0,0 +1,10 @@
<div class="links-column">
<ul class="link">
<h4>{{ .name }}</h4>
{{ range .links }}
<li>
<a class="hover-links" target="_blank" href="{{ .url }}" data-hover="{{ .description }}">{{ .name }}</a>
</li>
{{ end }}
</ul>
</div>

View File

@ -0,0 +1,19 @@
{{ define "main" }}
<div class="left sidebar">
<h6>Figures I'm Looking For</h6>
<ul>
{{ range $.Site.Data.transformers.collection.wants }}
<li> {{ .name }}</li>
{{ end }}
</ul>
<h6>Recent Collection Additions</h6>
<ul>
{{ range $.Site.Data.transformers.collection.recent }}
<li> {{ .name }}</li>
</ul>
{{ end }}
</div>
<div id="content">
{{ .Content }}
</div>
{{ end }}

View File

@ -300,7 +300,7 @@ decorative stuff :)
position: absolute;
z-index: 1;
left: -50px;
top: 110%;
top: -250%;
}
.hover-links:hover:before {