Simplify deployment instructions

The deployment instructions were out of date and duplicated elsewhere, so I've updated the documentation on the rtm-config repo and the how-to-get-access page in our collectives and just pointed the instructions there.
allow zooming when reading zines
2026-04-27 00:32:11 +00:00 · 2026-03-30 20:58:57 -07:00 · 2026-03-17 02:21:04 +00:00 · 2026-03-16 19:19:54 -07:00 · 2026-02-26 04:58:24 +00:00 · 2026-02-25 20:56:16 -08:00
47 changed files with 1010 additions and 990 deletions
@@ -46,16 +46,16 @@ npx astro dev
  
 # To release a new version

-## Build the Docker image (this requires having [Docker](https://docs.docker.com/engine/install/) installed!)
+## 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> # example: if the semantic version you see for "rtmwebsite" is 0.0.1, then put version=0.0.2 here since we want to deploy the next version
+version=<specify-version>
 docker build --platform linux/amd64 -t git.coopcloud.tech/rtm/rtmwebsite:$version .
 ```

-## Push the image to gitea registery
+## Push the image to gitea registry

 Check out [this documentation](https://docs.gitea.com/next/usage/packages/container) for how to login with gitea registery.

@@ -66,69 +66,19 @@ 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
+## Deploy changes to resisttechmonopolies.online

-### One-time Setup
+We use coop cloud tooling [private recipe](https://git.coopcloud.tech/RTM/rtm-astro-recipe) to deploy this website to our [fleet](https://git.coopcloud.tech/RTM/rtm-config) of lil cat-named machines. 

-We use a [private recipe](https://git.coopcloud.tech/RTM/rtm-astro-recipe) to deploy this website. This step needs Tailscale to be activated. Follow our [Fleet Setup and Access Instructions](https://nextcloud.resisttechmonopolies.online/apps/collectives/RTM-Reference-2/Fleet-Setup-and-access-12904) and get set up on Laylotta.
+Read the "Fleet Setup and access" collectives page on our RTM nextcloud to get the `rtm-config` repo set up with the `rtm-astro-recipe` submodule and install the `abra` command line tool!

-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 `rtm-config` repo:
+Then, in your `rtm-config` repo update the RTM website image version to the one you just built and published by running:

 ``` bash
-git clone https://git.coopcloud.tech/RTM/rtm-config.git
+$ abra app config resisttechmonopolies.online  # Change VERSION to the docker image you just pushed
+$ abra app deploy -f resisttechmonopolies.online  # Re-deploy the RTM website, now with your changes!
+$ git add abra/servers/laylotta.resisttechmonopolies.online/resisttechmonopolies.online
+$ git commit -m 'Updated website to x.x.x'  # Publish this change to the rtm-config repo either via direct commit or a PR
 ```

-Clone the `rtm-astro-recipe` repo into your `$HOME/.abra/recipes` directory:
-
-```git clone https://git.coopcloud.tech/RTM/rtm-astro-recipe.git```
-
-### Every time you deploy
-
-Make sure you are connected to Laylotta on Tailscale.
-
-Update the version number to the latest (the one that you pushed to the Gitea registry previously) in
-
-``` bash
-rtm-config/abra/servers/laylotta.resisttechmonopolies.online/resisttechmonopolies.online.env
-```
-
-Then make sure you are in the rtm-config directory and run the following commands:
-
-``` bash
-abra app undeploy resisttechmonopolies.online
-# verify that there is a 404 page at https://resisttechmonopolies.online/
-
-abra app deploy resisttechmonopolies.online
-# verify that the new version is present at https://resisttechmonopolies.online/
-```
+Done! Thank you for your contributions 🏋️⚡📖!
@@ -26,6 +26,7 @@
        "nanostores": "^0.11.3",
        "react": "^19.0.0",
        "react-dom": "^19.0.0",
+        "react-pageflip": "^2.0.3",
        "tailwind-merge": "^2.5.5",
        "tailwindcss": "^3.4.17",
        "tailwindcss-animate": "^1.0.7",
@@ -5176,6 +5177,12 @@
      "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
      "integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw=="
    },
+    "node_modules/page-flip": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/page-flip/-/page-flip-2.0.7.tgz",
+      "integrity": "sha512-96lQFUUz7r/LZzEUZJ3yBIMEKU9+m8HMFDzTvTdD6P7Ag/wXINjp9n0W7b4wanwnDbQETo4uNUoL3zMqpFxwGA==",
+      "license": "MIT"
+    },
    "node_modules/parse-latin": {
      "version": "7.0.0",
      "resolved": "https://registry.npmjs.org/parse-latin/-/parse-latin-7.0.0.tgz",
@@ -5669,6 +5676,15 @@
        "react": "^19.0.0"
      }
    },
+    "node_modules/react-pageflip": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/react-pageflip/-/react-pageflip-2.0.3.tgz",
+      "integrity": "sha512-k81mHhRvUM52y8jyzTCh5t4O0lepkLhp+XGSUzq2C3uD+iW99Cv0jfRlqFCjZbD5N3jKkIFr7/3giucoXKDP3Q==",
+      "license": "MIT",
+      "dependencies": {
+        "page-flip": "latest"
+      }
+    },
    "node_modules/react-refresh": {
      "version": "0.14.2",
      "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz",
@@ -10291,6 +10307,11 @@
      "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
      "integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw=="
    },
+    "page-flip": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/page-flip/-/page-flip-2.0.7.tgz",
+      "integrity": "sha512-96lQFUUz7r/LZzEUZJ3yBIMEKU9+m8HMFDzTvTdD6P7Ag/wXINjp9n0W7b4wanwnDbQETo4uNUoL3zMqpFxwGA=="
+    },
    "parse-latin": {
      "version": "7.0.0",
      "resolved": "https://registry.npmjs.org/parse-latin/-/parse-latin-7.0.0.tgz",
@@ -10542,6 +10563,14 @@
        "scheduler": "^0.25.0"
      }
    },
+    "react-pageflip": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/react-pageflip/-/react-pageflip-2.0.3.tgz",
+      "integrity": "sha512-k81mHhRvUM52y8jyzTCh5t4O0lepkLhp+XGSUzq2C3uD+iW99Cv0jfRlqFCjZbD5N3jKkIFr7/3giucoXKDP3Q==",
+      "requires": {
+        "page-flip": "latest"
+      }
+    },
    "react-refresh": {
      "version": "0.14.2",
      "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz",
@@ -27,6 +27,7 @@
    "nanostores": "^0.11.3",
    "react": "^19.0.0",
    "react-dom": "^19.0.0",
+    "react-pageflip": "^2.0.3",
    "tailwind-merge": "^2.5.5",
    "tailwindcss": "^3.4.17",
    "tailwindcss-animate": "^1.0.7",
@@ -1,2 +0,0 @@
-User-agent: *
-Disallow: /
@@ -1,122 +0,0 @@
---
-import Card from "./Card.astro";
---
-
-<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 gap-8 md:grid-cols-2 lg:grid-cols-3">
-    <Card
-      title="Browsers"
-      bigTech="Chrome (Google)"
-      alternatives={[
-        {
-          name: "Firefox",
-          description: "Privacy-focused browser.",
-          url: "https://www.mozilla.org/firefox",
-        },
-      ]}
-      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",
-        },
-      ]}
-      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>
@@ -10,26 +10,15 @@ const { title, bigTech, alternatives, bgClass } = Astro.props;
 ---

 <div class={`border rounded-lg p-6 shadow-md ${bgClass} text-gray-900`}>
-  <h2 class="mb-4 text-2xl font-semibold">{title}</h2>
-  <p class="mb-4 text-base">
-    <span class="line-through">Big Tech Option: {bigTech}</span>
-  </p>
+  <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"
-            rel="noopener noreferrer"
-            target="_blank"
-          >
-            Website
-          </a>
-        </li>
-      ))
-    }
+    {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>
@@ -4,20 +4,10 @@ export default function Footer() {
  return (
    <div
      className={cn(
-        "flex h-12 gap-4 mt-8 w-screen place-items-center justify-center bg-[#dfd9ffff] text-black",
+        "flex h-12 w-screen flex-col place-items-center justify-center bg-white dark:bg-black dark:text-white",
      )}
    >
-
-      <h2>Resist Tech Monopolies - Copyleft {new Date().getFullYear()}</h2>
-
-      <a href="https://social.coop/@rtm" rel="noopener noreferrer" target="_blank"
-      >
-        <img
-          src={"/assets/mastodon.png"}
-          alt={"the logo for Mastodon (a purple text bubble with the letter M)"}
-          width="30"
-          height="30"
-        /></a>
+      <h2>Copyleft {new Date().getFullYear()}</h2>
    </div>
  );
 }
@@ -1,91 +1,63 @@
 import { cn } from "@/lib/utils";
-import { useState } from "react";

 interface NavbarProps {
  activePage?: string;
 }

-const NAV_ITEMS = [
-  { href: "/#aboutus", label: "About Us", activeKey: "AboutUs", text: "text-red-400", darkText: "dark:text-red-400" },
-  { href: "/#whatwereupto", label: "What We're Up To", activeKey: "WhatWereUpTo", text: "text-orange-400", darkText: "dark:text-orange-400" },
-  { href: "/#services", label: "Services", activeKey: "Services", text: "text-green-400", darkText: "dark:text-green-400" },
-  { href: "/#bigtechalternatives", label: "Big Tech Alternatives", activeKey: "BigTechAlternatives", text: "text-purple-400", darkText: "dark:text-purple-400" },
-  // TODO once we have this section done!
-  // { href: "", label: "Calendar", activeKey: "Calendar", text: "text-blue-400", darkText: "dark:text-blue-400" },
-];
-
-export default function Navbar(navbarProps: NavbarProps) {
-  const [activePage, setActivePage] = useState(navbarProps.activePage);
-  const [isShowingHamburgerFullMenu, setIsShowingHamburgerFullMenu] = useState(false);
-
+export default function Navbar({ activePage = "" }: NavbarProps) {
  return (
-    <div className={cn("bg-white dark:bg-black px-4")}>
-      <div className={cn("flex flex-row items-center justify-between pb-4 pt-4")}>
-        <a href="/" onClick={() => { setActivePage("Home") }}>
-          <div className={cn("flex items-center gap-3")}>
-            {/* 
-            TODO: uncomment once we have a logo!
-            <img
-              src={"/assets/logo.png"}
-              alt={"the logo for RTM (a cat in graffiti style with the RTM written in red and Resist Tech Monopolies written in black)"}
-              width="50"
-              height="50"
-            /> */}
-
-            <h1 className={cn(
-              "text-2xl md:text-3xl font-bold",
-              activePage === "Home" && "underline",
-            )}>Resist Tech Monopolies</h1>
-          </div>
-        </a>
-
-        <div className={cn("items-center gap-4 hidden md:flex")}>
-          {NAV_ITEMS.map(({ href, label, activeKey, text, darkText }) => (
+    <>
+      <div className={cn("flex flex-row justify-between pb-8 pl-4 pr-4 pt-8")}>
+        <div>
+          <strong className={cn("sm:text-2xl md:text-4xl")}>
            <a
-              key={href}
-              href={href}
-              onClick={() => {
-                setActivePage(activeKey)
-              }}
              className={cn(
-                "transition-colors md:text-2xl font-bold",
-                text,
-                darkText,
-                activePage == activeKey && "underline",
+                activePage === "Home" && "border-b-2 border-black-500",
              )}
-            >
-              {label}
-            </a>
-          ))}
+              href="/">Resist Tech Monopolies</a>
+          </strong>
        </div>
+        <strong className={cn("sm:text-1xl flex gap-10 md:text-4xl")}>

-        <div className={cn("hamburger block md:hidden")} onClick={() => { setIsShowingHamburgerFullMenu(!isShowingHamburgerFullMenu) }}>
-          <span className={cn("bg-black dark:bg-white line")}></span>
-          <span className={cn("bg-black dark:bg-white line")}></span>
-          <span className={cn("bg-black dark:bg-white line")}></span>
-        </div>
-      </div>
-
-      {isShowingHamburgerFullMenu && <div className={cn("flex md:hidden flex-col gap-4 bg-white p-2 mb-2")}>
-        {NAV_ITEMS.map(({ href, label, activeKey, text, darkText }) => (
          <a
-            key={href}
-            href={href}
-            onClick={() => {
-              setActivePage(activeKey)
-              setIsShowingHamburgerFullMenu(false)
-            }}
+            href="/PointsOfUnity/"
            className={cn(
-              "transition-colors text-xl md:text-2xl font-bold",
-              text,
-              darkText,
-              activePage == activeKey && "underline",
+              "rounded-full px-6 py-2 transition-colors",
+              "bg-gray-200 text-green-700 hover:bg-gray-300",
+              "dark:bg-gray-800 dark:text-green-400 dark:hover:bg-gray-700",
+              activePage === "PointsOfUnity" && "ring-2 ring-green-500 ring-offset-2",
            )}
          >
-            {label}
+            Points of Unity
          </a>
-        ))}
-      </div>}
-    </div>
+          <a
+            href="/projects/"
+            className={cn(
+              "rounded-full px-6 py-2 transition-colors",
+              "bg-gray-200 text-red-700 hover:bg-gray-300",
+              "dark:bg-gray-800 dark:text-red-400 dark:hover:bg-gray-700",
+              activePage === "OurProjects" && "ring-2 ring-red-500 ring-offset-2",
+            )}
+          >
+            Our Projects
+          </a>
+        </strong>
+      </div>
+
+      <div className={cn("flex flex-row justify-between pb-8")}>
+        <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"}
+                alt={index % 2 === 0 ? "computer icon" : "people icon"}
+                width="30"
+                height="30"
+              />
+            </div>
+          ))}
+        </div>
+      </div>
+    </>
  );
 }
@@ -1,130 +0,0 @@
-<h1 class="text-3xl font-semibold">Points of Unity</h1>
-
-<p class="mb-4">
-  Our community agreements and decision-making process describe <em>how</em> we work
-  together. The points of unity are the broader philosophies that we're working towards
-  as a group. Perhaps people aren't 100% aligned individually, but this is what the
-  group as a whole believes in when showing up to the work.
-</p>
-
-<h2 class="mb-2 mt-10 text-2xl font-semibold">Grounding</h2>
-
-<p class="mb-4">
-  We situate ourselves in our context - as Seattle residents and as users and
-  creators of the technologies we aim to resist. We are seeing a long-spanning
-  rise of fascism within national governments here and abroad. In parallel is
-  the increasing power of tech companies over our lives through surveillance and
-  the provisioning of everyday needs, from employment to how we get our internet
-  utilities in the first place. There are rising income disparities across the
-  nation, but also more specifically across everyone who can be considered a
-  "tech worker": from a CEO, to a software engineer to a tech campus cafeteria
-  worker to a child enslaved to mine cobalt in the Congo.
-</p>
-
-<p class="mb-4">
-  We know that technology intersects with and amplifies systems of oppression,
-  from anti-Black racism to classism, ableism, cisheteropatriarchy, etc. Big
-  tech permeates all aspects of life in Seattle, but to name a few ways:
-</p>
-
-<ul class="mb-4 list-disc space-y-2 pl-8">
-  <li>
-    The rise of a <a
-      href="https://stopsurveillancecity.wordpress.com/"
-      class="font-bold underline hover:text-gray-600"
-      rel="noopener noreferrer"
-      target="_blank">Surveillance City</a
-    > in Seattle facilitates the tracking of out-of-state people seeking abortions,
-    the kidnapping of migrants, and the increased surveillance and criminalization
-    of sex workers, the visibly unhoused, and poor and racialized communities.
-  </li>
-  <li>
-    The <strong>environmental racism</strong> and community impacts of <strong
-      >data centers</strong
-    >, both from the AI bubble and the demand for more data processing that
-    comes with surveillance capitalism.
-  </li>
-  <li>
-    <strong>The AI genocide</strong> in Palestine abetted by Google, Amazon, Boeing
-    and Microsoft, all local Seattle employers.
-  </li>
-  <li>
-    Rising <strong>gentrification</strong> and <strong>income inequality</strong
-    > that comes from financialization of real estate and the gentrifying waves of
-    tech workers moving into the city.
-  </li>
-</ul>
-
-<p class="mb-4">
-  Some of us are employed by Big Tech companies, and we are all living on stolen
-  Coast Salish land covered by the broken Treaty of Point Elliot of 1855; we
-  understand that we are contributing - directly or indirectly - to these
-  oppressions, and seek to use our skills towards more liberatory ends.
-</p>
-
-<h2 class="mb-2 mt-10 text-2xl font-semibold">Theory of Change</h2>
-
-<p class="mb-4">
-  We are committed to fostering our collective understanding of resisting tech
-  monopolies and building a constellation of alternative technologies that exist
-  outside of exploitative, oppressive systems. We seek out radical possibilities
-  by building connections across our communities with others struggling to
-  resist tech monopolies and reject work that expands the reach of these
-  monopolies.
-</p>
-
-<p class="mb-4">
-  We don't need to passively wait around for somebody to come implement these
-  solutions. Making improvements to our lives and our communities paves the way
-  for collective liberation. Dismantling smaller elements of a system is
-  practice for uprooting the whole and replacing it with a constellation of
-  liberatory alternatives.
-</p>
-
-<h2 class="mb-2 mt-10 text-2xl font-semibold">Role of Technology</h2>
-
-<p class="mb-4">
-  "We believe our communities and organizing efforts can and should harness the
-  possibilities of new technology." (<a
-    href="https://mijente.net/our-dna/"
-    class="underline hover:text-gray-600"
-    rel="noopener noreferrer"
-    target="_blank">Mijente</a
-  >) However, we don't innovate for the sake of innovation, but aim to create
-  with intention, listen to the perspectives of those we hope to serve
-  (including ourselves), and hold each other accountable in this work.
-</p>
-
-<h2 class="mb-2 mt-10 text-2xl font-semibold">Our Position in the Movement</h2>
-
-<p class="mb-4">
-  We don't see ourselves as a vanguard organization - that is, we make no claims
-  to being the sole authority on resisting tech monopolies and we will never
-  tell a front-line community or group of tech users what they actually need.
-  Everyone benefits from the work of resisting tech monopolies, and for that
-  reason we do the work for ourselves as much as we do it for anybody we are in
-  solidarity with.
-</p>
-
-<p class="mb-4">
-  However we also recognize our own privilege in being highly-skilled tech
-  workers: because of this we center the voices of the people most vulnerable to
-  various tech monopolies, and aim to share our expertise so that others can
-  also become agents in co-creating technologies of liberation and resistance.
-</p>
-
-<h2 class="mb-2 mt-10 text-2xl font-semibold">Friendly Vibes</h2>
-
-<p class="mb-4">
-  Holding all of the above, we're also a group of friends here for the scrappy,
-  hacky vibes. We don't take our work too seriously and we're here to work
-  joyfully. This is first and foremost a community.
-</p>
-
-<h2 class="mb-2 mt-10 text-2xl font-semibold">Acknowledgments</h2>
-
-<p class="mb-4">
-  These points of unity were inspired by the Prison Library Solidarity Network,
-  the Coalition of Anti-Racist Whites, Ruha Benjamin's work on Abolitionist
-  Tech, and Mijente.
-</p>
@@ -1,47 +0,0 @@
-<h1 class="text-3xl font-semibold">Services</h1>
-
-<section class="flex flex-col">
-  <h2 class="text-2xl font-semibold mt-4">Our Mission</h2>
-  We promote free and open source options with a non-judgmental attitude. We understand
-  that almost everyone ends up using Big Tech software sometimes. We want to help
-  you meet your own goals, whether it be reducing what you pay big corporations or
-  increasing your privacy.
-
-  <h2 class="text-2xl font-semibold mt-4">Managed Service Hosting</h2>
-  We offer individuals and organizations access to a suite of open-source, privacy-friendly
-  tools, including: • NextCloud (alternative to Google Workspace, Microsoft 365,
-  etc.) • Loomio (democratic, asynchronous decision-making platform) • Zulip (alternative
-  to Slack, Teams, Discord) • Keycloak (Single Sign-On/SSO) • Vaultwarden (password
-  manager) • Headscale (VPN) • Matrix (decentralized, federated alternative to Discord)
-  • Immich (alternative to Google Photos) Our team has decades of collective expertise
-  in cloud computing and open-source software. We're patient, responsive to users'
-  needs, and skilled at translating from tech jargon to plain language.
-
-  <h2 class="text-2xl font-semibold mt-4">Data Migration</h2>
-  We know a lot of people want to move away from the Big Tech ecosystem but feel
-  overwhelmed and don't know where to start. We've been doing this for years, and
-  we know how to help you move your data away from Big Tech and select appropriate,
-  privacy-friendly, open-source alternatives that still meet your needs. We offer
-  individual, organization, and family pricing.
-
-  <h2 class="text-2xl font-semibold mt-4">Training</h2>
-  We offer in-person events to help individuals and organizations understand the
-  risks of Big Tech, improve their digital security, and learn about privacy-friendly,
-  open-source alternatives. Here are a few of the events we've held: • DiscoTechs
-  (science-fair style event where you can learn about a variety of alternatives to
-  Big Tech) • Digital Security workshops (hands-on sessions to improve your security
-  posture and understand what threats are actually relevant for you and your organization)s
-  • Office Hours (drop-in IT help)
-
-  <h2 class="text-2xl font-semibold mt-4">Tech Consulting</h2>
-  Does your organization need help choosing IT tools? Need a website built or hosted?
-  Maybe you want to self-host your own server infrastructure, but need a little support.
-  Whatever your tech needs, just drop us a line, and we'll see if we can help.
-
-  <a
-    href="https://nextcloud.resisttechmonopolies.online/apps/forms/s/L2aP5oxnbmJcot9CPYGmKAQy"
-    class="max-w-[120px] rounded-sm bg-[#4ade80] my-4 px-6 py-3 text-center font-semibold text-white transition-colors"
-  >
-    Hire us!
-  </a>
-</section>
@@ -1,48 +0,0 @@
-<h1 class="pb-4 text-3xl font-semibold">What We're Up To</h1>
-
-<div class="grid max-w-[1600px] grid-cols-1 gap-8 xl:grid-cols-3">
-  <a href="/projects/bookclub/" class="grid justify-items-center gap-8">
-    <img
-      src="/assets/book-club.png"
-      alt="4 books we've read: Common Cicruits, Race After Technology, Teaching Community Technology, and Internet for the People"
-      loading="lazy"
-      class="h-[250px] rounded-[4px] object-contain xl:object-scale-down"
-    />
-
-    <div
-      class="max-w-[240px] rounded-sm bg-[#fb923c] px-6 py-3 text-center font-semibold text-white transition-colors"
-    >
-      What We're Reading
-    </div>
-  </a>
-
-  <a href="/projects/PetCalendar/" class="grid justify-items-center gap-8">
-    <img
-      src="/assets/pet-calendar-2026-cover.jpg"
-      alt="The cover of our pet calendar; a collage of dogs and cats with computer stuff"
-      loading="lazy"
-      class="h-[250px] rounded-[4px] object-contain xl:object-scale-down"
-    />
-
-    <div
-      class="max-w-[240px] rounded-sm bg-[#fb923c] px-6 py-3 text-center font-semibold text-white transition-colors"
-    >
-      Pet Calendar
-    </div>
-  </a>
-
-  <a href="/projects/zines/" class="grid justify-items-center gap-8">
-    <img
-      src="/assets/zines-thumbnail.png"
-      alt="4 zines we made: Creating an Internet for the People, De-Monopoly DiscoTech 101, How to Get Started with Signal, and Brief Notes from a De-Monopoly DiscoTech"
-      loading="lazy"
-      class="h-[250px] rounded-[4px] object-contain xl:object-scale-down"
-    />
-
-    <div
-      class="max-w-[240px] rounded-sm bg-[#fb923c] px-6 py-3 text-center font-semibold text-white transition-colors"
-    >
-      Zines
-    </div>
-  </a>
-</div>
@@ -1,40 +0,0 @@
-import { useEffect, useState } from "react";
-import { Check, Share2 } from "lucide-react";
-import { Button } from "../ui/button";
-
-interface ShareZineButtonProps {
-  zineId: string;
-}
-
-export function ShareZineButton({ zineId }: ShareZineButtonProps) {
-  const [copied, setCopied] = useState(false);
-
-  useEffect(() => {
-    if (!copied) return;
-    const timer = setTimeout(() => setCopied(false), 1500);
-    return () => clearTimeout(timer);
-  }, [copied]);
-
-  const handleClick = async (e: React.MouseEvent) => {
-    e.stopPropagation();
-    const url = `${window.location.origin}/projects/zines/${zineId}`;
-    await navigator.clipboard.writeText(url);
-    setCopied(true);
-  };
-
-  return (
-    <Button variant="outline" size="sm" onClick={handleClick}>
-      {copied ? (
-        <>
-          <Check />
-          Copied!
-        </>
-      ) : (
-        <>
-          <Share2 />
-          Share
-        </>
-      )}
-    </Button>
-  );
-}
@@ -1,19 +1,21 @@
 import { Download } from "lucide-react";
 import type { Zine } from "../../data/zines";
 import { Button } from "../ui/button";
-import { ShareZineButton } from "./ShareZineButton";

 interface ZineCardProps {
  zine: Zine;
+  onClick: () => void;
 }

-export function ZineCard({ zine }: ZineCardProps) {
-  const href = `/projects/zines/${zine.id}`;
+export function ZineCard({ zine, onClick }: ZineCardProps) {
+  const handleDownload = (e: React.MouseEvent) => {
+    e.stopPropagation();
+  };

  return (
    <div className="flex flex-col items-center gap-2 rounded-lg border p-4">
-      <a
-        href={href}
+      <button
+        onClick={onClick}
        className="group flex flex-col items-center gap-2 transition-all focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
      >
        <div className="aspect-[3/4] w-48 overflow-hidden rounded bg-muted">
@@ -27,19 +29,23 @@ export function ZineCard({ zine }: ZineCardProps) {
        {zine.description && (
          <p className="text-sm text-muted-foreground">{zine.description}</p>
        )}
-      </a>
+      </button>

      <div className="flex gap-2 mt-2">
-        <Button variant="outline" size="sm" asChild>
-          <a href={href}>Read Online</a>
+        <Button variant="outline" size="sm" onClick={onClick}>
+          Read Online
        </Button>
-        <Button variant="outline" size="sm" asChild>
+        <Button
+          variant="outline"
+          size="sm"
+          asChild
+          onClick={handleDownload}
+        >
          <a href={zine.printablePdf} download>
-            <Download />
+            <Download className="h-4 w-4 mr-1" />
            Printable
          </a>
        </Button>
-        <ShareZineButton zineId={zine.id} />
      </div>
    </div>
  );
@@ -1,12 +1,54 @@
-import { zines } from "../../data/zines";
+import { useState } from "react";
+import { zines, type Zine } from "../../data/zines";
 import { ZineCard } from "./ZineCard";
+import { ZineViewer } from "./ZineViewer";
+import {
+  Dialog,
+  DialogContent,
+  DialogTitle,
+  DialogDescription,
+} from "../ui/dialog";
+import * as VisuallyHidden from "@radix-ui/react-visually-hidden";

 export function ZineGrid() {
+  const [selectedZine, setSelectedZine] = useState<Zine | null>(null);
+
+  const handleOpenZine = (zine: Zine) => {
+    setSelectedZine(zine);
+  };
+
+  const handleCloseZine = () => {
+    setSelectedZine(null);
+  };
+
  return (
-    <div className="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3">
-      {zines.map((zine) => (
-        <ZineCard key={zine.id} zine={zine} />
-      ))}
-    </div>
+    <>
+      <div className="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3">
+        {zines.map((zine) => (
+          <ZineCard
+            key={zine.id}
+            zine={zine}
+            onClick={() => handleOpenZine(zine)}
+          />
+        ))}
+      </div>
+
+      <Dialog open={selectedZine !== null} onOpenChange={handleCloseZine}>
+        <DialogContent className="max-w-4xl">
+          <VisuallyHidden.Root>
+            <DialogTitle>{selectedZine?.title}</DialogTitle>
+            <DialogDescription>
+              Interactive flipbook viewer for {selectedZine?.title}
+            </DialogDescription>
+          </VisuallyHidden.Root>
+          {selectedZine && (
+            <ZineViewer
+              pages={selectedZine.pages}
+              title={selectedZine.title}
+            />
+          )}
+        </DialogContent>
+      </Dialog>
+    </>
  );
 }
@@ -0,0 +1,245 @@
+import React, { useRef, useState, useCallback, forwardRef, useEffect } from "react";
+import HTMLFlipBook from "react-pageflip";
+import { ChevronLeft, ChevronRight, ZoomIn, ZoomOut, Minimize2 } from "lucide-react";
+import { Button } from "../ui/button";
+
+interface PageProps {
+  src: string;
+  pageNumber: number;
+}
+
+const Page = forwardRef<HTMLDivElement, PageProps>(({ src, pageNumber }, ref) => {
+  return (
+    <div ref={ref} className="page bg-white">
+      <img
+        src={src}
+        alt={`Page ${pageNumber}`}
+        className="h-full w-full object-contain"
+      />
+    </div>
+  );
+});
+
+Page.displayName = "Page";
+
+interface ZineViewerProps {
+  pages: string[];
+  title: string;
+}
+
+const MIN_ZOOM = 1;
+const MAX_ZOOM = 2.5;
+const ZOOM_STEP = 0.5;
+
+export function ZineViewer({ pages, title }: ZineViewerProps) {
+  const flipBookRef = useRef<any>(null);
+  const [currentPage, setCurrentPage] = useState(0);
+  const totalPages = pages.length;
+
+  const [zoom, setZoom] = useState(1);
+  const [pan, setPan] = useState({ x: 0, y: 0 });
+  const [isPanning, setIsPanning] = useState(false);
+  const panStart = useRef({ x: 0, y: 0 });
+  const panOffset = useRef({ x: 0, y: 0 });
+
+  const isZoomed = zoom > MIN_ZOOM;
+
+  const onFlip = useCallback((e: any) => {
+    setCurrentPage(e.data);
+  }, []);
+
+  const goToPrevPage = () => {
+    flipBookRef.current?.pageFlip()?.flipPrev();
+  };
+
+  const goToNextPage = () => {
+    flipBookRef.current?.pageFlip()?.flipNext();
+  };
+
+  const handleZoomIn = () => {
+    setZoom((z) => Math.min(z + ZOOM_STEP, MAX_ZOOM));
+  };
+
+  const handleZoomOut = () => {
+    setZoom((z) => {
+      const next = Math.max(z - ZOOM_STEP, MIN_ZOOM);
+      if (next <= MIN_ZOOM) setPan({ x: 0, y: 0 });
+      return next;
+    });
+  };
+
+  const handleZoomReset = () => {
+    setZoom(MIN_ZOOM);
+    setPan({ x: 0, y: 0 });
+  };
+
+  const handlePointerDown = (e: React.PointerEvent) => {
+    if (!isZoomed) return;
+    setIsPanning(true);
+    panStart.current = { x: e.clientX, y: e.clientY };
+    panOffset.current = { x: pan.x, y: pan.y };
+    (e.target as HTMLElement).setPointerCapture?.(e.pointerId);
+    e.preventDefault();
+  };
+
+  const handlePointerMove = (e: React.PointerEvent) => {
+    if (!isPanning) return;
+    const dx = (e.clientX - panStart.current.x) / zoom;
+    const dy = (e.clientY - panStart.current.y) / zoom;
+    setPan({
+      x: panOffset.current.x + dx,
+      y: panOffset.current.y + dy,
+    });
+  };
+
+  const handlePointerUp = () => {
+    setIsPanning(false);
+  };
+
+  useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "ArrowLeft") {
+        goToPrevPage();
+      } else if (e.key === "ArrowRight") {
+        goToNextPage();
+      }
+    };
+
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, []);
+
+  if (pages.length === 0) {
+    return (
+      <div className="flex h-64 items-center justify-center text-muted-foreground">
+        No pages available
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex flex-col items-center gap-4">
+      <h2 className="text-xl font-semibold">{title}</h2>
+
+      <div className="flex items-center gap-2">
+        <Button
+          variant="outline"
+          size="icon"
+          onClick={handleZoomOut}
+          disabled={zoom <= MIN_ZOOM}
+          aria-label="Zoom out"
+        >
+          <ZoomOut className="h-4 w-4" />
+        </Button>
+        <span className="text-sm text-muted-foreground w-12 text-center">
+          {Math.round(zoom * 100)}%
+        </span>
+        <Button
+          variant="outline"
+          size="icon"
+          onClick={handleZoomIn}
+          disabled={zoom >= MAX_ZOOM}
+          aria-label="Zoom in"
+        >
+          <ZoomIn className="h-4 w-4" />
+        </Button>
+        {isZoomed && (
+          <Button
+            variant="outline"
+            size="icon"
+            onClick={handleZoomReset}
+            aria-label="Reset zoom"
+          >
+            <Minimize2 className="h-4 w-4" />
+          </Button>
+        )}
+      </div>
+
+      <div
+        className="flipbook-container"
+        style={{
+          overflow: "hidden",
+          cursor: isZoomed ? (isPanning ? "grabbing" : "grab") : "default",
+        }}
+        onPointerDown={handlePointerDown}
+        onPointerMove={handlePointerMove}
+        onPointerUp={handlePointerUp}
+        onPointerCancel={handlePointerUp}
+      >
+        <div
+          style={{
+            transform: `scale(${zoom}) translate(${pan.x}px, ${pan.y}px)`,
+            transformOrigin: "center center",
+            transition: isPanning ? "none" : "transform 0.2s ease",
+            pointerEvents: isZoomed ? "none" : "auto",
+          }}
+        >
+          {/* @ts-ignore - react-pageflip types are incomplete */}
+          <HTMLFlipBook
+            ref={flipBookRef}
+            width={350}
+            height={500}
+            size="stretch"
+            minWidth={280}
+            maxWidth={500}
+            minHeight={400}
+            maxHeight={700}
+            maxShadowOpacity={0.5}
+            showCover={true}
+            mobileScrollSupport={!isZoomed}
+            onFlip={onFlip}
+            className="flipbook"
+            style={{}}
+            startPage={0}
+            drawShadow={true}
+            flippingTime={600}
+            usePortrait={true}
+            startZIndex={0}
+            autoSize={true}
+            clickEventForward={true}
+            useMouseEvents={!isZoomed}
+            swipeDistance={30}
+            showPageCorners={!isZoomed}
+            disableFlipByClick={false}
+          >
+            {pages.map((page, index) => (
+              <Page key={index} src={page} pageNumber={index + 1} />
+            ))}
+          </HTMLFlipBook>
+        </div>
+      </div>
+
+      <div className="flex items-center gap-4">
+        <Button
+          variant="outline"
+          size="icon"
+          onClick={goToPrevPage}
+          disabled={currentPage === 0}
+          aria-label="Previous page"
+        >
+          <ChevronLeft className="h-4 w-4" />
+        </Button>
+
+        <span className="text-sm text-muted-foreground">
+          Page {currentPage + 1} of {totalPages}
+        </span>
+
+        <Button
+          variant="outline"
+          size="icon"
+          onClick={goToNextPage}
+          disabled={currentPage >= totalPages - 1}
+          aria-label="Next page"
+        >
+          <ChevronRight className="h-4 w-4" />
+        </Button>
+      </div>
+
+      <p className="text-xs text-muted-foreground">
+        {isZoomed
+          ? "Drag to pan. Use arrow buttons to turn pages"
+          : "Click the page corners or use arrow buttons to turn pages"}
+      </p>
+    </div>
+  );
+}
@@ -93,21 +93,4 @@ export const zines: Zine[] = [
    ],
    printablePdf: "/assets/zines/signal-101/printable.pdf",
  },
-  {
-    id: "signal-201",
-    title: "Signal 201",
-    description: "Advanced usage of signal",
-    coverImage: "/assets/zines/signal-201/cover.jpg",
-    pages: [
-      "/assets/zines/signal-201/cover.jpg",
-      "/assets/zines/signal-201/page-1.jpg",
-      "/assets/zines/signal-201/page-2.jpg",
-      "/assets/zines/signal-201/page-3.jpg",
-      "/assets/zines/signal-201/page-4.jpg",
-      "/assets/zines/signal-201/page-5.jpg",
-      "/assets/zines/signal-201/page-6.jpg",
-      "/assets/zines/signal-201/page-7.jpg",
-    ],
-    printablePdf: "/assets/zines/signal-201/printable.pdf",
-  },
 ];
@@ -4,7 +4,7 @@ import { cn } from "@/lib/utils";
 const title =
  "Resist Tech Monopolies";
 const description =
- `Copyleft ${new Date().getFullYear()}`;
+  "Copyleft 2025";
 const url = "https://placeholder.com";
 const image = "/public/preview.webp";
 ---
@@ -40,7 +40,7 @@ const image = "/public/preview.webp";
        "@type": "WebSite",
        "url": "https://placeholder.com",
        "name":   "Resist Tech Monopolies",
-        "description": `Copyleft ${new Date().getFullYear()}`
+        "description": "Copyleft 2025"
      }
    </script>

@@ -1,19 +1,18 @@
 ---
 import Navbar from "../components/Navbar";
 import Footer from "../components/Footer";
-import PointsOfUnity from "../components/PointsOfUnity.astro";
 import Layout from "../layouts/Layout.astro";
 import "../styles/globals.css";
 ---

 <Layout>
-  <main class="px-4 flex min-h-screen flex-col justify-between">
+  <main class="flex min-h-screen flex-col justify-between">
    <div>
-      <section class="sticky top-0">
-        <Navbar client:load activePage="AboutUs" />
-      </section>
+      <Navbar client:load activePage="GetInvolved" />
      <div class="pl-4 pr-4">
-        <PointsOfUnity />
+        <h1 class="text-3xl font-semibold">Get Involved</h1>
+        
+        
      </div>
    </div>
    <Footer />
@@ -0,0 +1,81 @@
+---
+import Navbar from "../components/Navbar";
+import Footer from "../components/Footer";
+import Layout from "../layouts/Layout.astro";
+import "../styles/globals.css";
+---
+
+<Layout>
+  <main class="flex min-h-screen flex-col justify-between">
+    <div>
+      <Navbar client:load activePage="PointsOfUnity" />
+      <div class="pl-4 pr-4">
+        <h1 class="text-3xl font-semibold">Points of Unity</h1>
+
+        <p class="mb-4">
+          Our community agreements and decision-making process describe <em>how</em> we work together. The points of unity are the broader philosophies that we're working towards as a group. Perhaps people aren't 100% aligned individually, but this is what the group as a whole believes in when showing up to the work.
+        </p>
+
+        <h2 class="text-2xl font-semibold mt-10 mb-2">Grounding</h2>
+
+        <p class="mb-4">
+          We situate ourselves in our context - as Seattle residents and as users and creators of the technologies we aim to resist. We are seeing a long-spanning rise of fascism within national governments here and abroad. In parallel is the increasing power of tech companies over our lives through surveillance and the provisioning of everyday needs, from employment to how we get our internet utilities in the first place. There are rising income disparities across the nation, but also more specifically across everyone who can be considered a "tech worker": from a CEO, to a software engineer to a tech campus cafeteria worker to a child enslaved to mine cobalt in the Congo.
+        </p>
+
+        <p class="mb-4">
+          We know that technology intersects with and amplifies systems of oppression, from anti-Black racism to classism, ableism, cisheteropatriarchy, etc. Big tech permeates all aspects of life in Seattle, but to name a few ways:
+        </p>
+
+        <ul class="list-disc pl-8 mb-4 space-y-2">
+          <li>The rise of a <a href="https://stopsurveillancecity.wordpress.com/" class="font-bold underline hover:text-gray-600">Surveillance City</a> in Seattle facilitates the tracking of out-of-state people seeking abortions, the kidnapping of migrants, and the increased surveillance and criminalization of sex workers, the visibly unhoused, and poor and racialized communities.</li>
+          <li>The <strong>environmental racism</strong> and community impacts of <strong>data centers</strong>, both from the AI bubble and the demand for more data processing that comes with surveillance capitalism.</li>
+          <li><strong>The AI genocide</strong> in Palestine abetted by Google, Amazon, Boeing and Microsoft, all local Seattle employers.</li>
+          <li>Rising <strong>gentrification</strong> and <strong>income inequality</strong> that comes from financialization of real estate and the gentrifying waves of tech workers moving into the city.</li>
+        </ul>
+
+        <p class="mb-4">
+          Some of us are employed by Big Tech companies, and we are all living on stolen Coast Salish land covered by the broken Treaty of Point Elliot of 1855; we understand that we are contributing - directly or indirectly - to these oppressions, and seek to use our skills towards more liberatory ends.
+        </p>
+
+        <h2 class="text-2xl font-semibold mt-10 mb-2">Theory of Change</h2>
+
+        <p class="mb-4">
+          We are committed to fostering our collective understanding of resisting tech monopolies and building a constellation of alternative technologies that exist outside of exploitative, oppressive systems. We seek out radical possibilities by building connections across our communities with others struggling to resist tech monopolies and reject work that expands the reach of these monopolies.
+        </p>
+
+        <p class="mb-4">
+          We don't need to passively wait around for somebody to come implement these solutions. Making improvements to our lives and our communities paves the way for collective liberation. Dismantling smaller elements of a system is practice for uprooting the whole and replacing it with a constellation of liberatory alternatives.
+        </p>
+
+        <h2 class="text-2xl font-semibold mt-10 mb-2">Role of Technology</h2>
+
+        <p class="mb-4">
+          "We believe our communities and organizing efforts can and should harness the possibilities of new technology." (<a href="https://mijente.net/our-dna/" class="underline hover:text-gray-600">Mijente</a>) However, we don't innovate for the sake of innovation, but aim to create with intention, listen to the perspectives of those we hope to serve (including ourselves), and hold each other accountable in this work.
+        </p>
+
+        <h2 class="text-2xl font-semibold mt-10 mb-2">Our Position in the Movement</h2>
+
+        <p class="mb-4">
+          We don't see ourselves as a vanguard organization - that is, we make no claims to being the sole authority on resisting tech monopolies and we will never tell a front-line community or group of tech users what they actually need. Everyone benefits from the work of resisting tech monopolies, and for that reason we do the work for ourselves as much as we do it for anybody we are in solidarity with.
+        </p>
+
+        <p class="mb-4">
+          However we also recognize our own privilege in being highly-skilled tech workers: because of this we center the voices of the people most vulnerable to various tech monopolies, and aim to share our expertise so that others can also become agents in co-creating technologies of liberation and resistance.
+        </p>
+
+        <h2 class="text-2xl font-semibold mt-10 mb-2">Friendly Vibes</h2>
+
+        <p class="mb-4">
+          Holding all of the above, we're also a group of friends here for the scrappy, hacky vibes. We don't take our work too seriously and we're here to work joyfully. This is first and foremost a community.
+        </p>
+
+        <h2 class="text-2xl font-semibold mt-10 mb-2">Acknowledgments</h2>
+
+        <p class="mb-4">
+          These points of unity were inspired by the Prison Library Solidarity Network, the Coalition of Anti-Racist Whites, Ruha Benjamin's work on Abolitionist Tech, and Mijente.
+        </p>
+      </div>
+    </div>
+    <Footer />
+  </main>
+</Layout>
@@ -1,76 +1,36 @@
 ---
 import Navbar from "@/components/Navbar";
 import Footer from "@/components/Footer";
-import BigTechAlternatives from "@/components/BigTechAlternatives.astro";
-import WhatWereUpTo from "@/components/WhatWereUpTo.astro";
 import Layout from "@/layouts/Layout.astro";
 import "@/styles/globals.css";
-import Services from "@/components/Services.astro";
 ---

 <Layout>
-  <main>
-    <section class="sticky top-0">
+  <main class="flex min-h-screen flex-col justify-between">
+    <div>
      <Navbar client:load activePage="Home" />
-    </section>
-
-    <section id="aboutus" class="scroll-m-20 px-4">
-      <section>
-        <h1 class="pb-4 text-3xl font-semibold">About Us</h1>
-
-        <p>
-          We situate ourselves in our context - as Seattle residents and as
-          users and creators of the technologies we aim to resist.
-        </p>
-
-        <div class="my-8">
-          <a
-            href="/aboutus/"
-            class="rounded-sm bg-[#fe4f60FF] px-6 py-3 font-semibold text-white transition-colors"
-          >
-            Read More
-          </a>
-        </div>
-      </section>
-
-      <section>
-        <h2 class="pb-4 text-3xl font-semibold">Get Involved</h2>

+      <div class="pl-4 pr-4 text-xl leading-[2]">
        <p>
          Do you believe technology can and should be used for good? Do you
-          think a democratic internet could liberate us? Join us! We share this
-          vision, and we want to work together to achieve it.
+          think a democratic internet could liberate us? Join us!
        </p>

+        <p>We share this vision, and we want to work together to achieve it.</p>
+
        <div class="my-8">
-          <a
-            href="https://shlink.resisttechmonopolies.online/HNrZG"
-            class="rounded-sm bg-[#80aaff] px-6 py-3 font-semibold text-white transition-colors"
+          <a 
+            href="https://shlink.resisttechmonopolies.online/HNrZG" 
+            class="px-6 py-3 bg-[#80aaff] text-white font-semibold rounded-md hover:bg-[#6090e0] transition-colors"
            target="_blank"
            rel="noopener noreferrer"
          >
            Fill Out Our Interest Form!
          </a>
        </div>
-      </section>
-    </section>
-
-    <section id="whatwereupto" class="scroll-m-20 px-4">
-      <WhatWereUpTo />
-    </section>
-
-    <section id="services" class="my-8 scroll-m-20 px-4">
-      <Services />
-    </section>
-
-    <!-- <section id="calendar" class="scroll-m-20 my-8">
-      TODO calendar
-    </section> -->
-
-    <section id="bigtechalternatives" class="my-8 scroll-m-20">
-      <BigTechAlternatives />
-    </section>
+      </div>
+    </div>

    <Footer />
-  </main>
-</Layout>
+  </main></Layout
+>
@@ -0,0 +1,95 @@
+---
+import Navbar from "../components/Navbar";
+import Footer from "../components/Footer";
+import Layout from "../layouts/Layout.astro";
+import "../styles/globals.css";
+---
+
+<Layout>
+  <main class="flex min-h-screen flex-col justify-between">
+    <div>
+      <Navbar client:load activePage="OurProjects" />
+      <div class="pl-4 pr-4">
+        <h1 class="pb-4 pt-4 text-3xl font-semibold">Our Projects</h1>
+        <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-8">
+          <!-- <div class="justify-items-center">
+            <img
+              src="/assets/calendar.png"
+              alt="stack of books"
+              width="250"
+              class="border pb-4"
+            />
+
+            <a
+              href="/projects/calendar/"
+              class="underline decoration-solid">Calendar</a
+            >
+          </div> -->
+
+          <div class="justify-items-center">
+            <img
+              src="/assets/book-club.jpg"
+              alt="stack of books"
+              width="280"
+              class="border"
+            />
+            <a
+              href="/projects/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="/projects/alternatives/" class="underline decoration-solid">Big Tech Alternatives</a>
+          </div>
+
+          <div class="justify-items-center">
+            <img
+              src="/assets/zines-thumbnail.png"
+              alt="zines"
+              width="250"
+              class="border object-cover w-[250px] h-[250px]"
+            />
+            <a href="/projects/zines/" class="underline decoration-solid">Zines</a>
+          </div>
+
+          <div class="justify-items-center">
+            <img
+              src="/assets/pet-calendar-2026-cover.jpg"
+              alt="photo collage of cats"
+              width="500"
+              class="border"
+            />
+            <a
+              href="/projects/PetCalendar/"
+              class="underline decoration-solid">Pet Calendar</a
+            >
+          </div>
+
+          <div class="justify-items-center">
+            <img
+              src="/assets/pihole.jpeg"
+              alt="pihole parts"
+              width="250"
+              class="border"
+            />
+            <a
+              href="/projects/pihole/"
+              class="underline decoration-solid">Pihole Workshop</a
+            >
+          </div>
+
+        </div>
+      </div>
+    </div>
+    <Footer />
+  </main>
+</Layout>
@@ -6,25 +6,16 @@ import "../../styles/globals.css";
 ---

 <Layout>
-  <main class="flex min-h-screen flex-col justify-between px-4">
+  <main class="flex min-h-screen flex-col justify-between">
    <div>
-      <section class="sticky top-0">
-        <Navbar client:load activePage="WhatWereUpTo" />
-      </section>
-
+      <Navbar client:load activePage="WhatWereWorkingOn" />
      <div class="pl-4 pr-4">
-        <h1 class="pb-4 pt-4 text-3xl font-semibold">Pet Calendar</h1>
-        <div>
-          We created a pet calendar with 12 beautiful pictures of RTM's animal
-          friends.
-          <p class="pb-2">
-            Each month, our pets will share with you with a different way you
-            can Resist Big Tech Monopolies!
-          </p>
-          <p class="pb-2">
-            If you'd like to request a calendar, email us at
-            besties@resisttechmonopolies.online
-          </p>
+        <h1 class="pb-4 pt-4 text-3xl font-semibold">Pet Calendar</h1>          
+          <div>We created a pet calendar with 12 beautiful pictures of RTM's 
+          animal friends. 
+          <p class="pb-2">Each month, our pets will share with you with a different way you can 
+          Resist Big Tech Monopolies!</p>          
+          <p class="pb-2"> If you'd like to request a calendar, email us at besties@resisttechmonopolies.online</p>
          <div class="justify-items-center">
            <img
              src="/assets/pet-calendar-2026-cover.jpg"
@@ -32,300 +23,321 @@ import "../../styles/globals.css";
              width="500"
              class="border"
            />
+            
          </div>
-          <div></div>
+          <div> 
        </div>
-        <h1 class="pb-4 pt-4 text-2xl font-semibold">
-          2026 Monthly RTM Tutorials
-        </h1>
+         
+        </div>
+        <h1 class="pb-4 pt-4 text-2xl font-semibold">2026 Monthly RTM Tutorials</h1>     

        <div class="flex flex-col gap-8">
          <div class="rounded-lg border p-6">
            <h2 class="mb-4 text-2xl font-semibold" id="January">January</h2>
-            <div>
-              <p class="mb-2">
-                Try out Mastadon for algorithmless social media that won't sell
-                your data!
-              </p>
-              <a
-                class="mb-2 underline"
+            <div>  
+           <p class="mb-2"> Try out Mastadon for algorithmless social media that won't sell your data!</p>
+                <a
+                class="underline mb-2"
                href="https://joinmastodon.org/"
-                rel="noopener noreferrer"
-                target="_blank"
                >Join Mastadon!
-              </a>
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️/5 
+                </p>
+            </div>    
+            
+          </div> 

-              <p class="mb-2">Difficulty rating: 🌶️/5</p>
-            </div>
-          </div>
        </div>
        <div class="flex flex-col gap-8">
          <div class="rounded-lg border p-6">
            <h2 class="mb-4 text-2xl font-semibold" id="February">February</h2>
            <div>
-              <p class="mb-2">
-                Learn about hosting your own instances of tech services to
-                protect your data!
-              </p>
-              <a
-                class="mb-2 underline"
+              
+            
+               <p class="mb-2"> Learn about hosting your own instances of tech services to protect your data!</p>
+                <a
+                class="underline mb-2"
                href="https://www.xda-developers.com/tips-for-self-hosting-beginners/"
-                rel="noopener noreferrer"
-                target="_blank"
                >Beginner's Guide to Self-Hosting!
-              </a>
-
-              <p class="mb-2">Difficulty rating: 🌶️🌶️🌶️🌶️/5</p>
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️🌶️🌶️🌶️/5 
+                </p>
+            
+               
            </div>
+            
          </div>
+
        </div>
        <div class="flex flex-col gap-8">
          <div class="rounded-lg border p-6">
            <h2 class="mb-4 text-2xl font-semibold" id="March">March</h2>
            <div>
-              <p class="mb-2">Try out Calibre to read Amazon-free e-books!</p>
-              <a
-                class="mb-2 underline"
+               <p class="mb-2"> Try out Calibre to read Amazon-free e-books!</p>
+                <a
+                class="underline mb-2"
                href="https://tutorials.mediaket.net/software-tutorials/calibre-how-to-use-it.html"
-                rel="noopener noreferrer"
-                target="_blank"
                >Get Started with Calibre!
-              </a>
-
-              <p class="mb-2">Difficulty rating: 🌶️🌶️/5</p>
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️🌶️/5 
+                </p>
+            
+            
+               
            </div>
+            
          </div>
+
        </div>
        <div class="flex flex-col gap-8">
          <div class="rounded-lg border p-6">
            <h2 class="mb-4 text-2xl font-semibold" id="April">April</h2>
            <div>
-              <p class="mb-2">
-                Thinking of switching off Windows or MacOS? Try Linux for a
-                super customizable, privacy-first operating system!
-              </p>
-              <a
-                class="mb-2 underline"
+               <p class="mb-2"> Thinking of switching off Windows or MacOS? Try Linux 
+                for a super customizable, privacy-first operating system!
+</p>
+                <a
+                class="underline mb-2"
                href="https://www.geeksforgeeks.org/linux-unix/30-days-of-linux/"
-                rel="noopener noreferrer"
-                target="_blank"
                >30 Days of Linux for Beginners!
-              </a>
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️🌶️🌶️🌶️/5 
+                </p>

-              <p class="mb-2">Difficulty rating: 🌶️🌶️🌶️🌶️/5</p>
+               
+            
+            
+            
+               
            </div>
+            
          </div>
+
        </div>
        <div class="flex flex-col gap-8">
          <div class="rounded-lg border p-6">
            <h2 class="mb-4 text-2xl font-semibold" id="May">May</h2>
            <div>
-              <p class="mb-2">
-                Try going outside and repping some protest fashion this Spring!
-              </p>
-              <a
-                class="mb-2 underline"
+               <p class="mb-2"> Try going outside and repping some protest fashion this Spring!</p>
+                <a
+                class="underline mb-2"
                href="https://graziamagazine.com/me/articles/history-keffiyeh-palestine/"
-                rel="noopener noreferrer"
-                target="_blank"
                >Learn the history and meaning of the keffiyeh!
-              </a>
-
-              <p class="mb-2">Difficulty rating: 🌶️/5</p>
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️/5 
+                </p>
+            
+            
+            
+               
            </div>
+            
          </div>
+
        </div>
        <div class="flex flex-col gap-8">
          <div class="rounded-lg border p-6">
            <h2 class="mb-4 text-2xl font-semibold" id="June">June</h2>
            <div>
-              <p class="mb-2">
-                Try out Ente for a privacy-friendly, open-source photos hosting
-                platform!
-              </p>
-              <a
-                class="mb-2 underline"
+               <p class="mb-2"> Try out Ente for a privacy-friendly, open-source photos hosting platform!</p>
+                <a
+                class="underline mb-2"
                href="https://web.archive.org/web/20260108185516/https://www.androidauthority.com/ente-photos-hands-on-3542198/"
-                rel="noopener noreferrer"
-                target="_blank"
                >In-depth overeview of Ente Photos migration!
-              </a>
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️/5 
+                </p>

-              <p class="mb-2">Difficulty rating: 🌶️/5</p>
            </div>
+            
          </div>
+
        </div>
        <div class="flex flex-col gap-8">
          <div class="rounded-lg border p-6">
            <h2 class="mb-4 text-2xl font-semibold" id="July">July</h2>
            <div>
-              <p class="mb-2">
-                Try installing your own Pi Hole on your home wifi network to
-                block ad and malware servers!
-              </p>
-              <a
-                class="mb-2 underline"
+               <p class="mb-2"> Try installing your own Pi Hole on your home wifi network to block ad and malware servers!</p>
+                <a
+                class="underline mb-2"
                href="https://protasm.com/blogs/news/an-extensive-tutorial-on-how-to-setup-a-pi-hole"
-                rel="noopener noreferrer"
-                target="_blank"
                >Extensive PiHole Tutorial!
-              </a>
-
-              <p class="mb-2">Difficulty rating: 🌶️🌶️🌶️🌶️🌶️/5</p>
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️🌶️🌶️🌶️🌶️/5 
+                </p>
+  
            </div>
-            <hr class="mb-4" />
-            <p class="mb-2">Alternative: Install an adblocker!</p>
-            <a class="mb-2 underline" href="https://adblockplus.org/"
-              >Install Adblock Plus!
-            </a>
-
-            <p class="mb-2">Difficulty rating: 🌶️/5</p>
+            <hr class="mb-4">
+             <p class="mb-2"> Alternative: Install an adblocker!</p>
+                <a
+                class="underline mb-2"
+                href="https://adblockplus.org/"
+                >Install Adblock Plus!
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️/5 
+                </p>
          </div>
+
        </div>
        <div class="flex flex-col gap-8">
          <div class="rounded-lg border p-6">
            <h2 class="mb-4 text-2xl font-semibold" id="August">August</h2>
            <div>
-              <p class="mb-2">
-                Try out DuckDuckGo as a privacy-friendly alternative to Google
-                search and Chrome!
-              </p>
-              <a
-                class="mb-2 underline"
+               <p class="mb-2"> Try out DuckDuckGo as a privacy-friendly alternative to Google search and Chrome!</p>
+                <a
+                class="underline mb-2"
                href="https://duckduckgo.com/"
-                rel="noopener noreferrer"
-                target="_blank"
                >Download Duck Duck Go!
-              </a>
-
-              <p class="mb-2">Difficulty rating: 🌶️/5</p>
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️/5 
+                </p>
+            
+            
+            
+               
            </div>
+            
          </div>
+
        </div>
        <div class="flex flex-col gap-8">
          <div class="rounded-lg border p-6">
-            <h2 class="mb-4 text-2xl font-semibold" id="September">
-              September
-            </h2>
+            <h2 class="mb-4 text-2xl font-semibold" id="September">September</h2>
            <div>
-              <p class="mb-2">
-                Instead of relying on surveillance for safety, try making
-                friends with your neighbors!
-              </p>
-              <a
-                class="mb-2 underline"
+               <p class="mb-2"> Instead of relying on surveillance for safety, try making friends with your neighbors!</p>
+                <a
+                class="underline mb-2"
                href="https://www.youtube.com/watch?v=1-Xl6dhDV3Q"
-                rel="noopener noreferrer"
-                target="_blank"
-              >
-                How to Build Radical Community!
-              </a>
-
-              <p class="mb-2">Difficulty rating: 🌶️🌶️🌶️/5</p>
-              (hey making friends in Seattle is hard, okay?)
-            </div>
-            <hr class="mb-4" />
-            <p class="mb-2">
-              Alternative: Neighbor Unions (buliding community power!)
+                > How to Build Radical Community!
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️🌶️🌶️/5
+      
            </p>
-            <a
-              class="mb-2 underline"
-              href="https://social-ecology.org/wp/neighbor-union-cohort/"
-              rel="noopener noreferrer"
-              target="_blank"
-              >Learn about Neighbor Unions!
-            </a>
+            (hey making friends in Seattle is hard, okay?)

-            <p class="mb-2">Difficulty rating: 🌶️🌶️🌶️/5</p>
+            </div>
+            <hr class="mb-4">
+             <p class="mb-2"> Alternative: Neighbor Unions (buliding community power!)</p>
+                <a
+                class="underline mb-2"
+                href="https://social-ecology.org/wp/neighbor-union-cohort/"
+                >Learn about Neighbor Unions!
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️🌶️🌶️/5 
+                </p>
          </div>
+            
+               
+            </div>
+            
+          </div>
+
+        </div>
+        <div class="flex flex-col gap-8">
+          <div class="rounded-lg border p-6">
+            <h2 class="mb-4 text-2xl font-semibold" id="October">October</h2>
+            <div>
+               <p class="mb-2"> Try out JellyFin to host your own media server 
+                and share with friends. You can break up with Netflix, Hulu, Disney+, and more!
+</p>
+                <a
+                class="underline mb-2"
+                href="https://jellyfin.org/docs/general/quick-start/"
+                >Quickstart for JellyFin!
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️🌶️🌶️🌶️/5 
+                </p>
+                
+            
+            
+            
+               
+            </div>
+            
+          </div>
+
+        </div>
+        <div class="flex flex-col gap-8">
+          <div class="rounded-lg border p-6">
+            <h2 class="mb-4 text-2xl font-semibold" id="November">November</h2>
+            <div>
+               <p class="mb-2"> Try out Meet.coop as an open-source, privacy-friendly, and renewable energy-powered alternative to Zoom and Hangouts!  </p>
+                <a
+                class="underline mb-2"
+                href="https://www.meet.coop/"
+                >Make a Meet.coop account!
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️🌶️/5 
+                </p>
+            </div>
+        <hr class="mb-4">
+
+             <p class="mb-2"> Free alternative: Jitsi</p>
+                <a
+                class="underline mb-2"
+                href="https://meet.jit.si/"
+                >Start a Meeting with Jitsi!
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️/5 
+                </p>
+          </div>
+            
+            
+               
+            </div>
+            
+          </div>
+
+        </div>
+        <div class="flex flex-col gap-8">
+          <div class="rounded-lg border p-6">
+            <h2 class="mb-4 text-2xl font-semibold" id="December">December</h2>
+            <div>
+               <p class="mb-2"> Try out Radicale as a privacy-friendly, open-source alternative to Google Calendar and Outlook!</p>
+                <a
+                class="underline mb-2"
+                href="https://radicale.org/master.html#simple-5-minute-setup"
+                >Setting up Radicale Tutorial!
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️🌶️🌶️🌶️🌶️/5 
+                </p>
+              
+               </div>
+              
+            <hr class="mb-4">
+             <p class="mb-2"> Alternative: Proton Calendar</p>
+                <a
+                class="underline mb-2"
+                href="https://calendar.proton.me/"
+                >Switch to Proton Calendar!
+                </a              >
+            
+               <p class="mb-2"> Difficulty rating: 🌶️/5 
+                </p>
+          </div>
+          </div>
+            </div>
+            
+          </div>
+
        </div>
      </div>
    </div>
-    <div class="flex flex-col gap-8">
-      <div class="rounded-lg border p-6">
-        <h2 class="mb-4 text-2xl font-semibold" id="October">October</h2>
-        <div>
-          <p class="mb-2">
-            Try out JellyFin to host your own media server and share with
-            friends. You can break up with Netflix, Hulu, Disney+, and more!
-          </p>
-          <a
-            class="mb-2 underline"
-            href="https://jellyfin.org/docs/general/quick-start/"
-            rel="noopener noreferrer"
-            target="_blank"
-            >Quickstart for JellyFin!
-          </a>
-
-          <p class="mb-2">Difficulty rating: 🌶️🌶️🌶️🌶️/5</p>
-        </div>
-      </div>
-    </div>
-    <div class="flex flex-col gap-8">
-      <div class="rounded-lg border p-6">
-        <h2 class="mb-4 text-2xl font-semibold" id="November">November</h2>
-        <div>
-          <p class="mb-2">
-            Try out Meet.coop as an open-source, privacy-friendly, and renewable
-            energy-powered alternative to Zoom and Hangouts!
-          </p>
-          <a
-            class="mb-2 underline"
-            href="https://www.meet.coop/"
-            rel="noopener noreferrer"
-            target="_blank"
-            >Make a Meet.coop account!
-          </a>
-
-          <p class="mb-2">Difficulty rating: 🌶️🌶️/5</p>
-        </div>
-        <hr class="mb-4" />
-
-        <p class="mb-2">Free alternative: Jitsi</p>
-        <a
-          class="mb-2 underline"
-          href="https://meet.jit.si/"
-          rel="noopener noreferrer"
-          target="_blank"
-          >Start a Meeting with Jitsi!
-        </a>
-
-        <p class="mb-2">Difficulty rating: 🌶️/5</p>
-      </div>
-    </div>
+    <Footer />
  </main>
 </Layout>
-<div class="flex flex-col gap-8">
-  <div class="rounded-lg border p-6">
-    <h2 class="mb-4 text-2xl font-semibold" id="December">December</h2>
-    <div>
-      <p class="mb-2">
-        Try out Radicale as a privacy-friendly, open-source alternative to
-        Google Calendar and Outlook!
-      </p>
-      <a
-        class="mb-2 underline"
-        href="https://radicale.org/master.html#simple-5-minute-setup"
-        rel="noopener noreferrer"
-        target="_blank"
-        >Setting up Radicale Tutorial!
-      </a>
-
-      <p class="mb-2">Difficulty rating: 🌶️🌶️🌶️🌶️🌶️/5</p>
-    </div>
-
-    <hr class="mb-4" />
-    <p class="mb-2">Alternative: Proton Calendar</p>
-    <a
-      class="mb-2 underline"
-      href="https://calendar.proton.me/"
-      rel="noopener noreferrer"
-      target="_blank"
-      >Switch to Proton Calendar!
-    </a>
-
-    <p class="mb-2">Difficulty rating: 🌶️/5</p>
-  </div>
-</div>
-
-<Footer />
@@ -0,0 +1,99 @@
+---
+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="OurProjects" />
+      <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' },
+            ]}
+            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' },
+            ]}
+            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>
@@ -6,12 +6,9 @@ import "../../styles/globals.css";
 ---

 <Layout>
-  <main class="flex min-h-screen flex-col justify-between px-4">
+  <main class="flex min-h-screen flex-col justify-between">
    <div>
-      <section class="sticky top-0">
-        <Navbar client:load activePage="WhatWereUpTo" />
-      </section>
-
+      <Navbar client:load activePage="OurProjects" />
      <div class="px-4">
        <h1 class="pb-4 pt-4 text-3xl font-semibold">Book Club</h1>
        <p class="mb-4">
@@ -26,20 +23,17 @@ import "../../styles/globals.css";
          <div class="rounded-lg border p-6">
            <h2 class="mb-4 text-2xl font-semibold">Current Book</h2>
            <div>
-              Teaching Community Technology Handbook - Detroit Community
-              Technology Project (read for free <a
+              Race After Technology - Ruha Benjamin (see <a
                class="underline"
-                href="https://detroitcommunitytech.org/?q=teachcommtech"
-                rel="noopener noreferrer"
-                target="_blank">here</a
-              >)
+                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="rounded-lg border p-6">
            <h2 class="mb-4 text-2xl font-semibold">Past Books</h2>
            <ul class="list-disc pl-6">
-              <li>Holding Change - Adrienne Maree Brown</li>
              <li>Race After Technology - Ruha Benjamin</li>
              <li>Common Circuits - Luis Felipe R. Murillo</li>
              <li>Internet for the People - Ben Tarnoff</li>
@@ -0,0 +1,21 @@
+---
+import Navbar from "../../components/Navbar";
+import Footer from "../../components/Footer";
+import Layout from "../../layouts/Layout.astro";
+import "../../styles/globals.css";
+---
+
+<Layout>
+  <main class="flex min-h-screen flex-col justify-between">
+    <div>
+      <Navbar client:load activePage="Calendar" />
+      <div class="pl-4 pr-4">
+        <h1 class="pb-4 pt-4 text-3xl font-semibold">Calendar</h1>
+        <div class="flex flex-col gap-4">
+          <p class="mb-4">See what we're doing next!</p>
+        </div>
+      </div>
+    </div>
+    <Footer />
+  </main>
+</Layout>
@@ -0,0 +1,19 @@
+---
+import Navbar from "../../components/Navbar";
+import Footer from "../../components/Footer";
+import Layout from "../../layouts/Layout.astro";
+import "../../styles/globals.css";
+---
+
+<Layout>
+  <main class="flex min-h-screen flex-col justify-between">
+    <div>
+      <Navbar />
+      <div class="pl-4 pr-4">
+        <h1 class="text-3xl font-semibold">Pihole</h1>
+
+      </div>
+    </div>
+    <Footer />
+  </main>
+</Layout>
@@ -7,16 +7,13 @@ import "../../styles/globals.css";
 ---

 <Layout>
-  <main class="px-4 flex min-h-screen flex-col justify-between">
+  <main class="flex min-h-screen flex-col justify-between">
    <div>
-      <section class="sticky top-0">
-        <Navbar client:load activePage="WhatWereUpTo" />
-      </section>
+      <Navbar client:load activePage="OurProjects" />
      <div class="px-4">
        <h1 class="pb-4 pt-4 text-3xl font-semibold">Zines</h1>
        <p class="mb-6">
-          We create and share zines about technology, power, and resistance. You
-          are welcome to download the printable version to fold and distribute!
+          We create and share zines about technology, power, and resistance. You are welcome to download the printable version to fold and distribute!
        </p>

        <ZineGrid client:load />
@@ -25,3 +22,23 @@ import "../../styles/globals.css";
    <Footer />
  </main>
 </Layout>
+
+<style>
+  :global(.flipbook-container) {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    min-height: 520px;
+  }
+
+  :global(.flipbook) {
+    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
+  }
+
+  :global(.page) {
+    background-color: white;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+</style>
@@ -1,79 +0,0 @@
---
-import { Download } from "lucide-react";
-import Navbar from "../../../components/Navbar";
-import Footer from "../../../components/Footer";
-import Layout from "../../../layouts/Layout.astro";
-import { ShareZineButton } from "../../../components/zines/ShareZineButton";
-import { buttonVariants } from "../../../components/ui/button";
-import { zines, type Zine } from "../../../data/zines";
-import "../../../styles/globals.css";
-
-export async function getStaticPaths() {
-  return zines.map((zine) => ({
-    params: { id: zine.id },
-    props: { zine },
-  }));
-}
-
-interface Props {
-  zine: Zine;
-}
-
-const { zine } = Astro.props;
---
-
-<Layout>
-  <main class="px-4 flex min-h-screen flex-col justify-between">
-    <div>
-      <section class="sticky top-0">
-        <Navbar client:load activePage="OurProjects" />
-      </section>
-
-      <div class="px-4">
-        <a
-          href="/projects/zines"
-          class="inline-block pb-4 pt-4 text-sm underline"
-        >
-          ← Back to all zines
-        </a>
-
-        <div class="mx-auto max-w-3xl">
-          <h1 class="text-2xl font-semibold">{zine.title}</h1>
-          {
-            zine.description && (
-              <p class="mt-1 text-sm text-muted-foreground">
-                {zine.description}
-              </p>
-            )
-          }
-
-          <div class="mt-4 flex gap-2">
-            <ShareZineButton client:load zineId={zine.id} />
-            <a
-              href={zine.printablePdf}
-              download
-              class={buttonVariants({ variant: "outline", size: "sm" })}
-            >
-              <Download />
-              Printable
-            </a>
-          </div>
-
-          <div class="flex flex-col gap-4 py-6">
-            {
-              zine.pages.map((page, i) => (
-                <img
-                  src={page}
-                  alt={`Page ${i + 1} of ${zine.title}`}
-                  loading={i === 0 ? "eager" : "lazy"}
-                  class="h-auto w-full rounded bg-white shadow-sm"
-                />
-              ))
-            }
-          </div>
-        </div>
-      </div>
-    </div>
-    <Footer />
-  </main>
-</Layout>
@@ -1,7 +1,6 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
-
@layer base {
  :root {
    --background: 0 0% 100%;
@@ -30,7 +29,6 @@
    --chart-5: 27 87% 67%;
    --radius: 0.5rem;
  }
-
  .dark {
    --background: 0 0% 3.9%;
    --foreground: 0 0% 98%;
@@ -58,12 +56,10 @@
    --chart-5: 340 75% 55%;
  }
 }
-
@layer base {
  * {
    @apply border-border;
  }
-
  body {
    @apply bg-background text-foreground;
  }
@@ -74,20 +70,8 @@
  src: url("/fonts/Geist[wght].ttf") format("truetype");
  font-display: swap;
 }
-
@font-face {
  font-family: "GeistMono";
  src: url("/fonts/GeistMono[wght].ttf") format("truetype");
  font-display: swap;
 }
-
-.hamburger {
-  cursor: pointer;
-}
-
-.hamburger .line {
-  display: block;
-  width: 36px;
-  height: 2px;
-  margin-bottom: 8px;
-}
Author	SHA1	Message	Date
moosemower	0b8c68d6f7	Simplify deployment instructions The deployment instructions were out of date and duplicated elsewhere, so I've updated the documentation on the rtm-config repo and the how-to-get-access page in our collectives and just pointed the instructions there.	2026-04-27 00:32:11 +00:00
Jiajun Xu	589f72d091	allow zooming when reading zines	2026-03-30 20:58:57 -07:00
brookechr	2720269dd0	Merge pull request 'fixing out of order pages' (#5 ) from strawberry/discotech-101-pages-out-of-order into main Reviewed-on: #5	2026-03-17 02:21:04 +00:00
brookechr	b31d82f818	fixing out of order pages	2026-03-16 19:19:54 -07:00
brookechr	ca3a7ad1d1	Merge pull request 'Adding Signal 101 Zine and Making Some Capitalization/Naming Fixes for Other Zines' (#4 ) from strawberry/signal-101-zine into main Reviewed-on: #4	2026-02-26 04:58:24 +00:00
brookechr	7bae8b5855	updates to zine data file	2026-02-25 20:56:16 -08:00
brookechr	5350e8edd7	signal 101 printable	2026-02-25 20:55:40 -08:00
brookechr	b4dbf78e97	rename printable	2026-02-25 20:55:01 -08:00
brookechr	972a444e20	rename De-monopoly Cheatsheet to Brief Notes from a De-Monopoly DiscoTech	2026-02-25 20:54:23 -08:00
brookechr	0cfd0881dd	adding signal 101 zine pages	2026-02-25 20:52:21 -08:00
Jiajun Xu	c0df0a88d3	add a new zine	2026-02-02 15:56:16 -08:00
Jiajun Xu	324ab016bb	1. fix copyleft year and color in darkmode 2. remove duplicate ourprojects title	2026-01-26 21:48:58 -08:00
Jiajun Xu	093cf89f8a	remove duplicate entries in the projects page	2026-01-21 08:30:13 -08:00
Jiajun Xu	46a9b171fb	Change printable zine permission so they can be downloaded; rename flipbookviewer to zineviewer	2026-01-21 08:20:25 -08:00
jordansullivan	0deb1c79fd	Fixing all the stuff I effed up in rebasing	2026-01-19 22:44:08 -08:00
jordansullivan	7360832ea7	pet calendar updates	2026-01-19 22:44:08 -08:00
jordansullivan	3928397480	Add all the tutorial links babyyyy	2026-01-19 22:44:08 -08:00
jordansullivan	4356e34ba6	Create pet calendar page	2026-01-19 22:44:08 -08:00
Jiajun Xu	79fcb594db	rename ../ourprojectspages/... to just .../projects/... in the page route	2026-01-19 22:44:08 -08:00
Jiajun Xu	d6e0503628	add zines to our projects	2026-01-19 22:44:08 -08:00
Jiajun Xu	bdfd923616	update bookclub page; rename What Were Working On to Our Projects in the code	2026-01-19 22:44:08 -08:00
jordansullivan	e52c85771b	Merge pull request 'Create pet calendar page' (#3 ) from js/petcal into main Reviewed-on: #3	2026-01-20 06:42:35 +00:00
ammaratef45	a3babbf197	Merge branch 'main' into js/petcal	2026-01-19 22:13:06 -08:00
jordansullivan	79edc86434	Fixing all the stuff I effed up in rebasing	2026-01-19 21:47:23 -08:00
jordansullivan	9a1a0c8512	pet calendar updates	2026-01-19 21:37:30 -08:00
jordansullivan	1da38ce8c7	Add all the tutorial links babyyyy	2026-01-19 21:37:13 -08:00
jordansullivan	78a5169d88	Create pet calendar page	2026-01-19 21:36:10 -08:00
Jiajun Xu	7846526ef2	rename ../ourprojectspages/... to just .../projects/... in the page route	2026-01-19 21:35:51 -08:00
Jiajun Xu	54e7560cd1	add zines to our projects	2026-01-19 21:35:34 -08:00
Jiajun Xu	a81b1784d2	update bookclub page; rename What Were Working On to Our Projects in the code	2026-01-19 21:34:04 -08:00
Jiajun Xu	ec5a121c4f	Update Our Points of Unity	2026-01-19 21:32:54 -08:00
Jiajun Xu	c6d6d377b7	make navbar buttons less dark in light mode	2026-01-19 21:32:54 -08:00
Jiajun Xu	2e6e99a4b5	1. Rename What we're working on to our projects 2. make them look clickable	2026-01-19 21:32:54 -08:00
Jiajun Xu	aaec7affc0	remove stale alternatives	2026-01-19 21:32:54 -08:00
jordansullivan	420df0293a	Add all the tutorial links babyyyy	2026-01-19 21:22:02 -08:00
Jiajun Xu	108161daf9	rename ../ourprojectspages/... to just .../projects/... in the page route	2026-01-18 22:38:15 -08:00
Jiajun Xu	7cb915c522	add zines to our projects	2026-01-18 21:56:55 -08:00
Jiajun Xu	9179b12c93	update bookclub page; rename What Were Working On to Our Projects in the code	2026-01-18 21:02:11 -08:00
Jiajun Xu	09a785f7f6	Update Our Points of Unity	2026-01-18 20:33:54 -08:00
Jiajun Xu	32dae3e43f	make navbar buttons less dark in light mode	2026-01-15 21:18:37 -08:00
jordansullivan	f359268d83	Create pet calendar page	2026-01-15 21:10:16 -08:00
Jiajun Xu	b3983aab3c	1. Rename What we're working on to our projects 2. make them look clickable	2026-01-15 20:50:38 -08:00
Jiajun Xu	ac4588e9d0	remove stale alternatives	2026-01-15 20:31:54 -08:00
brookechr	48e7b3f4d0	Merge pull request 'updating readme with deployment info' (#2 ) from strawberry/readme-deployment-info-update into main Reviewed-on: #2 Reviewed-by: ammaratef45 <ammaratef45@proton.me>	2025-10-17 04:22:59 +00:00
brookechr	8c50e82f08	addressing feedback	2025-10-16 21:22:14 -07:00
brookechr	d760e6969e	adding instructions for clone of sootie-config	2025-10-14 12:18:01 -07:00
brookechr	606b5ea6a8	updating readme with deployment info	2025-10-14 12:12:01 -07:00
brookechr	84cdfa88d6	adding discussion guide to book club	2025-10-13 22:33:46 -07:00
brookechr	c0daa32bae	adjusting book club pic width	2025-10-13 20:12:52 -07:00
brookechr	64cc094b01	add details to readme	2025-10-13 19:52:16 -07:00
Jiajun Xu	51f53f94a8	update version to 0.0.8	2025-10-13 19:17:42 -07:00
brookechr	3398a31ca4	fixing horizontal sizing issue in navbar	2025-10-09 19:54:42 -07:00
brookechr	382dc7dc19	updating book club page	2025-10-09 19:52:03 -07:00
Jiajun Xu	0832e3eb87	update README with deployment instruction	2025-09-01 15:02:50 -07:00
Jiajun Xu	d6b883aee4	update tags	2025-09-01 13:31:39 -07:00
Jiajun Xu	79fc2451ab	strike through big tech option	2025-09-01 13:26:42 -07:00
Jiajun Xu	153b40b85a	remove this website from what we are working on + add alternatives page	2025-09-01 13:17:24 -07:00
Jiajun Xu	8be9da4584	add alt page	2025-08-19 16:08:26 -07:00
ammaratef45	5046aad6ef	update to 0.0.6 version	2025-07-31 22:10:29 -07:00
ammaratef45	bd4f1c6913	update version to 0.0.3	2025-07-31 21:56:41 -07:00
ammaratef45	672802df39	add a heart symbol to points of unity	2025-07-31 21:53:41 -07:00
ammaratef45	fa759c67e5	add build badge	2025-07-31 21:45:32 -07:00
ammaratef45	20c0c1f7c9	add .drone.yml	2025-07-31 21:40:50 -07:00
brookechr	f1e8617fa1	update README and get rid of astro embed	2025-06-16 21:02:43 -07:00
brookechr	28a086faca	Merge branch 'main' of https://git.coopcloud.tech/RTM/rtm-website	2025-06-13 17:21:34 -07:00
brookechr	972be5c196	update computer icon and add commented out calendar page	2025-06-13 17:21:26 -07:00
Jiajun Xu	6e0da27d4b	add details for book club	2025-06-09 20:23:35 -07:00
Jiajun Xu	a32798503a	make the computer/people icon numbers not hard coded	2025-05-22 21:01:57 -07:00
Jiajun Xu	d3fe1001e3	1. remove ../public from asset links 2. add book club page	2025-05-22 20:36:44 -07:00
Ammar Hussein	7c4b1083ef	deployment configs and instructions	2025-05-15 19:57:46 -07:00
brookechr	1ac6ad02ea	polishing!	2025-05-08 19:07:23 -07:00
brookechr	f169793c0f	Merge branch 'main' of https://git.coopcloud.tech/RTM/rtm-website	2025-05-01 20:51:03 -07:00
brookechr	68f0ae3ab2	movin pictures around	2025-05-01 20:51:01 -07:00
Jiajun Xu	cb234b1a9c	format the points of unity	2025-05-01 20:49:06 -07:00
Jiajun Xu	df5baa6dca	fix computer and people icons	2025-05-01 20:44:27 -07:00
Jiajun Xu	afb5f79bc0	highlight the current page on the navbar	2025-05-01 20:25:42 -07:00
Jiajun Xu	f45bc19e8a	add the sign up button	2025-05-01 19:59:21 -07:00
brookechr	059389db1c	navbar code cleanup	2025-05-01 19:55:42 -07:00
brookechr	e757727980	h1 title styling	2025-05-01 19:55:04 -07:00
brookechr	8b5108517e	uppercase page names	2025-05-01 19:44:25 -07:00
Jiajun Xu	56ba8012ad	Redirect to home page when clicking RTM	2025-05-01 19:26:46 -07:00
brookechr	4e57fbcbd4	adding tailwind docs to readme	2025-05-01 19:26:05 -07:00
brookechr	2fc219b8eb	making UI work	2025-05-01 19:22:40 -07:00
brookechr	adf33abeeb	Merge branch 'main' of https://git.coopcloud.tech/RTM/rtm-website	2025-05-01 18:51:17 -07:00
Jiajun Xu	f00ab0b34e	add instruction to readme	2025-04-24 20:32:21 -07:00