Compare commits
12 Commits
Author | SHA1 | Date |
---|---|---|
~erin | 42271971c9 | |
~erin | 4c883d8794 | |
~erin | 71655345c2 | |
~erin | 6daf5f434c | |
~erin | 64c9f498e3 | |
~erin | 7a5b6079a2 | |
~erin | ab32d3b501 | |
~erin | ddef316ab8 | |
~erin | afce610551 | |
~erin | abb6e07056 | |
~erin | 5c0edca9a6 | |
~erin | d73f80da6d |
|
@ -8,7 +8,7 @@ posts:
|
||||||
|
|
||||||
# Page/Post options
|
# Page/Post options
|
||||||
syntax_highlight:
|
syntax_highlight:
|
||||||
theme: "base16-ocean.dark"
|
theme: "base16-mocha.dark"
|
||||||
enabled: true
|
enabled: true
|
||||||
assets:
|
assets:
|
||||||
sass:
|
sass:
|
||||||
|
|
|
@ -1,44 +1,44 @@
|
||||||
<footer class="section">
|
<div class="footer">
|
||||||
<div class="inner-section">
|
<footer>
|
||||||
<ul>
|
<ul class="container">
|
||||||
<li><h3>Copyright:</h3></li>
|
<li class="item-left">
|
||||||
|
<h3>Copyright:</h3>
|
||||||
<li><a class="license" href="/cnpl.html">© CNPLv7+</a></li>
|
<p>Code licensed under the <span><a class="license" href="/cnpl.html">© CNPLv7+</a></span></p>
|
||||||
|
|
||||||
<li>
|
|
||||||
<!--<p>Pride badges by <span><a href="https://matthil.de/">matthilde</a></span> under public domain</p>-->
|
<!--<p>Pride badges by <span><a href="https://matthil.de/">matthilde</a></span> under public domain</p>-->
|
||||||
<p>Fira Code Font <span><a href="https://github.com/tonsky/FiraCode/blob/master/LICENSE">SIL Open Font License</a></span></p>
|
<p>Fira Code Font <span><a href="https://github.com/tonsky/FiraCode/blob/master/LICENSE">SIL Open Font License</a></span></p>
|
||||||
<p>Generated using <span><a href="https://cobalt-org.github.io/">cobalt</a></span></p>
|
<p>Generated using <span><a href="https://cobalt-org.github.io/">cobalt</a></span></p>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li><h3>Mirrors:</h3></li>
|
<li class="item-middle">
|
||||||
|
<h3>Mirrors:</h3>
|
||||||
|
|
||||||
<li>
|
<b><a href="http://pqr366modvw3zz3io4s3azvketwmubcnviw4tt7okyzrmoleh5gjbqyd.onion">Onion</a></b>
|
||||||
<a href="http://pqr366modvw3zz3io4s3azvketwmubcnviw4tt7okyzrmoleh5gjbqyd.onion">Onion</a>
|
<br>
|
||||||
<a href="gemini://the-system.eu.org">Gemini</a>
|
<b><a href="gemini://the-system.eu.org">Gemini</a></b>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<li><h3>
|
<li class="item-right">
|
||||||
|
<h3>Webrings</h3>
|
||||||
|
<h4>
|
||||||
<span><a href="https://emreed.net/LowTech_Directory.html">🔗</a>
|
<span><a href="https://emreed.net/LowTech_Directory.html">🔗</a>
|
||||||
</span> Low-Tech Webring:
|
</span> Low-Tech Webring:
|
||||||
</h3></li>
|
</h4>
|
||||||
|
|
||||||
<li>
|
|
||||||
<a href="https://sadgrl.online">Sadness</a>
|
<a href="https://sadgrl.online">Sadness</a>
|
||||||
<span><--></span>
|
<span><--></span>
|
||||||
<a href="https://mrshll.com">mrshll</a>
|
<a href="https://mrshll.com">mrshll</a>
|
||||||
</li>
|
|
||||||
|
|
||||||
<li><h3>
|
<h4>
|
||||||
<span><a href="https://ring.bicompact.space">🔗</a>
|
<span><a href="https://ring.bicompact.space">🔗</a>
|
||||||
</span> Armisael Webring:
|
</span> Armisael Webring:
|
||||||
</h3></li>
|
</h4>
|
||||||
<li>
|
|
||||||
<a href="https://5snb.club">5225225</a>
|
<a href="https://5snb.club">5225225</a>
|
||||||
<span><--></span>
|
<span><--></span>
|
||||||
<a href="https://unix.lgbt/~kakuko/sanctuary">syntropy</a>
|
<a href="https://unix.lgbt/~kakuko/sanctuary">syntropy</a>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
|
||||||
<a rel="me" href="https://transmom.love/@erin" style="display:none"></a>
|
<a rel="me" href="https://transmom.love/@erin" style="display:none"></a>
|
||||||
</footer>
|
</footer>
|
||||||
|
</div>
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
<div class="menu">
|
||||||
<nav>
|
<nav>
|
||||||
<ul>
|
<ul>
|
||||||
<li class="one"><a class="button" href="/">Home</a></li>
|
<li class="one"><a class="button" href="/">Home</a></li>
|
||||||
|
@ -8,3 +9,4 @@
|
||||||
<li class="six"><a class="button" href="/rss.xml">RSS</a></li>
|
<li class="six"><a class="button" href="/rss.xml">RSS</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
|
</div>
|
||||||
|
|
|
@ -5,9 +5,9 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
<div class="content">
|
||||||
{% include "navigation.liquid" %}
|
{% include "navigation.liquid" %}
|
||||||
<div class="section">
|
<div class="main">
|
||||||
<div class="inner-section">
|
|
||||||
<main>
|
<main>
|
||||||
{{ page.content }}
|
{{ page.content }}
|
||||||
{% for post in collections.posts.pages %}
|
{% for post in collections.posts.pages %}
|
||||||
|
@ -27,7 +27,7 @@
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</main>
|
</main>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
{% include "footer.liquid" %}
|
{% include "footer.liquid" %}
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -5,14 +5,14 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
<div class="content">
|
||||||
{% include "navigation.liquid" %}
|
{% include "navigation.liquid" %}
|
||||||
<div class="section">
|
<div class="main">
|
||||||
<div class="inner-section">
|
|
||||||
<main>
|
<main>
|
||||||
{{ page.content }}
|
{{ page.content }}
|
||||||
</main>
|
</main>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
{% include "footer.liquid" %}
|
{% include "footer.liquid" %}
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,34 +1,30 @@
|
||||||
html {
|
html {
|
||||||
image-rendering: pixelated;
|
font-size: 1.1em;
|
||||||
image-rendering: crisp-edges;
|
font-family: 'Atkinson Hyperlegible', sans-serif;
|
||||||
font-size: 16px;
|
|
||||||
color: $foreground-color;
|
color: $foreground-color;
|
||||||
line-height: 1.50;
|
line-height: 1.50;
|
||||||
|
background-image: url('/assets/mushrooms.webp');
|
||||||
|
background-repeat: repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header { grid-area: header; }
|
||||||
|
.menu { grid-area: menu; }
|
||||||
|
.main {
|
||||||
|
grid-area: main;
|
||||||
background: $background-color;
|
background: $background-color;
|
||||||
|
margin: 10px;
|
||||||
|
margin-left: 0px;
|
||||||
|
padding: 20px;
|
||||||
|
border-radius: 2px;
|
||||||
}
|
}
|
||||||
|
.footer { grid-area: footer; }
|
||||||
|
|
||||||
/* Smooth scrolling IF user doesn't have a preference due to motion sensitivities */
|
.content {
|
||||||
@media screen and (prefers-reduced-motion: no-preference) {
|
display: grid;
|
||||||
html {
|
grid-template-areas:
|
||||||
scroll-behavior: smooth;
|
'header header header header header header'
|
||||||
}
|
'menu main main main main main'
|
||||||
|
'menu footer footer footer footer footer';
|
||||||
|
gap: 10px;
|
||||||
|
padding: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.section {
|
|
||||||
border-radius: 35px;
|
|
||||||
background: $background-color;
|
|
||||||
box-shadow: 5px 5px 17px scale-color($background-color, $lightness: -35%),
|
|
||||||
-5px -5px 17px scale-color($background-color, $lightness: +5%);
|
|
||||||
max-width: 20cm;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.inner-section {
|
|
||||||
border-radius: 35px;
|
|
||||||
background: $background-color;
|
|
||||||
max-width: 18cm;
|
|
||||||
margin: 0 auto;
|
|
||||||
margin-top: 5mm;
|
|
||||||
padding: 2mm 3mm;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
|
@ -1,17 +1,27 @@
|
||||||
footer {
|
footer {
|
||||||
|
background: $background-color;
|
||||||
|
h1, h2, h3 { margin-left: 0px; margin-top: 0px;}
|
||||||
|
h4 { margin-left: 0px; }
|
||||||
|
padding: 20px;
|
||||||
|
margin: 10px;
|
||||||
|
margin-left: auto;
|
||||||
|
border-radius: 2px;
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
margin: auto;
|
color: $foreground-color;
|
||||||
padding: 5px;
|
}
|
||||||
|
|
||||||
|
.item-left { grid-area: item-left; };
|
||||||
|
.item-middle { grid-area: item-middle; };
|
||||||
|
.item-right { grid-area: item-right; };
|
||||||
|
|
||||||
|
.container {
|
||||||
|
margin: 0px;
|
||||||
|
padding-left: 0px;
|
||||||
display: grid;
|
display: grid;
|
||||||
|
grid-template-columns: 500px 250px 250px;
|
||||||
li {
|
grid-template-rows: auto;
|
||||||
|
grid-template-areas: "item-left item-middle item-right";
|
||||||
h3 {
|
|
||||||
margin-top: auto;
|
|
||||||
}
|
|
||||||
font-size: 18px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,105 +1,52 @@
|
||||||
// Buttons
|
h2 {
|
||||||
.button {
|
margin-top: 1cm;
|
||||||
margin-right: 10px;
|
margin-bottom: 0;
|
||||||
margin-bottom: 25px;
|
margin-left: 5px;
|
||||||
@media only screen and (max-width: 600px) {
|
}
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
padding: 10px;
|
|
||||||
padding-left: 15px;
|
|
||||||
padding-right: 15px;
|
|
||||||
border-radius: 32px;
|
|
||||||
text-decoration: none;
|
|
||||||
text-align: center;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: all 0.1s ease-in-out;
|
|
||||||
border-radius: 10px;
|
|
||||||
background: $background-color;
|
|
||||||
box-shadow: 5px 5px 10px scale-color($background-color, $lightness: -35%),
|
|
||||||
-5px -5px 10px scale-color($background-color, $lightness: +5%);
|
|
||||||
|
|
||||||
&:hover {
|
h3 {
|
||||||
background: linear-gradient(145deg,
|
margin-top: 1cm;
|
||||||
scale-color($background-color, $lightness: -35%),
|
margin-bottom: 0;
|
||||||
scale-color($background-color, $lightness: +5%));
|
margin-left: 10px;
|
||||||
|
|
||||||
box-shadow: 5px 5px 10px scale-color($background-color, $lightness: -35%),
|
|
||||||
-5px -5px 10px scale-color($background-color, $lightness: +5%);
|
|
||||||
}
|
|
||||||
&:active {
|
|
||||||
background: linear-gradient(145deg,
|
|
||||||
scale-color($background-color, $lightness: -35%),
|
|
||||||
scale-color($background-color, $lightness: +5%));
|
|
||||||
|
|
||||||
box-shadow: 5px 5px 10px scale-color($background-color, $lightness: -35%),
|
|
||||||
-5px -5px 10px scale-color($background-color, $lightness: +5%);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: $accent-color;
|
color: $accent-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:visited {
|
code {
|
||||||
color: $light-color;
|
border-radius: 5px;
|
||||||
}
|
border: 1px solid #FAE3B0;
|
||||||
|
border-bottom: 3px solid #FAE3B0;
|
||||||
ul, ol {
|
|
||||||
color: #C3BAC6;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote {
|
|
||||||
margin-left: 5mm;
|
|
||||||
padding-left: 2mm;
|
|
||||||
color: scale-color($foreground-color, $lightness: -10%);
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote {
|
|
||||||
border-left: 4px solid #F28FAD;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote blockquote {
|
|
||||||
border-left: 4px solid #F8BD96;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote blockquote blockquote {
|
|
||||||
border-left: 4px solid #FAE3B0;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote blockquote blockquote blockquote {
|
|
||||||
border-left: 4px solid #ABE9B3;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote blockquote blockquote blockquote blockquote {
|
|
||||||
border-left: 4px solid #B5E8E0;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote blockquote blockquote blockquote blockquote blockquote {
|
|
||||||
border-left: 4px solid #96CDFB;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote blockquote blockquote blockquote blockquote blockquote blockquote {
|
|
||||||
border-left: 4px solid #DDB6F2;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
code, pre {
|
code, pre {
|
||||||
font-family: "Fira Code", monospace;
|
font-family: "Fira Code", monospace;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
border-radius: 10px;
|
border-radius: 2px;
|
||||||
padding: 10px;
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
background: $background-color !important;
|
.date {
|
||||||
box-shadow: inset 5px 5px 10px scale-color($background-color, $lightness: -35%),
|
font-size: 0.8em;
|
||||||
inset -5px -5px 10px scale-color($background-color, $lightness: +5%);
|
}
|
||||||
@media only screen and (min-width: 600px) {
|
|
||||||
display: inline-block;
|
@media only screen and (min-width: 600px) {
|
||||||
max-width: 18cm;
|
code, pre {
|
||||||
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
code {
|
@media only screen and (max-width: 600px) {
|
||||||
display: inline;
|
code, pre {
|
||||||
font-size: 14px;
|
display: inline-block;
|
||||||
|
max-width: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
max-width: 75%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
p code {
|
p code {
|
||||||
|
@ -107,40 +54,37 @@ p code {
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (max-width: 600px) {
|
blockquote {
|
||||||
code {
|
margin-left: 5mm;
|
||||||
display: inline-block;
|
padding-left: 2mm;
|
||||||
max-width: 95%;
|
color: #4D4137; }
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
blockquote {
|
||||||
|
border-left: 4px solid #F28FAD; }
|
||||||
|
|
||||||
h1 {
|
blockquote blockquote {
|
||||||
font-size: 30px;
|
border-left: 4px solid #F8BD96; }
|
||||||
font-weight: normal;
|
|
||||||
border-bottom: 4px solid #F28FAD;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
blockquote blockquote blockquote {
|
||||||
font-size: 25px;
|
border-left: 4px solid #FAE3B0; }
|
||||||
font-weight: normal;
|
|
||||||
margin-top: 1cm;
|
|
||||||
margin-bottom: 0;
|
|
||||||
border-bottom: 2px solid #F8BD96;
|
|
||||||
}
|
|
||||||
|
|
||||||
h3 {
|
blockquote blockquote blockquote blockquote {
|
||||||
font-size: 22px;
|
border-left: 4px solid #ABE9B3; }
|
||||||
font-weight: normal;
|
|
||||||
margin-top: 1cm;
|
blockquote blockquote blockquote blockquote blockquote {
|
||||||
margin-bottom: 0;
|
border-left: 4px solid #B5E8E0; }
|
||||||
|
|
||||||
|
blockquote blockquote blockquote blockquote blockquote blockquote {
|
||||||
|
border-left: 4px solid #96CDFB; }
|
||||||
|
|
||||||
|
blockquote blockquote blockquote blockquote blockquote blockquote blockquote {
|
||||||
|
border-left: 4px solid #DDB6F2; }
|
||||||
|
|
||||||
|
ul, ol {
|
||||||
|
color: #4D4137;
|
||||||
}
|
}
|
||||||
|
|
||||||
::selection {
|
::selection {
|
||||||
color: $background-color;
|
color: $background-color;
|
||||||
background: $foreground-color;
|
background: $foreground-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tags {
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,8 +0,0 @@
|
||||||
img {
|
|
||||||
border-radius: 10px;
|
|
||||||
display: block;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
box-shadow: 8px 8px 23px #060606,
|
|
||||||
-8px -8px 23px #16161a;
|
|
||||||
}
|
|
|
@ -1,46 +1,21 @@
|
||||||
@media only screen and (min-width: 600px) {
|
|
||||||
nav {
|
nav {
|
||||||
max-width: 20cm;
|
margin: 10px;
|
||||||
margin: auto;
|
border-radius: 2px;
|
||||||
padding-top: 10px;
|
padding: 20px;
|
||||||
font-size: 20px;
|
width: 200px;
|
||||||
|
background: $background-color;
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
padding: 0;
|
padding: 10px;
|
||||||
display: grid;
|
font-size: 1.3em;
|
||||||
grid-auto-flow: column;
|
|
||||||
|
|
||||||
li {
|
font-weight: bold;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (max-width: 600px) {
|
|
||||||
nav {
|
|
||||||
font-size: 20px;
|
|
||||||
list-style: none;
|
|
||||||
|
|
||||||
ul {
|
|
||||||
list-style: none;
|
|
||||||
|
|
||||||
padding: 0px;
|
|
||||||
margin: auto;
|
|
||||||
display: grid;
|
|
||||||
|
|
||||||
grid-template-columns: repeat(3, 1fr);
|
|
||||||
gap: 10px;
|
|
||||||
grid-auto-rows: minmax(50px, auto);
|
|
||||||
align-content: center;
|
|
||||||
|
|
||||||
li {
|
|
||||||
padding: 0px;
|
|
||||||
margin: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
Binary file not shown.
Binary file not shown.
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
After Width: | Height: | Size: 335 B |
Binary file not shown.
After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
After Width: | Height: | Size: 59 KiB |
Binary file not shown.
After Width: | Height: | Size: 7.1 KiB |
22
index.md
22
index.md
|
@ -5,28 +5,6 @@ layout: default.liquid
|
||||||
|
|
||||||
Hi! We're The System.
|
Hi! We're The System.
|
||||||
|
|
||||||
## Friends
|
|
||||||
|
|
||||||
[Charlotte](https://char.lt/)
|
|
||||||
|
|
||||||
[Agatha](https://technogothic.net/)
|
|
||||||
|
|
||||||
[annie](https://versary.town/)
|
|
||||||
|
|
||||||
[elysia](http://alphamethyl.barr0w.net/~elysia/)
|
|
||||||
|
|
||||||
[Luna](https://kitty.lgbt)
|
|
||||||
|
|
||||||
[Naia](https://naia.gay)
|
|
||||||
|
|
||||||
[mira](https://boxin.space)
|
|
||||||
|
|
||||||
[~keith](https://keithhacks.cyou)
|
|
||||||
|
|
||||||
[anna](https://fef.moe)
|
|
||||||
|
|
||||||
[Kescher](https://kescher.at)
|
|
||||||
|
|
||||||
## Projects
|
## Projects
|
||||||
Most of the projects here are unfinished or not very useful, sorry.
|
Most of the projects here are unfinished or not very useful, sorry.
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,39 @@
|
||||||
|
---
|
||||||
|
title: How This Site Works
|
||||||
|
categories:
|
||||||
|
- technology
|
||||||
|
published_date: "2022-05-13 14:22:13 +0000"
|
||||||
|
layout: default.liquid
|
||||||
|
is_draft: false
|
||||||
|
---
|
||||||
|
# How This Site Works
|
||||||
|
|
||||||
|
Decided to just make a quick post to go over how this site is made and updated.
|
||||||
|
|
||||||
|
## Technical Stuff
|
||||||
|
|
||||||
|
I've gone through a few iterations, all the previous times I would just hand write HTML and CSS, which worked, but was annoying if I wanted to change stuff.
|
||||||
|
|
||||||
|
So this time I decided to switch to a static site generator, [Cobalt](https://cobalt-org.github.io/).
|
||||||
|
It's pretty nice, and written in Rust too.
|
||||||
|
|
||||||
|
It was kind of hard to figure out how to do some stuff, since the docs kind of suck.
|
||||||
|
But eventually I figured it out and now it works well.
|
||||||
|
|
||||||
|
Pages are Liquid templates (kind of like HTML), which I only need to edit if I want to change layout stuff, and I don't do that very often.
|
||||||
|
|
||||||
|
Styling is done with SCSS, which compiles down to plain CSS. It's *really* nice to work with, especially since I can keep stuff separated into different files.
|
||||||
|
|
||||||
|
## Updating
|
||||||
|
|
||||||
|
All the posts & pages are just written in simple Markdown, which makes it nice to write and edit just the content.
|
||||||
|
|
||||||
|
Once I've updated it, I simply run an rsync command to update it on both servers. I have a VPS I use for the main site (owned by one of my partners), and a Raspberry Pi 3 I use for the onion site mirror.
|
||||||
|
|
||||||
|
I also have it stored as a git repository, as a backup, and so that people can look at the code for reference.
|
||||||
|
|
||||||
|
To make a new blog post, I simply run `cobalt new "Name" -f posts`, and cobalt will create a new Markdown file for me, in the posts directory, with all the metadata.
|
||||||
|
|
||||||
|
I then open it up in Neovim, and start writing. At the end I'll enable spellcheck and fix the many mistakes I've made.
|
||||||
|
|
||||||
|
I can then run `cobalt publish posts/Name.md` and it'll rename the file, and add a published date to the metadata. I then just run the rsync command, and it's live on the site!
|
|
@ -0,0 +1,75 @@
|
||||||
|
---
|
||||||
|
title: A Quick Overview Of SSB
|
||||||
|
description: My experience with Secure Scuttlebutt as a not-very-technical user
|
||||||
|
categories:
|
||||||
|
- scuttlebutt
|
||||||
|
- technology
|
||||||
|
published_date: "2022-05-14 20:33:24 +0000"
|
||||||
|
layout: default.liquid
|
||||||
|
is_draft: false
|
||||||
|
---
|
||||||
|
# A Quick Overview Of SSB
|
||||||
|
|
||||||
|
[Secure Scuttlebutt](https://scuttlebutt.nz/) (or SSB for short), is a P2P social network.
|
||||||
|
It works with a gossip protocol, you get new posts from people you follow, or people who those people follow, etc.
|
||||||
|
|
||||||
|
You can connect with users over the internet via servers, either pubs (which store data, and act like users themselves), or rooms (which work more to just connect users).
|
||||||
|
But you can also connect over bluetooth, or local networks.
|
||||||
|
|
||||||
|
The best way to get connected to the network would be to have someone nearbly that you can meet up with in person, but that's kind of hard to do.
|
||||||
|
I'd recommend joining a few smaller room/pub servers to get started.
|
||||||
|
|
||||||
|
But since all the data is stored locally on your device first, it works completely offline!
|
||||||
|
You can read posts, reply to them, make posts, change your profile, and everything, while being fully offline!
|
||||||
|
The changes are synced next time you go back online.
|
||||||
|
|
||||||
|
The official site explains how the network works with a really cute video!
|
||||||
|
|
||||||
|
Unfortunately, this can cause it to take up quite a bit of space, especially if you follow a lot of users.
|
||||||
|
My current database takes up about `7.7GB`.
|
||||||
|
|
||||||
|
## Culture
|
||||||
|
I've tried a few P2P social platforms, but this is the only one I've stuck with.
|
||||||
|
|
||||||
|
The main reason for this is the people on it.
|
||||||
|
|
||||||
|
Most other platforms are filled with cryptobros, blockchain shit, and people throwing slurs around.
|
||||||
|
Scuttlebutt, on the other hand, is filled with left-leaning solarpunks and queer friendly people.
|
||||||
|
|
||||||
|
It's a really friendly environment. And while a *majority* of posts are about technology, there's lot's of other stuff going on too!
|
||||||
|
Lot's of people posting about anarchism, their gardens, cool mushrooms they found, and everything else.
|
||||||
|
|
||||||
|
Howver, it does feel fairly slow. I follow quite a few users, but don't get a lot of posts in my feed all that ofter.
|
||||||
|
This is nice though, I think. It contrasts the high speed of other standard social media.
|
||||||
|
|
||||||
|
## Moderation and Safety
|
||||||
|
As it is a P2P platform, you are the only moderator of your content.
|
||||||
|
|
||||||
|
Currently the main options are to block a user, and to ignore them, which just hides their posts from your view.
|
||||||
|
You can see when other users block accounts, so you can copy the blocks of someone you trust.
|
||||||
|
|
||||||
|
I think there are plans to implement better moderation technology, with something like [trustnet](https://cblgh.org/trustnet/).
|
||||||
|
|
||||||
|
However, this hasn't really been much of a problem for me so far. The worst I've seen is some spam, but those people get easily blocked.
|
||||||
|
I haven't seen any sort of harassment or awfulness like on the Fediverse, or Twitter.
|
||||||
|
Maybe that's because it's so small, maybe it's because they're just turned off by the culture immediately, or maybe they just haven't made it into my social graph.
|
||||||
|
|
||||||
|
There is no way to delete content at the moment. This is mainly a technical problem, as user feeds are represented as append-only logs, and you'd have to propogate deletion requests to all users, and there would be no way to ensure everyone has deleted it.
|
||||||
|
|
||||||
|
Again, there are plans to implement a way of deleting content however.
|
||||||
|
|
||||||
|
SSB is currently in heavy development, and features are being changed and added all the time.
|
||||||
|
|
||||||
|
## Clients
|
||||||
|
The way you interact with the SSB network is with one of various clients. There are currently clients for various platforms, including desktop, web, and mobile (iOS & Android).
|
||||||
|
|
||||||
|
The client I'm using at the moment is [Manyverse](https://manyver.se), and it's probably one of the most "modern" ones, currently in active development, working on new features all the time, and it works on both mobile and desktop.
|
||||||
|
|
||||||
|
Some other good clients are [Planetary](https://www.planetary.social/) for iOS, and [oasis](https://github.com/fraction/oasis) for web.
|
||||||
|
You can find a list of clients [here](https://handbook.scuttlebutt.nz/applications).
|
||||||
|
|
||||||
|
Most of the development is being done with Javascript, and other web technologies, however more recently there is work being done on making native Rust libraries.
|
||||||
|
There are various plans to try and document more, and make it simpler for people to create clients. Diversity of clients is good!
|
||||||
|
|
||||||
|
I'm currently working on a native Linux client written in Rust, using the GTK4 toolkit.
|
||||||
|
There's a test site up at the moment [here](https://waterdrinkers.gay).
|
|
@ -1,6 +1,5 @@
|
||||||
$background-color: #161320;
|
$background-color: #F9F6F0;
|
||||||
$foreground-color: #D9E0EE;
|
$foreground-color: #241A11;
|
||||||
$light-color: #F5C2E7;
|
$accent-color: #cd2b29;
|
||||||
$accent-color: #F2CDCD;
|
|
||||||
|
|
||||||
@import '_scss/base', '_scss/formatting', '_scss/navigation', '_scss/footer', '_scss/image';
|
@import '_scss/base', '_scss/formatting', '_scss/footer', '_scss/navigation';
|
||||||
|
|
|
@ -1,3 +1,3 @@
|
||||||
#!/bin/zsh
|
#!/bin/zsh
|
||||||
rsync -rauz --del --groupmap=erin:www-data --progress _site/ erin@is-cute.ml:~/website
|
rsync -rauz --del --groupmap=erin:www-data --progress _site/ erin@is-cute.ml:~/website
|
||||||
rsync -rauz --del --groupmap=erin:www-editors --progress _site/ meow-onion:/mnt/www/website
|
rsync -rauz --del --groupmap=erin:www-editors --progress _site/ meow:/mnt/www/website
|
||||||
|
|
Loading…
Reference in New Issue