Add self-hosted list

docusaurus.config.js

@@ -99,10 +99,11 @@ const config = {
         },
         items: [
           { to: '/blog', label: 'Blog', position: 'left' },
+          { to: '/selfhosted-list', label: 'Self-hosted List', position: 'left' },
         ],
       },
       footer: {
-        style: 'dark',
+        style: 'light',
         links: [
           {
             title: 'This site sections:',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "yevi-org",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "private": true,
   "scripts": {
     "docusaurus": "docusaurus",

src/components/HomepageFeatures/styles.module.css

@@ -22,14 +22,18 @@
 }
 
 .featureSvg {
-  height: 100px;
+  height: 60px;
-  width: 100px;
+  width: 60px;
 }
 
 .featureSvg path {
   fill: var(--ifm-link-color) !important;
 }
 
+.featureBlock:hover .featureSvg path {
+  opacity: 0.7;
+}
+
 .featureLink {
   display: contents;
   color: unset;
@@ -44,3 +48,7 @@
   text-decoration: none;
   color: unset;
 }
+
+.featureLink p {
+  color: var(--ifm-color-secondary-contrast-foreground);
+}

src/css/custom.css

@@ -16,7 +16,13 @@
   --ifm-code-font-size: 95%;
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
   --ifm-footer-link-hover-color: #b07ab0;
-  --ifm-link-color: var(--ifm-color-primary-lightest)
+  --ifm-link-color: var(--ifm-color-primary-lightest);
+  --ifm-global-shadow-lw: 0 1px 2px 0 #541d5428;
+}
+
+.hero--primary {
+  --ifm-hero-background-color: transparent;
+  --ifm-hero-text-color: var(--ifm-font-color-base);
 }
 
 /* For readability concerns, you should choose a lighter palette in dark mode. */
@@ -31,3 +37,7 @@
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
   --ifm-link-color: var(--ifm-color-primary-darker);
 }
+
+.hero {
+  border-bottom: 2px solid var(--ifm-color-primary-opaque-2);
+}

src/pages/selfhosted-list.md

@@ -0,0 +1,59 @@
+---
+title: Self-hosted List
+description: A list of services I'm currently hosting for myself, family and friends
+---
+
+A list of services I'm currently hosting for myself, family and friends.
+
+## Publicly accessible
+
+Services anyone on the internet can access.
+
+- This website. Powered by **Docusaurus**
+- **Gitea**
+
+## Restricted
+
+Services exposed to the internet, but require authorization.
+
+- **Plausible Analytics**
+- **Plane** project management tool
+- **Kan.bn**
+- **Outline**
+- **Yamtrack**
+- **AdventureLog**
+- **Authentik**
+- **Synapse** Matrix server
+- **Matrix Authentication Service**
+- **Home Assistant**
+- **Plex**
+- **n8n**
+- **FreshRSS**
+
+## Internal
+
+Services accessible only from my home network or Tailnet.
+
+- Zoraxy
+- Caddy
+- Grafana
+- Prometheus
+- InfuxDB
+- Dockge
+- Studio Code Server
+- Gitea Action Runner
+- Element Admin
+- Sonarr
+- Radarr
+- Prowlarr
+- qBittorrent
+- Proxmox Backup Server
+
+## Operating Systems
+
+- TrueNAS Community Edition
+- Proxmox VE
+
+## Tools
+
+- Tailscale