about summary refs log tree commit diff
diff options
context:
space:
mode:
authorStarfall <us@starfall.systems>2023-05-24 20:31:11 -0500
committerStarfall <us@starfall.systems>2023-05-24 20:31:11 -0500
commitaa870f4d1a9a418dc8785f4b13900bf99c25d187 (patch)
tree7bc5a655f5c69a60e0db1e84793dd90cc2e81eb9
parent80c3edf90ecd923b80af9f05285ab4c6f566d350 (diff)
first blog post, temporarily merging stuff from eleventy
-rw-r--r--css/terminal.css116
-rw-r--r--html/blog/centralization-through-decentralization/index.html53
-rw-r--r--html/blog/feed.xml31
-rw-r--r--html/blog/index.html64
-rwxr-xr-xhtml/index.html1
-rwxr-xr-ximg/feed-icon.svg17
6 files changed, 228 insertions, 54 deletions
diff --git a/css/terminal.css b/css/terminal.css
index d8dc3bd..41280f4 100644
--- a/css/terminal.css
+++ b/css/terminal.css
@@ -1,28 +1,28 @@
 @font-face {
-    font-family: "DejaVu Sans Mono";
-    src: url("../files/fonts/dejavu/ttf/DejaVuSansMono.ttf");
+	font-family: "DejaVu Sans Mono";
+	src: url("../files/fonts/dejavu/ttf/DejaVuSansMono.ttf");
 }
 :root {
-    --fg: #90ff90;
+	--fg: #90ff90;
 	--shadow: 0 0 3px #80ffc066, 0 0 5px #0f63;
-    --link: #3e3;
-    --visited: #b9ffb0;
+	--link: #3e3;
+	--visited: #b9ffb0;
 
-    --bg: #1d2021;
+	--bg: #1d2021;
 	--bg2: black;
 	--selection: #466639;
 
-    --font-body: "DejaVu Sans", "Bitstream Vera Sans", "Verdana", sans-serif;
-    --font-mono: "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Menlo", monospace;
-    --font-accent: var(--font-mono);
+	--font-body: "DejaVu Sans", "Bitstream Vera Sans", "Verdana", sans-serif;
+	--font-mono: "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Menlo", monospace;
+	--font-accent: var(--font-mono);
 }
 .green {
-    --fg: #86ff86; /* hue 120, contrast 13:1 */
+	--fg: #86ff86; /* hue 120, contrast 13:1 */
 	--shadow: 0 0 3px #80ffc066, 0 0 5px #0f63;
-    --link: #42f042; /* hue 120, contrast 10.75:1 */
-    --visited: #b7ffaf; /* hue 114, contrast 14:1 */
+	--link: #42f042; /* hue 120, contrast 10.75:1 */
+	--visited: #b7ffaf; /* hue 114, contrast 14:1 */
 
-    --bg: #1d2021;
+	--bg: #1d2021;
 	--selection: #466639;
 }
 .purple {
@@ -40,29 +40,29 @@
 	--link: #00f5f5; /* hue 180, contrast 12:1 */
 	--visited: #83baf1; /* hue 210, contrast 8:1 */
 
-    --bg: #1d2021;
+	--bg: #1d2021;
 	--selection: #466639;
 }
 
 /* UTILITY CLASSES */
-.clearfix::after, section::after { clear:both; display:block; content: ""; }
+.clearfix::after { clear:both; display:block; content: ""; }
 .inline { display:inline }
 /* MAIN STYLES*/
 html {
-    display: flex;
-    flex-direction: column;
-    min-height: 100vh;
+	display: flex;
+	flex-direction: column;
+	min-height: 100vh;
 }
 body {
-    background-color: var(--bg);
-    background: linear-gradient(var(--bg) 0%, var(--bg2) 33%, var(--bg) 66%);
-    background-size: 100% 3px;
-    color: var(--fg);
-    text-shadow: var(--shadow);
-    font: 100%/1.6 var(--font-body);
-    margin: auto;
-    max-width: 75ch;
-    word-spacing: .05em;
+	background-color: var(--bg);
+	background: linear-gradient(var(--bg) 0%, var(--bg2) 33%, var(--bg) 66%);
+	background-size: 100% 3px;
+	color: var(--fg);
+	text-shadow: var(--shadow);
+	font: 100%/1.6 var(--font-body);
+	margin: auto;
+	max-width: 75ch;
+	word-spacing: .05em;
 }
 ::selection {
 	background: var(--selection);
@@ -70,36 +70,36 @@ body {
 	text-shadow: none;
 }
 a {
-    color: var(--link);
+	color: var(--link);
 }
 a:visited {
-    color: var(--visited);
+	color: var(--visited);
 }
 a:hover,
 a:focus {
-    text-decoration: none;
+	text-decoration: none;
 }
 code,
 pre {
-    font: 100%/1.25 var(--font-mono);
+	font: 100%/1.25 var(--font-mono);
 }
 footer {
-    font: 75%/1.25 var(--font-accent);
+	font: 75%/1.25 var(--font-accent);
 }
 h1 {
-    font: bold 200%/1 var(--font-accent);
-    margin: 0.5em 0 0 0;
-    border-bottom: 0.25em solid;
+	font: bold 200%/1 var(--font-accent);
+	margin: 0.5em 0 0 0;
+	border-bottom: 0.25em solid;
 }
 h1::after {
-    content: "█";
-    display: inline-block;
-    animation: blink 2.4s steps(2) infinite;
+	content: "█";
+	display: inline-block;
+	animation: blink 2.4s steps(2) infinite;
 }
 @keyframes blink {
-    0% {
-        opacity: 0;
-    }
+	0% {
+		opacity: 0;
+	}
 }
 @media(prefers-reduced-motion: reduce) {
 	h1::after {
@@ -108,32 +108,34 @@ h1::after {
 	}
 }
 h2 {
-    font: bold 141%/1 var(--font-accent);
-    margin: 0.4em 0;
+	font: bold 141%/1 var(--font-accent);
+	margin: 0.4em 0 0 0;
 }
 h3 {
 	font: bold 117%/1 var(--font-accent);
 }
 /* NAVIGATION */
 header > nav > ul {
-    font: 100%/1.5 var(--font-accent);
-    list-style-type: none;
-    margin: 0 0 0.4em 0;
-    padding: 0;
+	font: 100%/1.5 var(--font-accent);
+	list-style-type: none;
+	margin: 0 0 0.4em 0;
+	padding: 0;
 }
 header > nav > ul > li {
-    display: inline;
+	display: inline;
 }
 header > nav > ul > li > a {
-    padding: 0.4em;
+	padding: 0.4em;
 }
 header > nav a.active {
-    background: var(--fg);
-    color: var(--bg);
+	background: var(--fg);
+	color: var(--bg);
 }
 /* SECTION */
-section {
-    border-bottom: 1px solid;
+main,
+section,
+article {
+	border-bottom: 1px solid;
 }
 /* IMAGES */
 figure {
@@ -154,6 +156,12 @@ details {
 	border: 1px solid;
 	padding: 0.4em;
 }
+/* BLOCKQUOTE */
+blockquote {
+	margin: 1em;
+	border-left: 0.25em;
+	padding-left: 1em;
+}
 /* TABLES */
 table {
 	margin: 0.4em;
@@ -165,7 +173,7 @@ tr:nth-of-type(even) {
 	background: var(--bg2);
 }
 tr td:first-child {
-    white-space: nowrap;
+	white-space: nowrap;
 }
 td {
 	padding: 0 0.4em;
diff --git a/html/blog/centralization-through-decentralization/index.html b/html/blog/centralization-through-decentralization/index.html
new file mode 100644
index 0000000..e580961
--- /dev/null
+++ b/html/blog/centralization-through-decentralization/index.html
@@ -0,0 +1,53 @@
+<!doctype html>
+<html lang=en-US dir=ltr>
+<head>
+	<title>Centralization Through Decentralization</title>
+	<meta charset=UTF-8>
+	<meta name=robots content="noindex, nofollow">
+	<meta name=viewport content="width=device-width, initial-scale=1">
+	<link rel=stylesheet href=/css/terminal.css>
+	
+</head>
+
+<body>
+<!-- todo color picker -->
+
+<header>
+	<h1>Centralization Through Decentralization</h1>
+	<nav aria-label=primary>
+		
+		<ul>
+			<li>
+				<a href="/">Home</a>
+			</li>
+			<li>
+				<a href="/blog/">Blog</a>
+			</li>
+			<li>
+				<a href="https://git.starfall.systems">Git</a>
+			</li>
+		</ul>
+	</nav>
+</header>
+
+<main>
+<p>An opinion piece was recently published in Wired magazine titled <a href="https://www.wired.com/story/the-hidden-dangers-of-the-decentralized-web/">&quot;The Hidden Dangers of the Decentralized
+Web&quot;</a>. It makes a lot of basic factual errors, conflates valid reasons to mistrust centralized social media with antisemitic conspiracy theories and grifts, and somehow even manages to make basic security practice out as conspiratorial. I'm not all that interested in giving it the time of day, except for one paragraph that stuck out to me.</p>
+<blockquote>
+<p>While the platforms offered by Meta and Alphabet are certainly not without issue, it is hard to deny the convenience of their established existence, which makes it possible to communicate, be entertained, shop, and more all in the same place. By contrast, users of decentralized platforms will need to download a slew of apps for everything they want to do online, because these features will no longer all exist in one place.</p>
+</blockquote>
+<p>Even if we accept the premise that you can somehow get by while restricting all your shopping to Facebook Marketplace, this state of things is not even 10 years old. <a href="https://about.fb.com/news/2016/10/introducing-marketplace-buy-and-sell-with-your-local-community/">Facebook Marketplace launched in 2016.</a> Youtube and Gmail are both Alphabet/Google products, but they come bundled <em>today</em> on flagship phones as two separate apps. If you want to see people whose primary presence is on Facebook, Instagram, Snapchat, Youtube, Twitch, TikTok, Tumblr... you need all of those apps installed. Or you could use your web browser, because each of those is available as a website still (despite what these corporations would want -- they push very heavily on &quot;better in the app!&quot; experiences because it gives them more ownership of what your eyeballs are doing).</p>
+<p>That's not the experience you get from decentralization. If you make an account somewhere that runs the Twitter-like Mastodon or Calckey, you can follow people from the other. Or from the 2010-era Facebook-like Friendica. Or the YouTube-like Peertube. Or the Instagram-like Pixelfed. Sign up in one place, see people everywhere. Or so the story goes. In practice, this interoperability is often kind of unstable, but it's better than the literal nothing you get between two platforms owned by different corporations (or even by the <em>same</em> corporation; Instagram stories started showing on Facebook ... a few months ago?).</p>
+<p>And do you know what I had 10 years ago that I don't now? Literally all of my instant messaging in one place. On my laptop, I had a piece of free software called Pidgin. On this one app, I was logged into MSN Messenger, Skype, ICQ, Facebook Messenger (which used XMPP until 2015), the IRC server for my university honors program, and Twitch chat (which is still <a href="https://dev.twitch.tv/docs/irc/">a version of IRC</a>). The only thing it didn't do was text messaging, but I carried a phone for that. One application, one unified experience, six accounts that I set up once and barely had to interact with again.</p>
+<p>It is not decentralization that results in &quot;app fatigue&quot; as this joke of an article calls it. If you want a centralized experience, you need stuff that's built to work together by design. Or that's hacked to work together, in the case of Pidgin/libpurple plugins talking all sorts of proprietary protocols like the AOL and Windows Live Messenger ones. Stuff built to make money off of you is incentivized to pen you in. Ever tried to use Facebook Messenger from the browser on your phone?</p>
+
+</main>
+
+<footer>
+<section>
+	<p>This site is 100% <a href=https://git.starfall.systems/web>source-available</a>. © 2020-2023 Starfall. See <a href=https://git.starfall.systems/web/tree/COPYING.md rel=license>COPYING.md</a>.
+</section>
+<div style=text-align:center>⋁/⋀</div>
+</footer>
+
+</body>
diff --git a/html/blog/feed.xml b/html/blog/feed.xml
new file mode 100644
index 0000000..bd9ac7e
--- /dev/null
+++ b/html/blog/feed.xml
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="utf-8"?>
+<feed xmlns="http://www.w3.org/2005/Atom">
+	<title>Starfall's Blog</title>
+	<link href="https://starfall.systems/blog/feed.xml" rel="self"/>
+	<link href="https://starfall.systems/blog/"/>
+	<updated>2023-05-25T01:00:00Z</updated>
+	<id>https://starfall.systems/</id>
+
+	<author>
+		<name>devin &amp; Alex Starfall</name>
+		<email>us@starfall.systems</email>
+	</author>
+
+
+	<entry>
+		<title>Centralization Through Decentralization</title>
+		<updated>2023-05-25T01:00:00Z</updated>
+		<link href="https://starfall.systems/blog/centralization-through-decentralization/"/>
+		<id>https://starfall.systems/blog/centralization-through-decentralization/</id><content type="html">&lt;p&gt;An opinion piece was recently published in Wired magazine titled &lt;a href=&quot;https://www.wired.com/story/the-hidden-dangers-of-the-decentralized-web/&quot;&gt;&amp;quot;The Hidden Dangers of the Decentralized
+Web&amp;quot;&lt;/a&gt;. It makes a lot of basic factual errors, conflates valid reasons to mistrust centralized social media with antisemitic conspiracy theories and grifts, and somehow even manages to make basic security practice out as conspiratorial. I&#39;m not all that interested in giving it the time of day, except for one paragraph that stuck out to me.&lt;/p&gt;
+&lt;blockquote&gt;
+&lt;p&gt;While the platforms offered by Meta and Alphabet are certainly not without issue, it is hard to deny the convenience of their established existence, which makes it possible to communicate, be entertained, shop, and more all in the same place. By contrast, users of decentralized platforms will need to download a slew of apps for everything they want to do online, because these features will no longer all exist in one place.&lt;/p&gt;
+&lt;/blockquote&gt;
+&lt;p&gt;Even if we accept the premise that you can somehow get by while restricting all your shopping to Facebook Marketplace, this state of things is not even 10 years old. &lt;a href=&quot;https://about.fb.com/news/2016/10/introducing-marketplace-buy-and-sell-with-your-local-community/&quot;&gt;Facebook Marketplace launched in 2016.&lt;/a&gt; Youtube and Gmail are both Alphabet/Google products, but they come bundled &lt;em&gt;today&lt;/em&gt; on flagship phones as two separate apps. If you want to see people whose primary presence is on Facebook, Instagram, Snapchat, Youtube, Twitch, TikTok, Tumblr... you need all of those apps installed. Or you could use your web browser, because each of those is available as a website still (despite what these corporations would want -- they push very heavily on &amp;quot;better in the app!&amp;quot; experiences because it gives them more ownership of what your eyeballs are doing).&lt;/p&gt;
+&lt;p&gt;That&#39;s not the experience you get from decentralization. If you make an account somewhere that runs the Twitter-like Mastodon or Calckey, you can follow people from the other. Or from the 2010-era Facebook-like Friendica. Or the YouTube-like Peertube. Or the Instagram-like Pixelfed. Sign up in one place, see people everywhere. Or so the story goes. In practice, this interoperability is often kind of unstable, but it&#39;s better than the literal nothing you get between two platforms owned by different corporations (or even by the &lt;em&gt;same&lt;/em&gt; corporation; Instagram stories started showing on Facebook ... a few months ago?).&lt;/p&gt;
+&lt;p&gt;And do you know what I had 10 years ago that I don&#39;t now? Literally all of my instant messaging in one place. On my laptop, I had a piece of free software called Pidgin. On this one app, I was logged into MSN Messenger, Skype, ICQ, Facebook Messenger (which used XMPP until 2015), the IRC server for my university honors program, and Twitch chat (which is still &lt;a href=&quot;https://dev.twitch.tv/docs/irc/&quot;&gt;a version of IRC&lt;/a&gt;). The only thing it didn&#39;t do was text messaging, but I carried a phone for that. One application, one unified experience, six accounts that I set up once and barely had to interact with again.&lt;/p&gt;
+&lt;p&gt;It is not decentralization that results in &amp;quot;app fatigue&amp;quot; as this joke of an article calls it. If you want a centralized experience, you need stuff that&#39;s built to work together by design. Or that&#39;s hacked to work together, in the case of Pidgin/libpurple plugins talking all sorts of proprietary protocols like the AOL and Windows Live Messenger ones. Stuff built to make money off of you is incentivized to pen you in. Ever tried to use Facebook Messenger from the browser on your phone?&lt;/p&gt;
+</content>
+	</entry>
+
+</feed>
diff --git a/html/blog/index.html b/html/blog/index.html
new file mode 100644
index 0000000..e81f4d2
--- /dev/null
+++ b/html/blog/index.html
@@ -0,0 +1,64 @@
+<!doctype html>
+<html lang=en-US dir=ltr>
+<head>
+	<title>~/blog</title>
+	<meta charset=UTF-8>
+	<meta name=robots content="noindex, nofollow">
+	<meta name=viewport content="width=device-width, initial-scale=1">
+	<link rel=stylesheet href=/css/terminal.css>
+	<link rel=alternate type=application/atom+xml title=Atom href=feed.xml>
+</head>
+
+<body>
+<!-- todo color picker -->
+
+<header>
+	<h1>~/blog</h1>
+	<nav aria-label=primary>
+		
+		<ul>
+			<li>
+				<a href="/">Home</a>
+			</li>
+			<li>
+				<a href="/blog/" class="active" aria-current="page">Blog</a>
+			</li>
+			<li>
+				<a href="https://git.starfall.systems">Git</a>
+			</li>
+		</ul>
+	</nav>
+</header>
+
+<main>
+<style>
+.feed-icon {
+	display: block;
+	float: right;
+	height: 1em;
+	width: 1em;
+	background: url('/img/feed-icon.svg') center/contain, var(--fg);
+	background-blend-mode: luminosity;
+	mask: url('/img/feed-icon.svg') 0 0/100% 100%;
+}
+</style>
+<a href=feed.xml alt="Atom feed" class=feed-icon></a>
+
+<article class=blogpost>
+	<h2><a href="/blog/centralization-through-decentralization/">Centralization Through Decentralization</a></h2>
+	<time datetime="2023-05-25 01:00:00.000Z" title="2023-05-25 01:00:00.000Z">
+		2023-05-24
+	</time></article>
+
+
+
+</main>
+
+<footer>
+<section>
+	<p>This site is 100% <a href=https://git.starfall.systems/web>source-available</a>. © 2020-2023 Starfall. See <a href=https://git.starfall.systems/web/tree/COPYING.md rel=license>COPYING.md</a>.
+</section>
+<div style=text-align:center>⋁/⋀</div>
+</footer>
+
+</body>
diff --git a/html/index.html b/html/index.html
index 8532e2c..4095c0c 100755
--- a/html/index.html
+++ b/html/index.html
@@ -12,6 +12,7 @@
 	<nav aria-label=primary>
 		<ul>
 			<li><a href=/ class="active" aria-current="page">Home</a>
+			<li><a href=/blog>Blog</a>
 			<li><a href=/resources>Resources</a>
 			<li><a href=https://git.starfall.systems>Git</a>
 		</ul>
diff --git a/img/feed-icon.svg b/img/feed-icon.svg
new file mode 100755
index 0000000..0585d8a
--- /dev/null
+++ b/img/feed-icon.svg
@@ -0,0 +1,17 @@
+<?xml version="1.0"?>

+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> 

+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="128px" height="128px" id="RSSicon" viewBox="0 0 256 256">

+<defs>

+<linearGradient x1="0.085" y1="0.085" x2="0.915" y2="0.915" id="RSSg">

+<stop  offset="0.0" stop-color="#808080"/><stop  offset="0.2785" stop-color="#929292"/>

+<stop  offset="0.5" stop-color="#9B9B9B"/><stop  offset="0.5871" stop-color="#919191"/>

+<stop  offset="0.8427" stop-color="#797979"/><stop  offset="1.0" stop-color="#707070"/>

+</linearGradient>

+</defs>

+<rect width="256" height="256" rx="55" ry="55" x="0"  y="0"  fill="#777777"/>

+<rect width="246" height="246" rx="50" ry="50" x="5"  y="5"  fill="#999999"/>

+<rect width="236" height="236" rx="47" ry="47" x="10" y="10" fill="url(#RSSg)"/>

+<circle cx="68" cy="189" r="24" fill="#FFF"/>

+<path d="M160 213h-34a82 82 0 0 0 -82 -82v-34a116 116 0 0 1 116 116z" fill="#FFF"/>

+<path d="M184 213A140 140 0 0 0 44 73 V 38a175 175 0 0 1 175 175z" fill="#FFF"/>

+</svg>