addressing feedback

.drone.yml

@@ -0,0 +1,24 @@
+---
+kind: pipeline
+name: default
+
+steps:
+- name: build and publish docker image
+  image: plugins/docker
+  settings:
+    repo: git.coopcloud.tech/rtm/rtmwebsite
+    tags:
+      - main
+      - latest
+      - 0.0.8
+    platform: linux/amd64
+    username:
+      from_secret: USERNAME
+    password:
+      from_secret: PASSWORD
+    registry: git.coopcloud.tech
+trigger:
+  branch:
+    - main
+  event:
+    - push

.gitignore

@@ -24,4 +24,7 @@ pnpm-debug.log*
 .idea/
 
 # Emacs
-*~
+*~
+
+# Drone
+.drone.secrets

README.md

@@ -1,3 +1,5 @@
+[![Build Status](https://build.coopcloud.tech/api/badges/RTM/rtm-website/status.svg)](https://build.coopcloud.tech/RTM/rtm-website)
+
 # hello friends !
 
 
@@ -46,6 +48,8 @@ npx astro dev
 
 ## Build in the docker image (make sure you have Docker installed!)
 
+Set the version to the next [semantic version](https://semver.org/) after the version posted at [our co-op cloud's packages site](https://git.coopcloud.tech/RTM/-/packages) under "rtmwebsite":
+
 ``` bash
 version=<specify-version>
 docker build --platform linux/amd64 -t git.coopcloud.tech/rtm/rtmwebsite:$version .
@@ -60,10 +64,63 @@ Check out [this documentation](https://docs.gitea.com/next/usage/packages/contai
 docker push git.coopcloud.tech/rtm/rtmwebsite:$version
 ```
 
+At [our co-op cloud's packages site](https://git.coopcloud.tech/RTM/-/packages), click on "rtmwebsite" and check that the version mentioned is the version you specified!
+
 ## Update recipe
 
-We use a [private recipe](https://git.coopcloud.tech/RTM/rtm-astro-recipe) to deploy this website, you will need to update the version in the compose.yml file and redoploy.
+We use a [private recipe](https://git.coopcloud.tech/RTM/rtm-astro-recipe) to deploy this website. This step needs Wireguard to be activated (download Wireguard and ask Sootie's owner to create a config for you and give you Docker permissions). The following examples will assume your name in Sootie's config is "blueberry"!
 
+You will need to have wget (`brew install wget` on mac) and [abra](https://docs.coopcloud.tech/abra/) installed.
+
+Create an SSH key to use with Sootie with the following command. Take note of the file where you save the key. The following examples will assume it is saved to `rtm` and that the `.ssh` directory is in your home directory (which you can find with the command `echo $HOME`).
+
+```ssh-keygen -t ed25519```
+
+
+Run the following commands to install the SSH key to Sootie as an authorized key:
+
+```
+ssh-copy-id -i $HOME/.ssh/rtm.pub blueberry@resisttechmonopolies.online
+ssh -i $HOME/.ssh/rtm 'blueberry@resisttechmonopolies.online'          
+```
+
+
+In the `$HOME/.ssh/config` file (which you may have to create if it does not exist), paste the following:
+
+```
+Host resisttechmonopolies.online
+  Hostname resisttechmonopolies.online
+  User blueberry
+  UseKeychain yes
+  IdentityFile ~/.ssh/rtm
+```
+
+You should now be able to SSH into Sootie with just the command `ssh resisttechmonopolies.online`
+
+
+Run the following command (outside of the terminal in which you ran ssh in the previous step)
+
+```abra server add resisttechmonopolies.online```
+
+Clone the `sootie-config` repo into your `$HOME/.abra/servers/resisttechmonopolies.online` directory:
+
+``` bash
+git clone https://git.coopcloud.tech/RTM/sootie-config.git .
+# DON'T FORGET THE . AT THE END OF THE COMMAND
+```
+
+Clone the `rtm-astro-recipe` repo into your `$HOME/.abra/recipes` directory:
+
+```git clone https://git.coopcloud.tech/RTM/rtm-astro-recipe.git```
+
+
+Update the version number to the latest in 
+
+``` bash
+.abra/servers/resisttechmonopolies.online/resisttechmonopolies.online.env
+```
+
+Then
 ``` bash
 abra app undeploy resisttechmonopolies.online
 # wait 10 seconds

src/components/Card.astro

@@ -0,0 +1,24 @@
+---
+export interface Props {
+  title: string;
+  bigTech: string;
+  alternatives: Array<{ name: string; description: string; url: string }>;
+  bgClass: string;
+}
+
+const { title, bigTech, alternatives, bgClass } = Astro.props;
+---
+
+<div class={`border rounded-lg p-6 shadow-md ${bgClass} text-gray-900`}>
+  <h2 class="text-2xl font-semibold mb-4">{title}</h2>
+  <p class="text-base mb-4"><span class="line-through">Big Tech Option: {bigTech}</span></p>
+  <ul class="space-y-4">
+    {alternatives.map(alt => (
+      <li>
+        <h3 class="text-lg font-bold underline">{alt.name}</h3>
+        <p>{alt.description}</p>
+        <a href={alt.url} class="text-blue-500 hover:text-blue-700">Website</a>
+      </li>
+    ))}
+  </ul>
+</div>

src/components/Navbar.tsx

@@ -41,8 +41,8 @@ export default function Navbar({ activePage = "" }: NavbarProps) {
       </div>
 
       <div className={cn("flex flex-row justify-between pb-8")}>
-        <div className="w-full grid grid-flow-col auto-cols-[76px] gap-8">
-          {Array.from({ length: 20 }).map((_, index) => (
+        <div className="w-full grid grid-flow-col">
+          {Array.from({ length: 12 }).map((_, index) => (
             <div key={index} className="flex justify-center">
               <img 
                 src={index % 2 === 0 ? "/assets/computer.png" : "/assets/people.png"} 

src/pages/PointsOfUnity.astro

@@ -45,7 +45,7 @@ import "../styles/globals.css";
           stolen Coast Salish land covered by the broken Treaty of Point Elliot
           of 1855, we understand how our labor is contributing - directly or
           indirectly - to these oppressions, and seek to use our skills towards
-          more liberatory ends.
+          more liberatory ends. <3
         </p>
       </div>
     </div>

src/pages/WhatWereWorkingOn.astro

@@ -31,7 +31,7 @@ import "../styles/globals.css";
               src="/assets/pihole.jpeg"
               alt="pihole parts"
               width="250"
-              class="border pb-4"
+              class="border"
             />
             <a
               href="/WhatWereWorkingOnPages/Pihole/"
@@ -41,28 +41,26 @@ import "../styles/globals.css";
 
           <div class="justify-items-center">
             <img
-              src="/assets/this-website.png"
-              alt="screenshot of this website including screenshot of this website including screenshot of this website..."
-              width="250"
-              class="border pb-4"
-            />
-
-            <a href="/" class="underline decoration-solid">This website!</a>
-          </div>
-
-          <div class="justify-items-center">
-            <img
-              src="/assets/book-club.png"
+              src="/assets/book-club.jpg"
               alt="stack of books"
-              width="250"
-              class="border pb-4"
+              width="280"
+              class="border"
             />
-
             <a
               href="/WhatWereWorkingOnPages/BookClub/"
               class="underline decoration-solid">Book Club</a
             >
           </div>
+
+          <div class="justify-items-center">
+            <img
+              src="/assets/computer.png"
+              alt="computer"
+              width="250"
+              class="border"
+            />
+            <a href="/WhatWereWorkingOnPages/Alternatives/" class="underline decoration-solid">Big Tech Alternatives</a>
+          </div>
         </div>
       </div>
     </div>

src/pages/WhatWereWorkingOnPages/Alternatives.astro

@@ -0,0 +1,101 @@
+---
+import Navbar from "../../components/Navbar";
+import Footer from "../../components/Footer";
+import Layout from "../../layouts/Layout.astro";
+import "../../styles/globals.css";
+
+
+import Card from "../../components/Card.astro";
+
+---
+
+<Layout>
+  <main class="flex min-h-screen flex-col justify-between">
+    <div>
+      <Navbar client:load activePage="WhatWereWorkingOn" />
+      <div class="pl-4 pr-4">
+        <h1 class="pb-4 pt-4 text-3xl font-semibold">Big Tech Alternatives</h1>
+        <p class="mb-4">Explore open-source and privacy-focused alternatives to popular big tech software.</p>
+        
+        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+          <Card 
+            title="Browsers" 
+            bigTech="Chrome (Google)" 
+            alternatives={[
+              { name: 'Firefox', description: 'Privacy-focused browser.', url: 'https://www.mozilla.org/firefox' },
+              { name: 'Brave', description: 'Ad-blocking browser.', url: 'https://brave.com' }
+            ]}
+            bgClass="bg-blue-50" 
+          />
+
+          <Card 
+            title="Cloud Storage" 
+            bigTech="Google Drive" 
+            alternatives={[
+              { name: 'Nextcloud', description: 'Self-hosted file sync and share.', url: 'https://nextcloud.com' }
+            ]}
+            bgClass="bg-indigo-50" 
+          />
+
+          <Card 
+            title="Email" 
+            bigTech="Gmail (Google)" 
+            alternatives={[
+              { name: 'ProtonMail', description: 'Encrypted email.', url: 'https://protonmail.com' },
+            ]}
+            bgClass="bg-yellow-50" 
+          />
+
+          <Card 
+            title="Maps" 
+            bigTech="Google Maps" 
+            alternatives={[
+              { name: 'OpenStreetMap', description: 'Community-driven maps.', url: 'https://www.openstreetmap.org' }
+            ]}
+            bgClass="bg-teal-50" 
+          />
+
+          <Card 
+            title="Messaging" 
+            bigTech="WhatsApp (Meta), Slack" 
+            alternatives={[
+              { name: 'Signal', description: 'Encrypted messaging (alternative to WhatsApp).', url: 'https://signal.org' },
+              { name: 'Element', description: 'Matrix-based chat (alternative to Slack).', url: 'https://element.io' }
+            ]}
+            bgClass="bg-red-50" 
+          />
+
+          <Card 
+            title="Search Engines" 
+            bigTech="Google Search" 
+            alternatives={[
+              { name: 'DuckDuckGo', description: 'Privacy-protecting search.', url: 'https://duckduckgo.com' },
+            ]}
+            bgClass="bg-green-50" 
+          />
+
+          <Card 
+            title="Social Media" 
+            bigTech="Twitter (X), Facebook (Meta)" 
+            alternatives={[
+              { name: 'Mastodon', description: 'Decentralized social network (alternative to Twitter).', url: 'https://joinmastodon.org' },
+              { name: 'Diaspora', description: 'Decentralized social network (alternative to Facebook).', url: 'https://diasporafoundation.org' }
+            ]}
+            bgClass="bg-purple-50" 
+          />
+
+          <Card 
+            title="Video Platforms" 
+            bigTech="YouTube (Google)" 
+            alternatives={[
+              { name: 'PeerTube', description: 'Decentralized video hosting.', url: 'https://joinpeertube.org' },
+            ]}
+            bgClass="bg-pink-50" 
+          />
+
+        </div>
+      </div>
+    </div>
+    <Footer />
+  </main>
+</Layout>

src/pages/WhatWereWorkingOnPages/BookClub.astro

@@ -11,38 +11,38 @@ import "../../styles/globals.css";
       <Navbar client:load activePage="WhatWereWorkingOn" />
       <div class="pl-4 pr-4">
         <h1 class="pb-4 pt-4 text-3xl font-semibold">Book Club</h1>
-        <p>Join our book club where we read and discuss books about technology, power, and resistance.</p>
-        
+        <p class="mb-4">
+          We read and discuss books about technology, power, and resistance. If
+          you have book suggestions, fill out the interest form on our <a
+            href="/"
+            class="underline">website homepage</a
+          > and let us know when we get in contact with you!
+        </p>
+
         <div class="flex flex-col gap-8">
-          <div class="border p-6 rounded-lg">
-            <h2 class="text-lg font-semibold mb-4 underline">Current Book</h2>
-            <div class="flex flex-col gap-4">
-              <div class="flex items-center gap-4">
-                <p class="italic font-semibold">Common Circuits</p>
-                <p class="text-sm text-gray-500">by Luis Felipe R. Murillo</p>
-              </div>
-              <p class="text-purple-600">Next meeting: 6/27</p>
-              <p class="text-sm">Reading for next meeting: Introduction + Chapter 1 + Chapter 2</p>
+          <div class="rounded-lg border p-6">
+            <h2 class="mb-4 text-2xl font-semibold">Current Book</h2>
+            <div>
+              Race After Technology - Ruha Benjamin (see <a
+                class="underline"
+                href="https://www.dropbox.com/scl/fi/jnzvtiry7jn3xrts2n703/RAT-Discussion-Guide.pdf?rlkey=pq6ovaeydhcm8yi2u7lzzmiuj&e=2&dl=0"
+                >discussion guide</a
+              >)
             </div>
           </div>
 
-          <div class="border p-6 rounded-lg">
-            <h2 class="text-2xl font-semibold mb-4">Past Books</h2>
+          <div class="rounded-lg border p-6">
+            <h2 class="mb-4 text-2xl font-semibold">Past Books</h2>
             <div class="flex flex-col gap-4">
               <ul class="list-disc pl-6">
-                <li>Internet for the People</li>
+                <li>Common Circuits - Luis Felipe R. Murillo</li>
+                <li>Internet for the People - Ben Tarnoff</li>
               </ul>
             </div>
           </div>
-
-          <div class="border p-6 rounded-lg">
-            <a href="/" class="text-blue-500 hover:text-blue-700">
-              <h2 class="text-2xl font-semibold mb-4">Join Us</h2>
-            </a>
-          </div>
         </div>
       </div>
     </div>
     <Footer />
   </main>
-</Layout> 
+</Layout>