squibid/squi.bid
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: squibid:de8eb4c3ec65910d14807c5fba0ad6c0a7c02382
Branches Tags
squibid:master
..
compare: squibid:9f101abc10480143251f24d446807a7b229190ef
Branches Tags
squibid:master

10 Commits
de8eb4c3ec ... 9f101abc10

Author SHA1 Message Date
Squibid
9f101abc10 update 2025-06-13 19:28:25 -04:00
Squibid
280122c27d replace wallheaven with wiz 2024-02-21 15:31:31 -05:00
Squibid
84335ce590 new blog post 2024-01-20 16:28:08 -05:00
Squibid
615b6e1683 add style for blog entries 2024-01-14 19:39:39 -05:00
Squibid
815d3e21ca forgot to link style.css in blog/index.php 2023-10-30 12:49:57 -04:00
Squibid
1bc1454b93 New blog entry and changes to how blogs are displayed 
- blogs are now in subdirs
 - blog list is generated through helper function
 - full blog list is in blog subdir
 2023-10-30 12:47:55 -04:00
Squibid
2d90cc6151 nginx isn't redirecting /blog to /blog.php like it would with html 
so I have to resort to this :(
 2023-10-27 19:03:41 -04:00
Squibid
b3e082ac55 add favicon 2023-10-27 18:52:59 -04:00
Squibid
13561786a7 Big changes! 
- Fixed typo in pinned git repos
- Add new pinned repo (wallheaven)
- Switch blog generation to php
- remove useless symlink in blog/
 2023-09-26 16:55:27 -04:00
Squibid
48475ae4ab add comments 2023-08-15 13:24:56 -04:00
16 changed files with 280 additions and 91 deletions
Expand all files Collapse all files

2
blog/It's-Alive!.html → blog/It's-Alive!/index.html
View File

@ -1,6 +1,6 @@
<meta name="date" content="2023/05/01"> <meta name="date" content="2023/05/01">
<title>It's Alive!</title> <title>It's Alive!</title>
<link rel=stylesheet href=style.css> <link rel=stylesheet href='/style.css'>
<body style="background-color: #161617;"> <body style="background-color: #161617;">
<p> <p>
Cloning via http(s) now works! Cloning via http(s) now works!

20
blog/What-is-a-squibid/index.html Normal file
View File

@ -0,0 +1,20 @@
<!DOCTYPE HTML>
<html lang="en">
<meta name="date" content="2023/10/30">
<title>'What is a squibid?'</title>
<link rel="stylesheet" href="/style.css">
<link rel="stylesheet" href="/blog/style.css">
<body style="background-color: #161617;">
<p>
Recently, a few people have been asking me: "what is a squibid?" or
"where did your name come from?". In this blog post I will answer those
questions.
<br>
<br>
A few years ago I came up with a drawing of an animal
reason to do anything with it, but regardless I chose to name it a
squibid. Eventually, when trying to find a good username I chose squibid
because that would cover both the username and profile picture.
</p>
</body>
</html>

48
blog/Why-"suckless"-software-is-important/index.html Normal file
View File

@ -0,0 +1,48 @@
<!DOCTYPE HTML>
<html lang="en">
<title>'Why "suckless" software is important'</title>
<meta name="date" content="2024/01/14">
<link rel="stylesheet" href="/style.css">
<style> html, body {
display: unset !important;
max-width: 80ch;
margin: auto;
} </style>
<body id="blog">
<p>
When it comes to learning how to program there are a few things you can
do:
</p>
<ol>
<li>Read a textbook</li>
<li>Watch videos</li>
<li>Read some source code</li>
</ol>
<p>
Of these options I find the best way to truly learn how to program is to
read someone else's program and try and understand it. For example
recently I've been working on my own
<a href="https://tools.suckless.org/dmenu">dmenu</a> clone for Wayland.
Throughout working on it instead of looking for tutorials on how to render
a square using pixman I decided to take a look at
<a href="https://github.com/djpohly/dtao">dtao</a> which is a clone of
dzen for Wayland. By just reading the code and messing around with the
program I was able to get an understanding for how rendering is done in
pixman.
</p>
<p>
Now you may be asking yourself something like: "But what does this have to
do with suckless software?". The answer to that is in their philosophy
which is about: "keeping things simple, minimal and usable". The idea of
keeping things minimal and useable allows them to create wonderful
programs that not only work, but also showcase how to do things without
extra fluff that something like i3 might have.
</p>
<p>
Even if you don't like suckless software it still serves as a great place
to learn how to do the bare minimum. And for those who do enjoy using it,
it can serve as a great starting place to hack upon until you get the
software of your dreams.
</p>
</body>
</html>

10
blog.html → blog/index.php
View File

@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<title>Squibid's Blog</title> <title>Squibid's Blog</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="/style.css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head> </head>
@ -20,16 +20,12 @@
<div id="master"> <div id="master">
<header> <header>
<h1 id="font", style="margin-bottom: 0"> <h1 id="font", style="margin-bottom: 0">
<a href="https://squi.bid">Squibid's</a> Blog <a href="/">Squibid's</a> Blog
</h1> </h1>
</header> </header>
<hr style="color: #f7f7f7;"> <hr style="color: #f7f7f7;">
<p id="bloglist"> <p id="bloglist">
<!-- b script marker blog --> <?php include(__DIR__.'/../misc/tools.php'); blog_entries("../blog"); ?>
<a href="/blog/librex-and-dots"> librex and dots</a><span>2023/06/27</span><br>
<a href="/blog/It's-Alive!"> It's Alive!</a><span>2023/05/01</span><br>
<a href="/blog/state-of-the-site"> state of the site</a><span>2023/03/11</span><br>
<!-- e script marker blog -->
</p> </p>
<h2 id="font" style="text-align: center; margin-top: 0;"> <h2 id="font" style="text-align: center; margin-top: 0;">
<a href="/blog/rss.xml", title="rss">subscribe</a> <a href="/blog/rss.xml", title="rss">subscribe</a>

2
blog/librex-and-dots.html → blog/librex-and-dots/index.html
View File

@ -1,6 +1,6 @@
<meta name="date" content="2023/06/27"> <meta name="date" content="2023/06/27">
<title>librex and dots</title> <title>librex and dots</title>
<link rel=stylesheet href=style.css> <link rel=stylesheet href='/style.css'>
<body style="background-color: #161617;"> <body style="background-color: #161617;">
<p> <p>
Hello! Hello!

28
blog/newblog
View File

@ -1,23 +1,29 @@
#!/bin/sh #!/bin/sh
# generate a base blog file # generate a base blog file
read -p "Enter name of blog: " name printf "Enter name of blog entry: "
filename="$(echo $name | sed 's/ /-/g').html" read -r name
filename="$(echo "$name" | sed 's/ /-/g')"
# make sure we don't overwrite an existent file # make sure we don't overwrite an existing file
[ -f $filename ] && if [ -f "$filename" ]; then
printf "File already exists! Please choose a different filename.\n"; exit 1 printf "Blog entry already exists! Please choose a different name.\n"
exit 1
fi
printf '<!DOCTYPE HTML> mkdir "$filename"
cat > "$filename/index.html" << EOF
<!DOCTYPE HTML>
<html lang="en"> <html lang="en">
<meta name="date" content="2023/07/15"><title>'$name'</title> <title>'$name'</title>
<link rel=stylesheet href=style.css> <meta name="date" content="$(date "+%Y/%m/%d")">
<body style="background-color: #161617;"> <link rel="stylesheet" href="/style.css">
<body id="blog">
<p> <p>
</p> </p>
</body> </body>
</html> </html>
' > $filename EOF
$EDITOR $filename [ "$EDITOR" ] && $EDITOR "$filename/index.html" || vim "$filename/index.html"
echo "Make sure to run sup to add to rss feed!" echo "Make sure to run sup to add to rss feed!"

96
blog/rss.xml
View File

@ -11,10 +11,94 @@
<!-- LB --> <!-- LB -->
<item>
<title>Why "suckless" software is important</title>
<guid>https://squi.bid/blog/Why-"suckless"-software-is-important/index.html</guid>
<link>https://squi.bid/blog/Why-"suckless"-software-is-important/index.html</link>
<pubDate>Sun, 14 Jan 2024 20:22:27 -0500</pubDate>
<description><![CDATA[<!DOCTYPE HTML>
<html lang="en">
<title>'Why "suckless" software is important'</title>
<meta name="date" content="2024/01/14">
<link rel="stylesheet" href="/style.css">
<style> html, body {
display: unset !important;
max-width: 80ch;
margin: auto;
} </style>
<body id="blog">
<p>
When it comes to learning how to program there are a few things you can
do:
</p>
<ol>
<li>Read a textbook</li>
<li>Watch videos</li>
<li>Read some source code</li>
</ol>
<p>
Of these options I find the best way to truly learn how to program is to
read someone else's program and try and understand it. For example
recently I've been working on my own
<a href="https://tools.suckless.org/dmenu">dmenu</a> clone for Wayland.
Throughout working on it instead of looking for tutorials on how to render
a square using pixman I decided to take a look at
<a href="https://github.com/djpohly/dtao">dtao</a> which is a clone of
dzen for Wayland. By just reading the code and messing around with the
program I was able to get an understanding for how rendering is done in
pixman.
</p>
<p>
Now you may be asking yourself something like: "But what does this have to
do with suckless software?". The answer to that is in their philosophy
which is about: "keeping things simple, minimal and usable". The idea of
keeping things minimal and useable allows them to create wonderful
programs that not only work, but also showcase how to do things without
extra fluff that something like i3 might have.
</p>
<p>
Even if you don't like suckless software it still serves as a great place
to learn how to do the bare minimum. And for those who do enjoy using it,
it can serve as a great starting place to hack upon until you get the
software of your dreams.
</p>
]]></description>
</item>
<item>
<title>What is a squibid?</title>
<guid>https://squi.bid/blog/What-is-a-squibid/index.html</guid>
<link>https://squi.bid/blog/What-is-a-squibid/index.html</link>
<pubDate>Mon, 30 Oct 2023 12:47:05 -0400</pubDate>
<description><![CDATA[<!DOCTYPE HTML>
<html lang="en">
<meta name="date" content="2023/10/30">
<title>'What is a squibid?'</title>
<link rel="stylesheet" href="/style.css">
<link rel="stylesheet" href="/blog/style.css">
<body style="background-color: #161617;">
<p>
Recently, a few people have been asking me: "what is a squibid?" or
"where did your name come from?". In this blog post I will answer those
questions.
<br>
<br>
A few years ago I came up with a drawing of an animal
reason to do anything with it, but regardless I chose to name it a
squibid. Eventually, when trying to find a good username I chose squibid
because that would cover both the username and profile picture.
</p>
]]></description>
</item>
<item> <item>
<title>librex and dots</title> <title>librex and dots</title>
<guid>https://squi.bid/blog/librex-and-dots.html</guid> <guid>https://squi.bid/blog/librex-and-dots</guid>
<link>https://squi.bid/blog/librex-and-dots.html</link> <link>https://squi.bid/blog/librex-and-dots</link>
<pubDate>Tue, 27 Jun 2023 12:17:35 -0400</pubDate> <pubDate>Tue, 27 Jun 2023 12:17:35 -0400</pubDate>
<description><![CDATA[ <description><![CDATA[
<p> <p>
@ -43,8 +127,8 @@ feel free to <a href="mailto:me@zacharyscheiman.com">email me</a>.
<item> <item>
<title>It's Alive!</title> <title>It's Alive!</title>
<guid>https://squi.bid/blog/It's-Alive!.html</guid> <guid>https://squi.bid/blog/It's-Alive!</guid>
<link>https://squi.bid/blog/It's-Alive!.html</link> <link>https://squi.bid/blog/It's-Alive!</link>
<pubDate>Mon, 17 Apr 2023 13:22:03 +0000</pubDate> <pubDate>Mon, 17 Apr 2023 13:22:03 +0000</pubDate>
<description><![CDATA[ <description><![CDATA[
<p> <p>
@ -58,8 +142,8 @@ feel free to <a href="mailto:me@zacharyscheiman.com">email me</a>.
<item> <item>
<title>state of the site</title> <title>state of the site</title>
<guid>https://squi.bid/blog/state-of-the-site.html</guid> <guid>https://squi.bid/blog/state-of-the-site</guid>
<link>https://squi.bid/blog/state-of-the-site.html</link> <link>https://squi.bid/blog/state-of-the-site</link>
<pubDate>Sat, 11 Mar 2023 15:00:32 -0500</pubDate> <pubDate>Sat, 11 Mar 2023 15:00:32 -0500</pubDate>
<description><![CDATA[ <description><![CDATA[
<p> <p>

2
blog/state-of-the-site.html → blog/state-of-the-site/index.html
View File

@ -1,6 +1,6 @@
<meta name="date" content="2023/03/11"> <meta name="date" content="2023/03/11">
<title>state of the site</title> <title>state of the site</title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="/style.css">
<body style="background-color: #161617;"> <body style="background-color: #161617;">
<p> <p>
Hello o/, and welcome to my website!<br> Hello o/, and welcome to my website!<br>

1
blog/style.css
View File

@ -1 +0,0 @@
../style.css

BIN
favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 101 KiB

51
genblog
View File

@ -1,51 +0,0 @@
#!/bin/sh
#
# genblog is a script to take data from my blogs and format it into html for
# my website
#
# by: Squibid
#
#
# Helper variables and functions
#
bloglist=$(ls -t1 blog/*.html | grep -oP '(?<=\/).*?(?=\.)')
top5=$(printf "$bloglist\n" | head -5)
blogdate() {
grep -oP '(?<=\<meta name="date" content=").*(?="\>)' "blog/$1.html"
}
blogtitle() { grep -oP '(?<=\<title\>).*(?=\<\/title\>)' "blog/$1.html"; }
htmlline() {
printf "<a href=\"/blog/$1\">\ $(blogtitle $1)</a>\
<span>$(blogdate $1)</span><br>\n"
}
# set file dates properly
for i in $bloglist; do
if $(touch -cd "$(blogdate $i)T00:00:00" /tmp/file); then
touch -amt "$(blogdate $i | sed 's/\///g')0000" "blog/$i.html"
fi
done
#
# Start modifing our files
#
# delete old bloglist
sed -i -n '1,/.*<!-- b script marker blog -->/p;/.*<!-- e script marker blog -->/,$p' index.html
sed -i -n '1,/.*<!-- b script marker blog -->/p;/.*<!-- e script marker blog -->/,$p' blog.html
# top 5 blogs
for i in $top5; do
line=$(htmlline $i)
# add new bloglist
sed -i "/.*<!-- e script marker blog -->/i $line" index.html
done
# generate the full blog list
for i in $bloglist; do
line=$(htmlline $i)
# add new bloglist
sed -i "/.*<!-- e script marker blog -->/i $line" blog.html
done

18
index.html → index.php
View File

@ -5,6 +5,8 @@
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- prevent darkreader extension from messing with our already dark site -->
<meta name="darkreader-lock" />
</head> </head>
<body style="background-color: #161617;"> <body style="background-color: #161617;">
<div id="master"> <div id="master">
@ -38,17 +40,15 @@
</hgroup> </hgroup>
<p>My best repos are</p> <p>My best repos are</p>
<ul> <ul>
<li><a href="https://git.squi.bid/eat-it">eat it</a> - <li><a href="https://git.squi.bid/squibid/wiz">wiz</a> - An idle event
manager for Wayland. Written in C!</li>
<li><a href="https://git.squi.bid/squibid/eat-it">eat it</a> -
Eat It is a <a href="https://mpv.io", title="Mpv's Website">Mpv</a> Eat It is a <a href="https://mpv.io", title="Mpv's Website">Mpv</a>
package manager writter in <a href="https://lua.org", package manager written in <a href="https://lua.org",
title="Lua's Website">Lua</a> with the intent of making Mpv title="Lua's Website">Lua</a> with the intent of making Mpv
scripts easier to update and use.</li> scripts easier to update and use.</li>
<li><a href="https://git.squi.bid/coreutils">coreutils</a> -
My simple posix (if I can do that) complient core utils witten in
<a href="https://www.iso-9899.info/wiki/The_Standard",
title="C ISO standard">C</a> :)</li>
</ul> </ul>
<p><a href="https://git.squi.bid">more...</a></p> <p><a href="https://git.squi.bid/squibid">more...</a></p>
</div> </div>
</div> </div>
<div id="right"> <div id="right">
@ -60,9 +60,7 @@
</p> </p>
</hgroup> </hgroup>
<p id="blogpreview"> <p id="blogpreview">
<!-- b script marker blog --> <?php include('misc/tools.php'); blog_entries("blog", 5); ?>
If this is here I forgot to generate the blog list.
<!-- e script marker blog -->
</p> </p>
<a href="/blog">more...</a> <a href="/blog">more...</a>
</div> </div>

23
misc/404.html Normal file
View File

@ -0,0 +1,23 @@
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Squibid's Site - 404</title>
<link rel="stylesheet" href="/style.css">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<style>
h1 {
color: var(--cyan);
font-family: sans-serif;
font-size: 404px;
width: 100vw;
vertical-align: middle;
}
</style>
<body style="background-color: #161617;">
<h1><a href="/">whoops</a></h1>
</body>
</html>

27
misc/tools.php Normal file
View File

@ -0,0 +1,27 @@
<?php
function blog_entries($path = "blog", $limit = false) {
$files = scandir($path."/");
$entries = [];
$i = 0;
foreach ($files as $file) {
if (is_dir($path.'/'.$file) && $file[0] != ".") {
$tags = get_meta_tags($path.'/'.$file.'/index.html');
$entries[$i][0] = preg_replace("/\//", "", $tags["date"]);
$entries[$i][1] = $file;
$entries[$i][2] = $tags["date"];
$i++;
}
}
rsort($entries);
for ($i = 0; $i < count($entries); $i++) {
if ($limit && $i > $limit - 1)
break;
$file = $entries[$i][1];
$age = $entries[$i][2];
printf('<a href=/%s/%s>%s</a><span>%s</span><br>',
$path, $file, str_replace("-", " ", $file),
$age ? $age : "¯\_(ツ)_/¯");
}
}
?>

BIN
pics/squibid.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 101 KiB

43
style.css
View File

@ -1,5 +1,38 @@
/* root */
:root { :root {
--lr-width: 45%; --lr-width: 45%;
/* mellow theme colors */
--bg: #161617;
--fg: #c9c7cd;
--bg-dark: #131314;
--black: #27272a;
--red: #f5a191;
--green: #90b99f;
--yellow: #e6b99d;
--blue: #aca1cf;
--magenta: #e29eca;
--cyan: #ea83a5;
--white: #c1c0d4;
--bright_black: #353539;
--bright_red: #ffae9f;
--bright_green: #9dc6ac;
--bright_yellow: #f0c5a9;
--bright_blue: #b9aeda;
--bright_magenta: #ecaad6;
--bright_cyan: #f591b2;
--bright_white: #cac9dd;
--gray01: #1b1b1d;
--gray02: #2a2a2d;
--gray03: #3e3e43;
--gray04: #57575f;
--gray05: #757581;
--gray06: #9998a8;
--gray07: #c1c0d4;
}
html, body {
max-height: 100%;
} }
/* desktop mode */ /* desktop mode */
@ -35,6 +68,12 @@ html, body {
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
body[id=blog] {
background-color: var(--bg);
display: unset !important;
max-width: 80ch;
margin: auto;
}
div#master header { div#master header {
text-align: center; text-align: center;
font-size: 30px; font-size: 30px;
@ -42,7 +81,7 @@ div#master header {
div#group hgroup { div#group hgroup {
text-align: center; text-align: center;
} }
#font, p, ul, ol { #font, p, ul, ol, h1, h2, h3, h4, h5 {
font-family: sans-serif; font-family: sans-serif;
color: white; color: white;
} }
@ -58,7 +97,7 @@ p#blogpreview span {
a { a {
font-family: sans-serif; font-family: sans-serif;
text-decoration: none; text-decoration: none;
color: #ea83a5; color: var(--cyan);
} }
a:hover, a:active { a:hover, a:active {
font-style: italic; font-style: italic;