Update Vite Dependency + Release 1.0.9

Reviewed-on: https://forgejo.neshweb.net///Neshweb-Sites/main-site/pulls/50

.eslintignore

@@ -0,0 +1,15 @@
+.DS_Store
+node_modules
+/build
+/.svelte-kit
+/package
+.env
+.env.*
+!.env.example
+
+# Ignore files for PNPM, NPM and YARN
+pnpm-lock.yaml
+package-lock.json
+yarn.lock
+
+/src/lib/components/ui

.eslintrc.cjs

@@ -0,0 +1,31 @@
+/** @type { import("eslint").Linter.Config } */
+module.exports = {
+	root: true,
+	extends: [
+		'eslint:recommended',
+		'plugin:@typescript-eslint/recommended',
+		'plugin:svelte/recommended',
+		'prettier'
+	],
+	parser: '@typescript-eslint/parser',
+	plugins: ['@typescript-eslint'],
+	parserOptions: {
+		sourceType: 'module',
+		ecmaVersion: 2020,
+		extraFileExtensions: ['.svelte']
+	},
+	env: {
+		browser: true,
+		es2017: true,
+		node: true
+	},
+	overrides: [
+		{
+			files: ['*.svelte'],
+			parser: 'svelte-eslint-parser',
+			parserOptions: {
+				parser: '@typescript-eslint/parser'
+			}
+		}
+	]
+};

.forgejo/workflows/build+release.yml

@@ -0,0 +1,78 @@
+name: 'Build and Release Docker Image'
+author: 'Neshura'
+
+on:
+  push:
+    tags:
+      - '[0-9]+.[0-9]+.[0-9]+'
+      - '[0-9]+.[0-9]+.[0-9]+-rc.[0-9]+'
+jobs:
+  test:
+    runs-on: docker
+    steps:
+      - name: Checking Out Repository Code
+        uses: https://code.forgejo.org/actions/checkout@v3
+      - name: Get Yarn Cache Directory
+        id: yarn-cache-dir-path
+        run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT
+      - name: Set Up Yarn Cache
+        uses: actions/cache@v3
+        id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
+        with:
+          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+      - name: Install Dependencies
+        run: yarn install
+      - name: Run Linter
+        run: yarn lint
+
+  build:
+    needs: test
+    if: success()
+    runs-on: dind
+    steps:
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
+        with:
+          config-inline: |
+            [registry."docker.io"]
+              mirrors = ["https://docker-cache.neshweb.net"]
+
+      - name: Login to Docker Hub
+        uses: docker/login-action@v3
+        with:
+          registry: forgejo.neshweb.net
+          username: ${{ secrets.FORGEJO_USERNAME }}
+          password: ${{ secrets.FORGEJO_TOKEN }}
+
+      - name: Determine Docker tags
+        id: tags
+        run: |
+          if echo ${{ github.ref_name }} | grep -qi '\-rc' ; then
+            echo latest=forgejo.neshweb.net/neshweb-sites/${{ github.event.repository.name }}:preview >> $GITHUB_OUTPUT;
+          else
+            echo latest=forgejo.neshweb.net/neshweb-sites/${{ github.event.repository.name }}:latest >> $GITHUB_OUTPUT;
+          fi
+          echo version=forgejo.neshweb.net/neshweb-sites/${{ github.event.repository.name }}:${{ github.ref_name }} >> $GITHUB_OUTPUT;
+
+      - name: Push to Package Registry
+        uses: docker/build-push-action@v5
+        with:
+          push: true
+          tags: ${{ steps.tags.outputs.version }}, ${{ steps.tags.outputs.latest }}
+
+  release:
+    needs: build
+    if: success()
+    runs-on: docker
+    steps:
+      - name: Release New Version
+        uses: actions/forgejo-release@v2
+        with:
+          direction: upload
+          url: https://forgejo.neshweb.net
+          release-dir: release
+          token: ${{ secrets.FORGEJO_TOKEN }}
+          tag: ${{  github.ref_name }}

.forgejo/workflows/pull-requests.yml

@@ -0,0 +1,29 @@
+name: 'Build Docker Image on Pull Request'
+author: 'Neshura'
+
+
+on:
+  pull_request:
+    branches:
+      - main
+jobs:
+  test:
+    runs-on: docker
+    steps:
+      - name: Checking Out Repository Code
+        uses: https://code.forgejo.org/actions/checkout@v3
+      - name: Get Yarn Cache Directory
+        id: yarn-cache-dir-path
+        run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT
+      - name: Set Up Yarn Cache
+        uses: actions/cache@v3
+        id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
+        with:
+          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+      - name: Install Dependencies
+        run: yarn install
+      - name: Run Linter
+        run: yarn lint

.forgejo/workflows/test.yml

@@ -0,0 +1,35 @@
+name: 'Run Tests on Code'
+author: 'Neshura'
+
+on: 
+    push:
+        tags-ignore:
+            - '**'
+        branches:
+            - '**'
+jobs:
+    test:
+        runs-on: docker
+        steps:
+            -
+                name: Checking Out Repository Code
+                uses: https://code.forgejo.org/actions/checkout@v3
+            -
+                name: Get Yarn Cache Directory
+                id: yarn-cache-dir-path
+                run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT
+            -
+                name: Set Up Yarn Cache
+                uses: actions/cache@v3
+                id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
+                with:
+                    path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+                    key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+                    restore-keys: |
+                        ${{ runner.os }}-yarn-
+            -
+                name: Install Dependencies
+                run: yarn install
+            -
+                name: Run Linter
+                run: yarn lint

.forgejo/workflows/unlighthouse.yml

@@ -0,0 +1,75 @@
+name: 'Test Docker Image with Unlighthouse'
+author: 'Neshura'
+
+on:
+  push:
+    tags:
+      - '[0-9]+.[0-9]+.[0-9]+'
+      - '[0-9]+.[0-9]+.[0-9]+-rc.[0-9]+'
+  pull_request:
+    branches:
+      - main
+jobs:
+  test:
+    runs-on: docker
+    steps:
+      - name: Checking Out Repository Code
+        uses: https://code.forgejo.org/actions/checkout@v3
+
+      - name: Get Yarn Cache Directory
+        id: yarn-cache-dir-path
+        run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT
+
+      - name: Set Up Yarn Cache
+        uses: actions/cache@v3
+        id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
+        with:
+          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
+          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+
+      - name: Install Dependencies
+        run: yarn install
+
+      - name: Install Chromium for Unlighthouse
+        run: |
+          echo "apt update && apt install -y chromium"
+          apt update && apt install -y chromium
+          echo 'export CHROMIUM_FLAGS="$CHROMIUM_FLAGS --no-sandbox" >> /etc/chromium.d/default-flags'
+          echo 'export CHROMIUM_FLAGS="$CHROMIUM_FLAGS --no-sandbox"' >> /etc/chromium.d/default-flags
+
+      - name: Add Unlighthouse
+        run: |
+          echo "yarn global add @unlighthouse/cli"
+          yarn global add @unlighthouse/cli
+
+      - name: Build Site
+        run: yarn build
+
+      - name: Start Server
+        run: |
+          export KUMA_USERNAME=${{ secrets.KUMA_USERNAME }}
+          export KUMA_PASSWORD=${{ secrets.KUMA_PASSWORD }}
+          yarn preview &
+
+      - name: Run Unlighthouse for Desktop
+        run: unlighthouse-ci --build-static --desktop --outputPath reports/desktop
+
+      - name: Refresh Server
+        run: |
+          if ! pgrep -f "node /usr/bin/yarn" ; then
+            export KUMA_USERNAME=${{ secrets.KUMA_USERNAME }}
+            export KUMA_PASSWORD=${{ secrets.KUMA_PASSWORD }}
+            yarn preview &
+          fi
+
+      - name: Run Unlighthouse for Mobile
+        run: unlighthouse-ci --build-static --mobile --outputPath reports/mobile
+
+      - name: Uploading Lighthouse Reports
+        uses: actions/upload-artifact@v3
+        with:
+          name: lighthouse
+          path: reports
+          if-no-files-found: error

.gitignore

@@ -1,19 +1,13 @@
-# do not track installed modules
+.DS_Store
-node_modules/
+node_modules
-.vscode/
+/build
-
+/.svelte-kit
-# do not track built files
+/package
-.next/
+/.idea
-*.tsbuildinfo
+credentials.json
-next-env.d.ts
+.unlighthouse
-
+.env
-# debug
+.env.*
-npm-debug.log*
+!.env.example
-yarn-debug.log*
+vite.config.js.timestamp-*
-yarn-error.log*
+vite.config.ts.timestamp-*
-.pnpm-debug.log*
-
-# production
-build/
-data/
-confs/

.gitlab-ci.yml

@@ -1,65 +0,0 @@
-stages:
-  - lint
-  #- test
-  - build
-  - deploy
-
-variables:
-  IMAGE_TAG: $CI_REGISTRY_IMAGE:$CI_COMMIT_TAG
-  IMAGE_LATEST: $CI_REGISTRY_IMAGE:develop
-
-
-.node:
-  image: ${CI_DEPENDENCY_PROXY_GROUP_IMAGE_PREFIX}/node:latest
-
-
-.docker:
-  image: ${CI_DEPENDENCY_PROXY_GROUP_IMAGE_PREFIX}/docker:20
-  rules:
-  - if: $CI_COMMIT_TAG && $CI_COMMIT_TAG !~ /(^t)+.*/
-    variables:
-      IMAGE_LATEST: $CI_REGISTRY_IMAGE:latest
-  - if: $CI_COMMIT_TAG
-
-
-linter:
-  image: !reference [.node, image]
-  stage: lint
-  before_script:
-    - yarn install
-  script:
-    - yarn lint
-
-
-build:
-  image: !reference [.docker, image]
-  stage: build
-  before_script:
-    - docker login -u $CI_REGISTRY_USER -p $CI_REGISTRY_PASSWORD $CI_REGISTRY
-  script:
-    - docker build -t $IMAGE_TAG .
-  after_script:
-    - docker save $IMAGE_TAG > docker.tar
-  artifacts:
-    expire_in: 30 mins
-    paths:
-      - docker.tar
-  rules:
-    - !reference [.docker, rules]
-
-
-push:
-  image: !reference [.docker, image]
-  stage: deploy
-  needs: 
-    - job: build
-      artifacts: true
-  before_script:
-    - docker login -u $CI_REGISTRY_USER -p $CI_REGISTRY_PASSWORD $CI_REGISTRY
-    - docker load -i docker.tar
-  script:
-    - docker tag $IMAGE_TAG $IMAGE_LATEST
-    - docker push $IMAGE_TAG
-    - docker push $IMAGE_LATEST
-  rules:
-    - !reference [.docker, rules]

.npmrc

@@ -0,0 +1 @@
+engine-strict=true

.prettierignore

@@ -0,0 +1,4 @@
+# Ignore files for PNPM, NPM and YARN
+pnpm-lock.yaml
+package-lock.json
+yarn.lock

.prettierrc

@@ -0,0 +1,15 @@
+{
+	"useTabs": true,
+	"singleQuote": true,
+	"trailingComma": "none",
+	"printWidth": 100,
+	"plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
+	"overrides": [
+		{
+			"files": "*.svelte",
+			"options": {
+				"parser": "svelte"
+			}
+		}
+	]
+}

.vite/deps_temp_f2821d96/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "module"
+}

Dockerfile

@@ -1,45 +1,19 @@
-## INIT STEP
+FROM node:20-bookworm as build
-# Install dependencies only when needed
-FROM node:16-alpine AS deps
-
-RUN apk add --no-cache libc6-compat
-WORKDIR /app
-
-# Copy the files needed to install deps
-COPY package.json yarn.lock ./
-RUN yarn install --frozen-lockfile
-
-## BUILD STEP
-# Rebuild the source code only when needed
-FROM node:16-alpine AS builder
 
 WORKDIR /app
 
-# Copy node_modules installed by the deps step
+COPY . ./
-COPY --from=deps /app/node_modules ./node_modules
+RUN yarn install
-
-COPY . .
 
 RUN yarn build
 
-## RUN STEP
-FROM node:16-alpine AS runner
 
-LABEL author="neshura@proton.me"
+FROM node:20-alpine
-WORKDIR /usr/src/app
+
+WORKDIR /app
+COPY --from=build /app .
 
 ENV NODE_ENV production
 
-COPY --from=builder /app/public ./public
+EXPOSE 8000
-COPY --from=builder /app/node_modules ./node_modules
+CMD ["yarn", "preview"]
-
-# Automatically leverage output traces to reduce image size
-# https://nextjs.org/docs/advanced-features/output-file-tracing
-COPY --from=builder /app/.next/standalone ./
-COPY --from=builder /app/.next/static ./.next/static
-
-# expose port 3000
-ENV PORT 3000
-EXPOSE 3000
-
-CMD [ "yarn", "start" ]

LICENSE

@@ -0,0 +1,661 @@
+                    GNU AFFERO GENERAL PUBLIC LICENSE
+                       Version 3, 19 November 2007
+
+ Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+                            Preamble
+
+  The GNU Affero General Public License is a free, copyleft license for
+software and other kinds of works, specifically designed to ensure
+cooperation with the community in the case of network server software.
+
+  The licenses for most software and other practical works are designed
+to take away your freedom to share and change the works.  By contrast,
+our General Public Licenses are intended to guarantee your freedom to
+share and change all versions of a program--to make sure it remains free
+software for all its users.
+
+  When we speak of free software, we are referring to freedom, not
+price.  Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+them if you wish), that you receive source code or can get it if you
+want it, that you can change the software or use pieces of it in new
+free programs, and that you know you can do these things.
+
+  Developers that use our General Public Licenses protect your rights
+with two steps: (1) assert copyright on the software, and (2) offer
+you this License which gives you legal permission to copy, distribute
+and/or modify the software.
+
+  A secondary benefit of defending all users' freedom is that
+improvements made in alternate versions of the program, if they
+receive widespread use, become available for other developers to
+incorporate.  Many developers of free software are heartened and
+encouraged by the resulting cooperation.  However, in the case of
+software used on network servers, this result may fail to come about.
+The GNU General Public License permits making a modified version and
+letting the public access it on a server without ever releasing its
+source code to the public.
+
+  The GNU Affero General Public License is designed specifically to
+ensure that, in such cases, the modified source code becomes available
+to the community.  It requires the operator of a network server to
+provide the source code of the modified version running there to the
+users of that server.  Therefore, public use of a modified version, on
+a publicly accessible server, gives the public access to the source
+code of the modified version.
+
+  An older license, called the Affero General Public License and
+published by Affero, was designed to accomplish similar goals.  This is
+a different license, not a version of the Affero GPL, but Affero has
+released a new version of the Affero GPL which permits relicensing under
+this license.
+
+  The precise terms and conditions for copying, distribution and
+modification follow.
+
+                       TERMS AND CONDITIONS
+
+  0. Definitions.
+
+  "This License" refers to version 3 of the GNU Affero General Public License.
+
+  "Copyright" also means copyright-like laws that apply to other kinds of
+works, such as semiconductor masks.
+
+  "The Program" refers to any copyrightable work licensed under this
+License.  Each licensee is addressed as "you".  "Licensees" and
+"recipients" may be individuals or organizations.
+
+  To "modify" a work means to copy from or adapt all or part of the work
+in a fashion requiring copyright permission, other than the making of an
+exact copy.  The resulting work is called a "modified version" of the
+earlier work or a work "based on" the earlier work.
+
+  A "covered work" means either the unmodified Program or a work based
+on the Program.
+
+  To "propagate" a work means to do anything with it that, without
+permission, would make you directly or secondarily liable for
+infringement under applicable copyright law, except executing it on a
+computer or modifying a private copy.  Propagation includes copying,
+distribution (with or without modification), making available to the
+public, and in some countries other activities as well.
+
+  To "convey" a work means any kind of propagation that enables other
+parties to make or receive copies.  Mere interaction with a user through
+a computer network, with no transfer of a copy, is not conveying.
+
+  An interactive user interface displays "Appropriate Legal Notices"
+to the extent that it includes a convenient and prominently visible
+feature that (1) displays an appropriate copyright notice, and (2)
+tells the user that there is no warranty for the work (except to the
+extent that warranties are provided), that licensees may convey the
+work under this License, and how to view a copy of this License.  If
+the interface presents a list of user commands or options, such as a
+menu, a prominent item in the list meets this criterion.
+
+  1. Source Code.
+
+  The "source code" for a work means the preferred form of the work
+for making modifications to it.  "Object code" means any non-source
+form of a work.
+
+  A "Standard Interface" means an interface that either is an official
+standard defined by a recognized standards body, or, in the case of
+interfaces specified for a particular programming language, one that
+is widely used among developers working in that language.
+
+  The "System Libraries" of an executable work include anything, other
+than the work as a whole, that (a) is included in the normal form of
+packaging a Major Component, but which is not part of that Major
+Component, and (b) serves only to enable use of the work with that
+Major Component, or to implement a Standard Interface for which an
+implementation is available to the public in source code form.  A
+"Major Component", in this context, means a major essential component
+(kernel, window system, and so on) of the specific operating system
+(if any) on which the executable work runs, or a compiler used to
+produce the work, or an object code interpreter used to run it.
+
+  The "Corresponding Source" for a work in object code form means all
+the source code needed to generate, install, and (for an executable
+work) run the object code and to modify the work, including scripts to
+control those activities.  However, it does not include the work's
+System Libraries, or general-purpose tools or generally available free
+programs which are used unmodified in performing those activities but
+which are not part of the work.  For example, Corresponding Source
+includes interface definition files associated with source files for
+the work, and the source code for shared libraries and dynamically
+linked subprograms that the work is specifically designed to require,
+such as by intimate data communication or control flow between those
+subprograms and other parts of the work.
+
+  The Corresponding Source need not include anything that users
+can regenerate automatically from other parts of the Corresponding
+Source.
+
+  The Corresponding Source for a work in source code form is that
+same work.
+
+  2. Basic Permissions.
+
+  All rights granted under this License are granted for the term of
+copyright on the Program, and are irrevocable provided the stated
+conditions are met.  This License explicitly affirms your unlimited
+permission to run the unmodified Program.  The output from running a
+covered work is covered by this License only if the output, given its
+content, constitutes a covered work.  This License acknowledges your
+rights of fair use or other equivalent, as provided by copyright law.
+
+  You may make, run and propagate covered works that you do not
+convey, without conditions so long as your license otherwise remains
+in force.  You may convey covered works to others for the sole purpose
+of having them make modifications exclusively for you, or provide you
+with facilities for running those works, provided that you comply with
+the terms of this License in conveying all material for which you do
+not control copyright.  Those thus making or running the covered works
+for you must do so exclusively on your behalf, under your direction
+and control, on terms that prohibit them from making any copies of
+your copyrighted material outside their relationship with you.
+
+  Conveying under any other circumstances is permitted solely under
+the conditions stated below.  Sublicensing is not allowed; section 10
+makes it unnecessary.
+
+  3. Protecting Users' Legal Rights From Anti-Circumvention Law.
+
+  No covered work shall be deemed part of an effective technological
+measure under any applicable law fulfilling obligations under article
+11 of the WIPO copyright treaty adopted on 20 December 1996, or
+similar laws prohibiting or restricting circumvention of such
+measures.
+
+  When you convey a covered work, you waive any legal power to forbid
+circumvention of technological measures to the extent such circumvention
+is effected by exercising rights under this License with respect to
+the covered work, and you disclaim any intention to limit operation or
+modification of the work as a means of enforcing, against the work's
+users, your or third parties' legal rights to forbid circumvention of
+technological measures.
+
+  4. Conveying Verbatim Copies.
+
+  You may convey verbatim copies of the Program's source code as you
+receive it, in any medium, provided that you conspicuously and
+appropriately publish on each copy an appropriate copyright notice;
+keep intact all notices stating that this License and any
+non-permissive terms added in accord with section 7 apply to the code;
+keep intact all notices of the absence of any warranty; and give all
+recipients a copy of this License along with the Program.
+
+  You may charge any price or no price for each copy that you convey,
+and you may offer support or warranty protection for a fee.
+
+  5. Conveying Modified Source Versions.
+
+  You may convey a work based on the Program, or the modifications to
+produce it from the Program, in the form of source code under the
+terms of section 4, provided that you also meet all of these conditions:
+
+    a) The work must carry prominent notices stating that you modified
+    it, and giving a relevant date.
+
+    b) The work must carry prominent notices stating that it is
+    released under this License and any conditions added under section
+    7.  This requirement modifies the requirement in section 4 to
+    "keep intact all notices".
+
+    c) You must license the entire work, as a whole, under this
+    License to anyone who comes into possession of a copy.  This
+    License will therefore apply, along with any applicable section 7
+    additional terms, to the whole of the work, and all its parts,
+    regardless of how they are packaged.  This License gives no
+    permission to license the work in any other way, but it does not
+    invalidate such permission if you have separately received it.
+
+    d) If the work has interactive user interfaces, each must display
+    Appropriate Legal Notices; however, if the Program has interactive
+    interfaces that do not display Appropriate Legal Notices, your
+    work need not make them do so.
+
+  A compilation of a covered work with other separate and independent
+works, which are not by their nature extensions of the covered work,
+and which are not combined with it such as to form a larger program,
+in or on a volume of a storage or distribution medium, is called an
+"aggregate" if the compilation and its resulting copyright are not
+used to limit the access or legal rights of the compilation's users
+beyond what the individual works permit.  Inclusion of a covered work
+in an aggregate does not cause this License to apply to the other
+parts of the aggregate.
+
+  6. Conveying Non-Source Forms.
+
+  You may convey a covered work in object code form under the terms
+of sections 4 and 5, provided that you also convey the
+machine-readable Corresponding Source under the terms of this License,
+in one of these ways:
+
+    a) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by the
+    Corresponding Source fixed on a durable physical medium
+    customarily used for software interchange.
+
+    b) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by a
+    written offer, valid for at least three years and valid for as
+    long as you offer spare parts or customer support for that product
+    model, to give anyone who possesses the object code either (1) a
+    copy of the Corresponding Source for all the software in the
+    product that is covered by this License, on a durable physical
+    medium customarily used for software interchange, for a price no
+    more than your reasonable cost of physically performing this
+    conveying of source, or (2) access to copy the
+    Corresponding Source from a network server at no charge.
+
+    c) Convey individual copies of the object code with a copy of the
+    written offer to provide the Corresponding Source.  This
+    alternative is allowed only occasionally and noncommercially, and
+    only if you received the object code with such an offer, in accord
+    with subsection 6b.
+
+    d) Convey the object code by offering access from a designated
+    place (gratis or for a charge), and offer equivalent access to the
+    Corresponding Source in the same way through the same place at no
+    further charge.  You need not require recipients to copy the
+    Corresponding Source along with the object code.  If the place to
+    copy the object code is a network server, the Corresponding Source
+    may be on a different server (operated by you or a third party)
+    that supports equivalent copying facilities, provided you maintain
+    clear directions next to the object code saying where to find the
+    Corresponding Source.  Regardless of what server hosts the
+    Corresponding Source, you remain obligated to ensure that it is
+    available for as long as needed to satisfy these requirements.
+
+    e) Convey the object code using peer-to-peer transmission, provided
+    you inform other peers where the object code and Corresponding
+    Source of the work are being offered to the general public at no
+    charge under subsection 6d.
+
+  A separable portion of the object code, whose source code is excluded
+from the Corresponding Source as a System Library, need not be
+included in conveying the object code work.
+
+  A "User Product" is either (1) a "consumer product", which means any
+tangible personal property which is normally used for personal, family,
+or household purposes, or (2) anything designed or sold for incorporation
+into a dwelling.  In determining whether a product is a consumer product,
+doubtful cases shall be resolved in favor of coverage.  For a particular
+product received by a particular user, "normally used" refers to a
+typical or common use of that class of product, regardless of the status
+of the particular user or of the way in which the particular user
+actually uses, or expects or is expected to use, the product.  A product
+is a consumer product regardless of whether the product has substantial
+commercial, industrial or non-consumer uses, unless such uses represent
+the only significant mode of use of the product.
+
+  "Installation Information" for a User Product means any methods,
+procedures, authorization keys, or other information required to install
+and execute modified versions of a covered work in that User Product from
+a modified version of its Corresponding Source.  The information must
+suffice to ensure that the continued functioning of the modified object
+code is in no case prevented or interfered with solely because
+modification has been made.
+
+  If you convey an object code work under this section in, or with, or
+specifically for use in, a User Product, and the conveying occurs as
+part of a transaction in which the right of possession and use of the
+User Product is transferred to the recipient in perpetuity or for a
+fixed term (regardless of how the transaction is characterized), the
+Corresponding Source conveyed under this section must be accompanied
+by the Installation Information.  But this requirement does not apply
+if neither you nor any third party retains the ability to install
+modified object code on the User Product (for example, the work has
+been installed in ROM).
+
+  The requirement to provide Installation Information does not include a
+requirement to continue to provide support service, warranty, or updates
+for a work that has been modified or installed by the recipient, or for
+the User Product in which it has been modified or installed.  Access to a
+network may be denied when the modification itself materially and
+adversely affects the operation of the network or violates the rules and
+protocols for communication across the network.
+
+  Corresponding Source conveyed, and Installation Information provided,
+in accord with this section must be in a format that is publicly
+documented (and with an implementation available to the public in
+source code form), and must require no special password or key for
+unpacking, reading or copying.
+
+  7. Additional Terms.
+
+  "Additional permissions" are terms that supplement the terms of this
+License by making exceptions from one or more of its conditions.
+Additional permissions that are applicable to the entire Program shall
+be treated as though they were included in this License, to the extent
+that they are valid under applicable law.  If additional permissions
+apply only to part of the Program, that part may be used separately
+under those permissions, but the entire Program remains governed by
+this License without regard to the additional permissions.
+
+  When you convey a copy of a covered work, you may at your option
+remove any additional permissions from that copy, or from any part of
+it.  (Additional permissions may be written to require their own
+removal in certain cases when you modify the work.)  You may place
+additional permissions on material, added by you to a covered work,
+for which you have or can give appropriate copyright permission.
+
+  Notwithstanding any other provision of this License, for material you
+add to a covered work, you may (if authorized by the copyright holders of
+that material) supplement the terms of this License with terms:
+
+    a) Disclaiming warranty or limiting liability differently from the
+    terms of sections 15 and 16 of this License; or
+
+    b) Requiring preservation of specified reasonable legal notices or
+    author attributions in that material or in the Appropriate Legal
+    Notices displayed by works containing it; or
+
+    c) Prohibiting misrepresentation of the origin of that material, or
+    requiring that modified versions of such material be marked in
+    reasonable ways as different from the original version; or
+
+    d) Limiting the use for publicity purposes of names of licensors or
+    authors of the material; or
+
+    e) Declining to grant rights under trademark law for use of some
+    trade names, trademarks, or service marks; or
+
+    f) Requiring indemnification of licensors and authors of that
+    material by anyone who conveys the material (or modified versions of
+    it) with contractual assumptions of liability to the recipient, for
+    any liability that these contractual assumptions directly impose on
+    those licensors and authors.
+
+  All other non-permissive additional terms are considered "further
+restrictions" within the meaning of section 10.  If the Program as you
+received it, or any part of it, contains a notice stating that it is
+governed by this License along with a term that is a further
+restriction, you may remove that term.  If a license document contains
+a further restriction but permits relicensing or conveying under this
+License, you may add to a covered work material governed by the terms
+of that license document, provided that the further restriction does
+not survive such relicensing or conveying.
+
+  If you add terms to a covered work in accord with this section, you
+must place, in the relevant source files, a statement of the
+additional terms that apply to those files, or a notice indicating
+where to find the applicable terms.
+
+  Additional terms, permissive or non-permissive, may be stated in the
+form of a separately written license, or stated as exceptions;
+the above requirements apply either way.
+
+  8. Termination.
+
+  You may not propagate or modify a covered work except as expressly
+provided under this License.  Any attempt otherwise to propagate or
+modify it is void, and will automatically terminate your rights under
+this License (including any patent licenses granted under the third
+paragraph of section 11).
+
+  However, if you cease all violation of this License, then your
+license from a particular copyright holder is reinstated (a)
+provisionally, unless and until the copyright holder explicitly and
+finally terminates your license, and (b) permanently, if the copyright
+holder fails to notify you of the violation by some reasonable means
+prior to 60 days after the cessation.
+
+  Moreover, your license from a particular copyright holder is
+reinstated permanently if the copyright holder notifies you of the
+violation by some reasonable means, this is the first time you have
+received notice of violation of this License (for any work) from that
+copyright holder, and you cure the violation prior to 30 days after
+your receipt of the notice.
+
+  Termination of your rights under this section does not terminate the
+licenses of parties who have received copies or rights from you under
+this License.  If your rights have been terminated and not permanently
+reinstated, you do not qualify to receive new licenses for the same
+material under section 10.
+
+  9. Acceptance Not Required for Having Copies.
+
+  You are not required to accept this License in order to receive or
+run a copy of the Program.  Ancillary propagation of a covered work
+occurring solely as a consequence of using peer-to-peer transmission
+to receive a copy likewise does not require acceptance.  However,
+nothing other than this License grants you permission to propagate or
+modify any covered work.  These actions infringe copyright if you do
+not accept this License.  Therefore, by modifying or propagating a
+covered work, you indicate your acceptance of this License to do so.
+
+  10. Automatic Licensing of Downstream Recipients.
+
+  Each time you convey a covered work, the recipient automatically
+receives a license from the original licensors, to run, modify and
+propagate that work, subject to this License.  You are not responsible
+for enforcing compliance by third parties with this License.
+
+  An "entity transaction" is a transaction transferring control of an
+organization, or substantially all assets of one, or subdividing an
+organization, or merging organizations.  If propagation of a covered
+work results from an entity transaction, each party to that
+transaction who receives a copy of the work also receives whatever
+licenses to the work the party's predecessor in interest had or could
+give under the previous paragraph, plus a right to possession of the
+Corresponding Source of the work from the predecessor in interest, if
+the predecessor has it or can get it with reasonable efforts.
+
+  You may not impose any further restrictions on the exercise of the
+rights granted or affirmed under this License.  For example, you may
+not impose a license fee, royalty, or other charge for exercise of
+rights granted under this License, and you may not initiate litigation
+(including a cross-claim or counterclaim in a lawsuit) alleging that
+any patent claim is infringed by making, using, selling, offering for
+sale, or importing the Program or any portion of it.
+
+  11. Patents.
+
+  A "contributor" is a copyright holder who authorizes use under this
+License of the Program or a work on which the Program is based.  The
+work thus licensed is called the contributor's "contributor version".
+
+  A contributor's "essential patent claims" are all patent claims
+owned or controlled by the contributor, whether already acquired or
+hereafter acquired, that would be infringed by some manner, permitted
+by this License, of making, using, or selling its contributor version,
+but do not include claims that would be infringed only as a
+consequence of further modification of the contributor version.  For
+purposes of this definition, "control" includes the right to grant
+patent sublicenses in a manner consistent with the requirements of
+this License.
+
+  Each contributor grants you a non-exclusive, worldwide, royalty-free
+patent license under the contributor's essential patent claims, to
+make, use, sell, offer for sale, import and otherwise run, modify and
+propagate the contents of its contributor version.
+
+  In the following three paragraphs, a "patent license" is any express
+agreement or commitment, however denominated, not to enforce a patent
+(such as an express permission to practice a patent or covenant not to
+sue for patent infringement).  To "grant" such a patent license to a
+party means to make such an agreement or commitment not to enforce a
+patent against the party.
+
+  If you convey a covered work, knowingly relying on a patent license,
+and the Corresponding Source of the work is not available for anyone
+to copy, free of charge and under the terms of this License, through a
+publicly available network server or other readily accessible means,
+then you must either (1) cause the Corresponding Source to be so
+available, or (2) arrange to deprive yourself of the benefit of the
+patent license for this particular work, or (3) arrange, in a manner
+consistent with the requirements of this License, to extend the patent
+license to downstream recipients.  "Knowingly relying" means you have
+actual knowledge that, but for the patent license, your conveying the
+covered work in a country, or your recipient's use of the covered work
+in a country, would infringe one or more identifiable patents in that
+country that you have reason to believe are valid.
+
+  If, pursuant to or in connection with a single transaction or
+arrangement, you convey, or propagate by procuring conveyance of, a
+covered work, and grant a patent license to some of the parties
+receiving the covered work authorizing them to use, propagate, modify
+or convey a specific copy of the covered work, then the patent license
+you grant is automatically extended to all recipients of the covered
+work and works based on it.
+
+  A patent license is "discriminatory" if it does not include within
+the scope of its coverage, prohibits the exercise of, or is
+conditioned on the non-exercise of one or more of the rights that are
+specifically granted under this License.  You may not convey a covered
+work if you are a party to an arrangement with a third party that is
+in the business of distributing software, under which you make payment
+to the third party based on the extent of your activity of conveying
+the work, and under which the third party grants, to any of the
+parties who would receive the covered work from you, a discriminatory
+patent license (a) in connection with copies of the covered work
+conveyed by you (or copies made from those copies), or (b) primarily
+for and in connection with specific products or compilations that
+contain the covered work, unless you entered into that arrangement,
+or that patent license was granted, prior to 28 March 2007.
+
+  Nothing in this License shall be construed as excluding or limiting
+any implied license or other defenses to infringement that may
+otherwise be available to you under applicable patent law.
+
+  12. No Surrender of Others' Freedom.
+
+  If conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License.  If you cannot convey a
+covered work so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you may
+not convey it at all.  For example, if you agree to terms that obligate you
+to collect a royalty for further conveying from those to whom you convey
+the Program, the only way you could satisfy both those terms and this
+License would be to refrain entirely from conveying the Program.
+
+  13. Remote Network Interaction; Use with the GNU General Public License.
+
+  Notwithstanding any other provision of this License, if you modify the
+Program, your modified version must prominently offer all users
+interacting with it remotely through a computer network (if your version
+supports such interaction) an opportunity to receive the Corresponding
+Source of your version by providing access to the Corresponding Source
+from a network server at no charge, through some standard or customary
+means of facilitating copying of software.  This Corresponding Source
+shall include the Corresponding Source for any work covered by version 3
+of the GNU General Public License that is incorporated pursuant to the
+following paragraph.
+
+  Notwithstanding any other provision of this License, you have
+permission to link or combine any covered work with a work licensed
+under version 3 of the GNU General Public License into a single
+combined work, and to convey the resulting work.  The terms of this
+License will continue to apply to the part which is the covered work,
+but the work with which it is combined will remain governed by version
+3 of the GNU General Public License.
+
+  14. Revised Versions of this License.
+
+  The Free Software Foundation may publish revised and/or new versions of
+the GNU Affero General Public License from time to time.  Such new versions
+will be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+  Each version is given a distinguishing version number.  If the
+Program specifies that a certain numbered version of the GNU Affero General
+Public License "or any later version" applies to it, you have the
+option of following the terms and conditions either of that numbered
+version or of any later version published by the Free Software
+Foundation.  If the Program does not specify a version number of the
+GNU Affero General Public License, you may choose any version ever published
+by the Free Software Foundation.
+
+  If the Program specifies that a proxy can decide which future
+versions of the GNU Affero General Public License can be used, that proxy's
+public statement of acceptance of a version permanently authorizes you
+to choose that version for the Program.
+
+  Later license versions may give you additional or different
+permissions.  However, no additional obligations are imposed on any
+author or copyright holder as a result of your choosing to follow a
+later version.
+
+  15. Disclaimer of Warranty.
+
+  THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
+APPLICABLE LAW.  EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
+HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
+OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
+THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+PURPOSE.  THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
+IS WITH YOU.  SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
+ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
+
+  16. Limitation of Liability.
+
+  IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
+THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
+GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
+USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
+DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
+PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
+EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
+SUCH DAMAGES.
+
+  17. Interpretation of Sections 15 and 16.
+
+  If the disclaimer of warranty and limitation of liability provided
+above cannot be given local legal effect according to their terms,
+reviewing courts shall apply local law that most closely approximates
+an absolute waiver of all civil liability in connection with the
+Program, unless a warranty or assumption of liability accompanies a
+copy of the Program in return for a fee.
+
+                     END OF TERMS AND CONDITIONS
+
+            How to Apply These Terms to Your New Programs
+
+  If you develop a new program, and you want it to be of the greatest
+possible use to the public, the best way to achieve this is to make it
+free software which everyone can redistribute and change under these terms.
+
+  To do so, attach the following notices to the program.  It is safest
+to attach them to the start of each source file to most effectively
+state the exclusion of warranty; and each file should have at least
+the "copyright" line and a pointer to where the full notice is found.
+
+    <one line to give the program's name and a brief idea of what it does.>
+    Copyright (C) <year>  <name of author>
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU Affero General Public License as published
+    by the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU Affero General Public License for more details.
+
+    You should have received a copy of the GNU Affero General Public License
+    along with this program.  If not, see <https://www.gnu.org/licenses/>.
+
+Also add information on how to contact you by electronic and paper mail.
+
+  If your software can interact with users remotely through a computer
+network, you should also make sure that it provides a way for users to
+get its source.  For example, if your program is a web application, its
+interface could display a "Source" link that leads users to an archive
+of the code.  There are many ways you could offer source, and different
+solutions will be better for different programs; see section 13 for the
+specific requirements.
+
+  You should also get your employer (if you work as a programmer) or school,
+if any, to sign a "copyright disclaimer" for the program, if necessary.
+For more information on this, and how to apply and follow the GNU AGPL, see
+<https://www.gnu.org/licenses/>.

README.md

@@ -0,0 +1,5 @@
+# Main Page Repository
+
+Release URL: [www.neshweb.net](https://www.neshweb.net)
+
+Development URL: [wip.neshweb.net](https://wip.neshweb.net)

components.json

@@ -0,0 +1,13 @@
+{
+  "$schema": "https://shadcn-svelte.com/schema.json",
+  "style": "new-york",
+  "tailwind": {
+    "config": "tailwind.config.js",
+    "css": "src/app.pcss",
+    "baseColor": "slate"
+  },
+  "aliases": {
+    "components": "$lib/components",
+    "utils": "$lib/utils"
+  }
+}

components/footer.tsx

@@ -1,11 +0,0 @@
-import styles from '/styles/Home.module.css'
-
-const Footer = () => {
-    return ( 
-        <footer className={styles.footer}>
-            Built using Next.js
-        </footer>
-     );
-}
- 
-export default Footer;

components/layout.tsx

@@ -1,37 +0,0 @@
-import Footer from './footer'
-import Navbar from './navbar'
-import styles from '/styles/Home.module.css'
-import Script from 'next/script'
-
-const Layout = ({ children }: { children: React.ReactNode }) => {
-  return (
-    <div className={styles.page}>
-      <Script id="matomo_analytics"> 
-      {`
-        var _paq = window._paq = window._paq || [];
-        /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-        _paq.push(["setDocumentTitle", document.domain + "/" + document.title]);
-        _paq.push(["setCookieDomain", "www.neshura-server.net"]);
-        _paq.push(["disableCookies"]);
-        _paq.push(['trackPageView']);
-        _paq.push(['enableLinkTracking']);
-        (function() {
-          var u="//tracking.neshura-server.net/";
-          _paq.push(['setTrackerUrl', u+'matomo.php']);
-          _paq.push(['setSiteId', '2']);
-          var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-          g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
-        })();
-      `}
-      </Script>
-      
-      <Navbar />
-      <main className={styles.main}>
-        {children}
-      </main>
-      <Footer />
-    </div>
-  );
-}
-
-export default Layout;

components/navbar.tsx

@@ -1,30 +0,0 @@
-import styles from '/styles/Home.module.css'
-import Link from 'next/link'
-import { useRouter } from 'next/router'
-
-const navLinks = [
-  { name: "Home", href: "/" },
-  { name: "About", href: "/about" },
-  { name: "Games", href: "/games" },
-  { name: "Services", href: "/services" }
-]
-
-const Navbar = () => {
-  const router = useRouter();
-
-  return (
-    <nav className={styles.navbar}>
-      {navLinks.map((item, index) => (
-        <Link key={item.name} href={item.href}>
-          <a className={router.pathname == item.href ? styles.navelem_active : styles.navelem}>{item.name}</a>
-        </Link>
-      ))}
-      <Link key="Mastodon_Verify" href="https://mastodon.neshura-server.net/@neshura">
-        <a className={styles.navelem} rel="me" href="https://mastodon.neshura-server.net/@neshura">Mastodon</a>
-      </Link>
-      
-    </nav>
-  );
-}
-
-export default Navbar;

interfaces/LinkTypes.ts

@@ -1,42 +0,0 @@
-export interface EntryList {
-  services: Service[],
-  games: CustomLink[]
-}
-export interface CustomLink {
-  name: string,
-  href: string,
-  desc: string,
-  ip: string,
-  type: string,
-  location: string,
-  status: string,
-  docker_container_name: string
-}
-
-export interface Service {
-  name: string,
-  href: string,
-  desc: string,
-  warn: string,
-  type: ServiceType,
-  docker_container_name: string,
-  location: ServiceLocation,
-  status: ServiceStatus
-}
-
-export enum ServiceStatus {
-  online = "Online",
-  offline = "Offline",
-  loading = "Loading",
-  error = "ERROR"
-}
-
-export enum ServiceLocation {
-  brr7_4800u = "brr7-4800u",
-  other = ""
-}
-
-export enum ServiceType {
-  docker = "docker",
-  app = "app"
-}

next.config.js

@@ -1,12 +0,0 @@
-/** @type {import('next').NextConfig} */
-
-const nextConfig = {
-  i18n: {
-    locales: ["en"],
-    defaultLocale: "en",
-  },
-  reactStrictMode: true,
-  output: 'standalone',
-};
-
-module.exports = nextConfig

package.json

@@ -1,26 +1,52 @@
 {
-  "name": "www",
+	"name": "main-site",
-  "version": "0.2.0",
+	"author": "Neshura",
-  "private": true,
+	"license": "AGPL-3.0-or-later",
-  "scripts": {
+	"version": "1.0.9",
-    "dev:debug": "NODE_OPTIONS='--inspect' next dev -p 4040",
+	"private": true,
-    "dev": "next dev -p 4040",
+	"scripts": {
-    "build": "next build",
+		"dev": "vite dev",
-    "start": "next start",
+		"build": "vite build",
-    "lint": "next lint"
+		"preview": "vite preview",
-  },
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
-  "dependencies": {
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
-    "dockerode": "^3.3.4",
+		"lint": "prettier --check src",
-    "next": "^12.3.0",
+		"lint-full": "prettier --check src && eslint src",
-    "react": "18.2.0",
+		"format": "prettier --write src",
-    "react-dom": "18.2.0",
+		"ui": "npx shadcn-svelte@latest"
-    "swr": "^1.3.0"
+	},
-  },
+	"devDependencies": {
-  "devDependencies": {
+		"@sveltejs/adapter-auto": "^6.0.0",
-    "@types/dockerode": "^3.3.14",
+		"@sveltejs/kit": "^2.0.0",
-    "@types/react": "^18.0.14",
+		"@sveltejs/vite-plugin-svelte": "^5.0.3",
-    "eslint": "^8.23.1",
+		"@types/eslint": "9.6.1",
-    "eslint-config-next": "12.2.0",
+		"@types/sanitize-html": "^2.15.0",
-    "typescript": "^4.7.4"
+		"@typescript-eslint/eslint-plugin": "^6.0.0",
-  }
+		"@typescript-eslint/parser": "^6.0.0",
+		"autoprefixer": "^10.4.16",
+		"eslint": "^8.56.0",
+		"eslint-config-prettier": "^9.1.0",
+		"eslint-plugin-svelte": "^2.35.1",
+		"postcss": "^8.4.32",
+		"postcss-load-config": "^5.0.2",
+		"prettier": "^3.1.1",
+		"prettier-plugin-svelte": "^3.1.2",
+		"prettier-plugin-tailwindcss": "^0.5.9",
+		"svelte": "^5.0.0",
+		"svelte-check": "^3.6.0",
+		"tailwindcss": "^3.3.6",
+		"tslib": "^2.4.1",
+		"typescript": "^5.0.0",
+		"vite": "^6.2.5"
+	},
+	"type": "module",
+	"dependencies": {
+		"bits-ui": "1.3.16",
+		"clsx": "^2.1.0",
+		"radix-icons-svelte": "^1.2.1",
+		"sanitize-html": "^2.11.0",
+		"socket.io-client": "^4.7.2",
+		"tailwind-merge": "^2.2.0",
+		"tailwind-variants": "^0.1.19"
+	}
 }

pages/_app.tsx

@@ -1,22 +0,0 @@
-import '/styles/globals.css'
-import type { ReactElement, ReactNode } from 'react'
-import Layout from '../components/layout'
-import type { NextPage } from 'next'
-import { AppProps } from 'next/app';
-
-
-export type NextPageWithLayout<P = {}, IP = P> = NextPage<P, IP> & {
-  getLayout?: (page: ReactElement) => ReactNode
-}
-
-export type AppPropsWithLayout = AppProps & {
-  Component: NextPageWithLayout
-}
-
-export default function Website({ Component, pageProps }: AppPropsWithLayout) {
-  // Use the layout defined at the page level, if available
-  const getLayout = Component.getLayout ?? ((page) => (
-    <Layout>{page}</Layout>))
-
-  return getLayout(<Component {...pageProps} />)
-}

pages/about.tsx

@@ -1,20 +0,0 @@
-import Head from 'next/head'
-import styles from '/styles/Home.module.css'
-
-export default function About() {
-  return (
-    <>
-      <Head>
-        <title>Neshura Servers</title>
-        <meta charSet='utf-8' />
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
-      <h1 className={styles.title}>
-        About
-      </h1>
-      <p className={styles.description}>
-        This website is primarily for managing my game servers in one spot
-      </p>
-    </>
-  )
-}

pages/api/containers.tsx

@@ -1,18 +0,0 @@
-import Docker from 'dockerode'
-
-export default async function ContainersAPI(req: any, res: any) {
-  try {
-    const options = {
-      socketPath: '/var/run/docker.sock',
-      path: '/v1.41/containers/json'
-    };
-    var docker = new Docker({ socketPath: options.socketPath });
-    const list = await docker.listContainers({ all: true })
-
-    res.status(200).json(list);
-  }
-  catch (error) {
-    console.log(error);
-    res.status(500).json({ error: 'Error reading data' });
-  }
-}

pages/api/services.tsx

@@ -1,21 +0,0 @@
-import fsPromises from 'fs/promises'
-import path from 'path'
-import { Service, ServiceStatus } from '../../interfaces/LinkTypes';
-
-export default async function ServicesAPI(req: any, res: any) {
-  try {
-    const filePath = path.join(process.cwd(), '/public/pages.json')
-    const data = await fsPromises.readFile(filePath)
-      .then((file) => JSON.parse(file.toString()));
-    data.services.forEach((service: Service) => {
-        service.status = ServiceStatus.loading;
-      });
-
-    res.status(200).json(data.services);
-  }
-  catch (error) {
-    console.log(error);
-    res.status(500).json({ error: 'Error reading data' });
-  }
-}
-

pages/games.tsx

@@ -1,65 +0,0 @@
-import Head from 'next/head'
-import Link from 'next/link'
-import styles from '/styles/Home.module.css'
-import fsPromises from 'fs/promises'
-import path from 'path'
-import type { CustomLink, EntryList } from '../interfaces/LinkTypes'
-
-function Servers(props: EntryList) {
-  const serverList = props.games
-  return (
-    <>
-      <Head>
-        <title>Neshura Servers</title>
-        <meta charSet='utf-8' />
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
-
-      <h1 className={styles.title}>
-        Server List
-      </h1>
-
-      <p className={styles.description}>
-        Lists all available Services, probably up-to-date
-      </p>
-      <div className={styles.grid}>
-        {Object.values(serverList).map((item: CustomLink) => {
-          if (item.href != null) {
-            return (
-              <Link key={item.name} href={item.href}>
-                <a className={styles.contentcard}>
-                  <div className={styles.contenttitle}><h2>{item.name }</h2></div>
-                  <div><p>{item.desc}</p></div> 
-                  <div><p>{item.ip }</p></div> 
-                  <div className={item.status == "Online" ? styles.contentonline : styles.contentoffline}><p>{item.status}</p></div> 
-                </a>
-              </Link>
-            )
-          }
-          else {
-            return (
-              <a key={item.name} className={styles.contentcardstatic}>
-                <div className={styles.contenttitle}><h2>{item.name }</h2></div>
-                <div><p>{item.desc}</p></div> 
-                <div><p>{item.ip}</p></div> 
-                <div className={item.status == "Online" ? styles.contentonline : styles.contentoffline}><p>{item.status}</p></div> 
-              </a>
-            )
-          }
-        }
-
-        )}
-      </div>
-    </>
-  )
-}
-
-export async function getServerSideProps() {
-  const filePath = path.join(process.cwd(), '/public/pages.json')
-  const jsonData = await fsPromises.readFile(filePath)
-  const list = JSON.parse(jsonData.toString())
-
-  return { props: list }
-}
-
-export default Servers

pages/index.tsx

@@ -1,46 +0,0 @@
-import Head from 'next/head'
-import Link from 'next/link'
-import styles from '/styles/Home.module.css'
-
-export default function Home() {
-  return (
-    <>
-      <Head>
-        <title>Neshura Servers</title>
-        <meta charSet='utf-8' />
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
-
-      <h1 className={styles.title}>
-        Welcome to my Servers Webpage
-      </h1>
-
-      <p className={styles.description}>
-        Feel free to look around
-      </p>
-      <div className={styles.grid}>
-        <Link key="about" href="/about">
-          <a className={styles.card}>
-            <h2>About &rarr;</h2>
-            <p>Useless Info, don&apos;t bother</p>
-          </a>
-        </Link>
-
-        <Link key="servers" href="/games">
-          <a className={styles.card}>
-            <h2>Games &rarr;</h2>
-            <p>List of all available Servers</p>
-          </a>
-        </Link>
-
-        <Link key="services" href="/services">
-          <a className={styles.card}>
-            <h2>Services &rarr;</h2>
-            <p>List of available Services</p>
-          </a>
-        </Link>
-
-      </div>
-    </>
-  )
-}

pages/services.tsx

@@ -1,205 +0,0 @@
-import Head from 'next/head'
-import Link from 'next/link'
-import styles from '/styles/Home.module.css'
-import { Service, ServiceStatus, ServiceType, ServiceLocation } from '../interfaces/LinkTypes';
-import Dockerode from 'dockerode';
-import { ReactElement } from 'react'
-import useSWR from 'swr';
-
-const fetcher = (url: string) => fetch(url).then((res) => res.json())
-
-//function Services(props: EntryList) {
-function Services() {
-  const { initialData, fullData, loadingInitial, loadingFull, error } = useServices();
-
-
-  let content: ReactElement = <></>;
-
-  if (error) { content = <div>Error loading data</div> }
-  else if (loadingInitial) {
-    content = <div>Loading</div>
-  }
-  else if (loadingFull) {
-    content =
-      <div className={styles.grid}>
-        {initialData?.map((item: Service) => (
-          <Link key={item.name} href={item.href}>
-            <a className={styles.contentcard}>
-              <div className={styles.contenttitle}><h2>{item.name}</h2></div>
-              <div className={item.status === ServiceStatus.online ? styles.contentonline : styles.contentoffline}>{item.status}</div>
-              <div><p>{item.desc}</p></div>
-              <div className={styles.cardwarn}><p>{item.warn}</p></div>
-            </a>
-          </Link>
-        ))}
-      </div>
-  }
-  else if (fullData) {
-    content =
-      <div className={styles.grid}>
-        {fullData.map((item: Service) => (
-          <Link key={item.name} href={item.href}>
-            <a className={styles.contentcard}>
-              <div className={styles.contenttitle}><h2>{item.name}</h2></div>
-              <div className={item.status === ServiceStatus.online ? styles.contentonline : styles.contentoffline}>{item.status}</div>
-              <div><p>{item.desc}</p></div>
-              <div className={styles.cardwarn}><p>{item.warn}</p></div>
-            </a>
-          </Link>
-        ))}
-      </div>
-  }
-  else {
-    content = <div>Error loading data</div>
-  }
-
-  return (
-    <>
-      <Head>
-        <title>Neshura Servers</title>
-        <meta charSet='utf-8' />
-        <link rel="icon" href="/favicon.ico" />
-        <meta name="description" content="Lists all available Services, most likely up-to-date" />
-      </Head>
-
-      <h1 className={styles.title}>
-        Service List
-      </h1>
-
-      <p className={styles.description}>
-        Lists all available Services, most likely up-to-date
-      </p>
-
-      {content}
-    </>
-  )
-}
-
-async function getStatus(entry: Service, containers: Dockerode.ContainerInfo[]) {
-  // Currently the only location supporting different fetching depending on type is brr7-4800u
-  // Others to follow but low prio as this is currently the only location used
-
-  // Location BRR7-4800U
-  if (entry.location === ServiceLocation.brr7_4800u) {
-    // Type APP
-    if (entry.type === ServiceType.app) {
-      await fetch(entry.href)
-        .then((response) => {
-          if (response.ok) {
-            switch (response.status) {
-              case 200:
-              case 301:
-              case 302:
-                entry.status = ServiceStatus.online;
-                break;
-              default:
-                entry.status = ServiceStatus.offline;
-            }
-          }
-          else {
-            entry.status = ServiceStatus.offline;
-          }
-        })
-        .catch((error) => {
-          console.error("Error pinging Website: ", error);
-          entry.status = ServiceStatus.error;
-        })
-    }
-    // Type Docker
-    else if (entry.type === ServiceType.docker) {
-      if (entry.name !== null) {
-        let found = false;
-        for (let i = 0; i < containers.length; i++) {
-          const container = containers[i];
-          // Docker API returns container names with / prepended
-          if (containers[i].Names.includes("/" + entry.docker_container_name)) {
-            // so far only "running" is properly implemented, mroe cases to follow as needed
-            switch (container.State) {
-              case "running":
-                entry.status = ServiceStatus.online;
-                break;
-              default:
-                console.log("Container Status " + container.State + " has no case implemented");
-                entry.status = ServiceStatus.offline;
-            }
-            found = true;
-            // cancel the for
-            break;
-          }
-          // If container name is not missing the container is set to offline
-          else {
-            entry.status = ServiceStatus.offline;
-          }
-        }
-        if (!found) {
-          console.warn("Container for " + entry.name + " could not be found");
-        }
-      }
-      // if name is null do not enter for loop
-      else {
-        console.error("Container Name not specified");
-        entry.status = ServiceStatus.error;
-      }
-    }
-    // If no Type matches
-    else {
-      console.warn("Service Type for Service " + entry.name + " not specified or invalid");
-      entry.status = ServiceStatus.error;
-    }
-  }
-  // Location Other
-  // TODO: implement docker type for other locations
-  else if (entry.location === ServiceLocation.other) {
-    // Currently uses the same handling as app type for the other location
-    await fetch(entry.href)
-      .then((response) => {
-        if (response.ok) {
-          switch (response.status) {
-            case 200:
-            case 301:
-            case 302:
-              entry.status = ServiceStatus.online;
-              break;
-            default:
-              entry.status = ServiceStatus.offline;
-          }
-        }
-        else {
-          entry.status = ServiceStatus.offline;
-        }
-      })
-      .catch((error) => {
-        console.error("Error pinging Website: ", error);
-        entry.status = ServiceStatus.error;
-      })
-  }
-  // If no Location matches
-  else {
-    console.warn("Service Location for Service " + entry.name + " not specified");
-    entry.status = ServiceStatus.error;
-  }
-  return entry;
-}
-
-const fetchFullDataArray = (containerData: Dockerode.ContainerInfo[], dataSet: Service[]) => {
-  const fetchStatus = (entry: Service) => getStatus(entry, containerData);
-  return Promise.all(dataSet.map(fetchStatus));
-}
-
-function useServices() {
-  const { data: containerData, error: containerError } = useSWR('/api/containers', fetcher);
-  const { data: initialData, error: initialError } = useSWR('/api/services', fetcher);
-  const loadingInitial = !initialData && !initialError
-  const { data: fullData, error: fullError } = useSWR((initialData && containerData) ? [containerData, initialData] : null, fetchFullDataArray)
-  const loadingFull = !fullData && !fullError
-
-  return {
-    initialData,
-    fullData,
-    loadingInitial,
-    loadingFull,
-    error: initialError || fullError || containerError,
-  };
-}
-
-export default Services

postcss.config.cjs

@@ -0,0 +1,13 @@
+const tailwindcss = require('tailwindcss');
+const autoprefixer = require('autoprefixer');
+
+const config = {
+	plugins: [
+		//Some plugins, like tailwindcss/nesting, need to run before Tailwind,
+		tailwindcss(),
+		//But others, like autoprefixer, need to run after,
+		autoprefixer
+	]
+};
+
+module.exports = config;

public/data/navbar.json

@@ -0,0 +1,20 @@
+{
+    "links": [
+        {
+            "name": "Home",
+            "href": "/"
+        },
+        {
+            "name": "About",
+            "href": "/about"
+        },
+        {
+            "name": "Servers",
+            "href": "/servers"
+        },
+        {
+            "name": "Services",
+            "href": "/services"
+        }
+    ]
+}

public/data/themes.json

@@ -0,0 +1,84 @@
+{
+  "themes": [
+    {
+      "themeName": "Cancer - Blue",
+      "themeId": 0,
+      "colors": {
+        "background": "#ffffff",
+        "primary": "#00AAFF",
+        "secondary": "#FF5500",
+        "online": "#2BFF00",
+        "loading": "#D400FF",
+        "offline": "#FF002B"
+      }
+    },
+    {
+      "themeName": "Dark - Blue",
+      "themeId": 1,
+      "colors": {
+        "background": "#161616",
+        "backgroundAlt": "#000000",
+        "primary": "#00AAFF",
+        "secondary": "#FF5500",
+        "online": "#2BFF00",
+        "loading": "#D400FF",
+        "offline": "#FF002B"
+      }
+    },
+    {
+      "themeName": "AMOLED - Blue",
+      "themeId": 2,
+      "colors": {
+        "background": "#000000",
+        "backgroundAlt": "#161616",
+        "primary": "#00AAFF",
+        "secondary": "#FF5500",
+        "online": "#2BFF00",
+        "loading": "#D400FF",
+        "offline": "#FF002B"
+      }
+    },
+    {
+      "themeName": "AMOLED - Purple",
+      "themeId": 3,
+      "colors": {
+        "background": "#000000",
+        "backgroundAlt": "#161616",
+        "primary": "#886aff",
+        "secondary": "#E1FF6A",
+        "online": "#00ff00",
+        "loading": "#FF6A97",
+        "offline": "#ff0000"
+      }
+    },
+    {
+      "themeName": "Nordlys",
+      "themeId": 4,
+      "backgroundImage": "https://images4.alphacoders.com/112/1123390.jpg",
+      "backgroundOffset": "60%",
+      "colors": {
+        "background": "#0008",
+        "primary": "#ccc",
+        "secondary": "#00C7C7",
+        "online": "#00ff00",
+        "loading": "#0063C7",
+        "offline": "#ff0000"
+      }
+    },
+    {
+      "themeName": "dev",
+      "themeId": 5,
+      "backgroundImage": "https://images4.alphacoders.com/112/1123390.jpg",
+      "colors": {
+        "background": "#0000",
+        "backgroundAlt": "#0000",
+        "primary": "#ccc",
+        "secondary": "#00C7C7",
+        "text": "#000",
+        "online": "#00ff00",
+        "loading": "#0063C7",
+        "offline": "#ff0000"
+      }
+    }
+  ]
+}

public/pages.json

@@ -1,155 +0,0 @@
-{
-  "services": [
-    {
-      "name": "Nextcloud",
-      "href": "https://nextcloud.neshura-server.net",
-      "desc": "Self-hosted Cloud Storage Service",
-      "warn": "Note: Registration requires approval",
-      "type": "docker",
-      "docker_container_name": "nextcloud",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Komga",
-      "href": "https://komga.neshura-server.net",
-      "desc": "Self-hosted Comic Library",
-      "warn": "Note: Registration only via Admin",
-      "type": "docker",
-      "docker_container_name": "komga",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Calibre Web",
-      "href": "https://calibre.neshura-server.net/",
-      "desc": "Self-hosted Ebook Library Service",
-      "warn": "Note: Registration only via Admin",
-      "type": "app",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "PeerTube",
-      "href": "https://tube.neshura-server.net",
-      "desc": "Self-hosted PeerTube Instance",
-      "warn": "Note: Registration only via Admin",
-      "type": "docker",
-      "docker_container_name": "peertube",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Mastodon",
-      "href": "https://mastodon.neshura-server.net",
-      "desc": "Self-hosted Mastodon Instance",
-      "warn": "Note: Registration requires approval",
-      "type": "docker",
-      "docker_container_name": "mastodon-web",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "File Browser",
-      "href": "https://files.neshura-server.net/",
-      "desc": "Server File Browser",
-      "warn": "Note: Registration only via Admin",
-      "type": "docker",
-      "docker_container_name": "filebrowser",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Matrix",
-      "href": "https://matrix.neshura-server.net/",
-      "desc": "Open-Source, Decentralized Chat Protocol",
-      "warn": "Note: Registration only via Admin",
-      "type": "docker",
-      "docker_container_name": "synapse",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Element",
-      "href": "https://element.neshura-server.net/",
-      "desc": "Matrix Chat Client",
-      "warn": "Note: Registration requires token",
-      "type": "docker",
-      "docker_container_name": "element",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Jellyfin",
-      "href": "https://jellyfin.neshura-server.net/",
-      "desc": "Open-Source, Self-Hosted Media Platform",
-      "warn": "Note: Registration only via Admin",
-      "type": "docker",
-      "docker_container_name": "jellyfin",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Navidrome",
-      "href": "https://navidrome.neshura-server.net/",
-      "desc": "Open-Source, Self-Hosted Music Streaming Platform",
-      "warn": "Note: Registration only via Admin",
-      "type": "docker",
-      "docker_container_name": "navidrome",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Picard",
-      "href": "https://picard.neshura-server.net/",
-      "desc": "MP3 Tagger",
-      "warn": "Note: Access only via Admin",
-      "type": "docker",
-      "docker_container_name": "picard",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Gitlab",
-      "href": "https://gitlab.neshura-server.net/",
-      "desc": "Self-hosted Git Service",
-      "warn": "Note: Registration only via Admin",
-      "type": "docker",
-      "docker_container_name": "gitlab",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Portainer",
-      "href": "https://portainer.neshura-server.net/",
-      "desc": "Docker Container Manager",
-      "warn": "Note: Admin Only",
-      "type": "docker",
-      "docker_container_name": "portainer",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Nginx Proxy Manager",
-      "href": "https://nginx.neshura-server.net/",
-      "desc": "Web-based Nginx Proxy Manager",
-      "warn": "Note: Admin Only",
-      "type": "docker",
-      "docker_container_name": "nginx-prox",
-      "location": "brr7-4800u"
-    },
-    {
-      "name": "Grafana",
-      "href": "https://monitoring.neshura-server.net/",
-      "desc": "Server Monitoring Utility",
-      "warn": "Note: Admin Only",
-      "type": "docker",
-      "docker_container_name": "grafana",
-      "location": "brr7-4800u"
-    }
-  ],
-  "games": {
-    "minecraft": {
-      "name": "Minecraft",
-      "href": "https://minecraft.neshura-server.net/",
-      "desc": "View all currently available Minecraft Servers and their mods"
-    },
-    "ready_or_not": {
-      "name": "Ready or Not",
-      "href": "https://readyornot.neshura-server.net/",
-      "desc": "Collection of Floor Plans for the Game 'Ready or Not'"
-    },
-    "zomboid": {
-      "name": "Zomboid",
-      "ip": "91.13.248.30",
-      "status": "Online"
-    }
-  }
-}

src/app.d.ts

@@ -0,0 +1,13 @@
+// See https://kit.svelte.dev/docs/types#app
+// for information about these interfaces
+declare global {
+	namespace App {
+		// interface Error {}
+		// interface Locals {}
+		// interface PageData {}
+		// interface PageState {}
+		// interface Platform {}
+	}
+}
+
+export {};

src/app.html

@@ -0,0 +1,16 @@
+<!doctype html>
+<html lang="en" class="nordlys h-full">
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" href="%sveltekit.assets%/favicon.ico" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		%sveltekit.head%
+	</head>
+	<body
+		data-sveltekit-preload-data="hover"
+		style="background-image: url('/assets/background.avif')"
+		class="h-screen overflow-hidden"
+	>
+		<div style="display: contents">%sveltekit.body%</div>
+	</body>
+</html>

src/app.pcss

@@ -0,0 +1,115 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+	:root {
+		--background: 0 0% 100%;
+		--foreground: 222.2 84% 4.9%;
+
+		--muted: 210 40% 96.1%;
+		--muted-foreground: 215.4 16.3% 46.9%;
+
+		--popover: 0 0% 100%;
+		--popover-foreground: 222.2 84% 4.9%;
+
+		--card: 0 0% 100%;
+		--card-foreground: 222.2 84% 4.9%;
+
+		--border: 214.3 31.8% 91.4%;
+		--input: 214.3 31.8% 91.4%;
+
+		--primary: 222.2 47.4% 11.2%;
+		--primary-foreground: 210 40% 98%;
+
+		--secondary: 210 40% 96.1%;
+		--secondary-foreground: 222.2 47.4% 11.2%;
+
+		--accent: 210 40% 96.1%;
+		--accent-foreground: 222.2 47.4% 11.2%;
+
+		--destructive: 0 72.2% 50.6%;
+		--destructive-foreground: 210 40% 98%;
+
+		--ring: 222.2 84% 4.9%;
+
+		--radius: 0.5rem;
+	}
+
+	.dark {
+		--background: 222.2 84% 4.9%;
+		--foreground: 210 40% 98%;
+
+		--muted: 217.2 32.6% 17.5%;
+		--muted-foreground: 215 20.2% 65.1%;
+
+		--popover: 222.2 84% 4.9%;
+		--popover-foreground: 210 40% 98%;
+
+		--card: 222.2 84% 4.9%;
+		--card-foreground: 210 40% 98%;
+
+		--border: 217.2 32.6% 17.5%;
+		--input: 217.2 32.6% 17.5%;
+
+		--primary: 210 40% 98%;
+		--primary-foreground: 222.2 47.4% 11.2%;
+
+		--secondary: 217.2 32.6% 17.5%;
+		--secondary-foreground: 210 40% 98%;
+
+		--accent: 217.2 32.6% 17.5%;
+		--accent-foreground: 210 40% 98%;
+
+		--destructive: 0 62.8% 30.6%;
+		--destructive-foreground: 210 40% 98%;
+
+		--ring: hsl(212.7, 26.8%, 83.9);
+	}
+
+	.nordlys {
+		--background: 0 0% 0%; /* #000000 */
+		--foreground: 183 100% 96%; /* #14b8a6 */
+
+		--muted: 180 10% 66%; /* #ecfeff */
+		--muted-foreground: 176 61% 19%; /* #134e4a */
+
+		--popover: 0 0% 0%; /* #000000 */
+		--popover-foreground: 173 80% 40%; /* #14b8a6 */
+
+		--card: 0 0% 0%; /* #000000 */
+		--card-foreground: 173 80% 40%; /* #14b8a6 */
+
+		--border: 183 100% 96%; /* #ecfeff */
+		--input: 183 100% 96%; /* #ecfeff */
+
+		--primary: 183 100% 96%; /* #14b8a6 */
+		--primary-foreground: 221 39% 11%; /* #111827 */
+
+		--secondary: 173 80% 40%; /* #ecfeff */
+		--secondary-foreground: 173 80% 40%; /* #14b8a6 */
+
+		--accent: 183 100% 96%; /* #ecfeff */
+		--accent-foreground: 173 80% 40%; /* #14b8a6 */
+
+		--destructive: 0 70% 35%; /* #991b1b */
+		--destructive-foreground: 173 80% 40%; /* #14b8a6 */
+
+		--offline: var(--destructive);
+		--online: 142 76% 36%; /* #16a34a */
+		--pending: 25 95% 53%; /* #f97316 */
+		--maintenance: 224 76% 48%; /* #1d4ed8 */
+
+		/* that border thingy when you tab through stuff */
+		--ring: hsl(168 84% 78%); /* #99f6e4 */
+	}
+}
+
+@layer base {
+	* {
+		@apply border-border;
+	}
+	body {
+		@apply bg-background text-foreground;
+	}
+}

src/lib/components/Emfed.svelte

@@ -0,0 +1,193 @@
+<svelte:options runes={true} />
+
+<script lang="ts">
+	import { onMount } from 'svelte';
+	import sanitizeHtml from 'sanitize-html';
+	import { Skeleton } from '$lib/components/ui/skeleton/index.js';
+	import { DoubleArrowUp } from 'radix-icons-svelte';
+
+	let {
+		account,
+		maxToots,
+		accountId,
+		excludeReplies
+	}: { account: string; maxToots?: number; accountId?: string; excludeReplies: boolean } = $props();
+
+	let toots: Toot[] = $state([]);
+	let loading = $state(false);
+
+	onMount(() => {
+		loading = true;
+		loadToots(account, accountId, maxToots, excludeReplies);
+	});
+
+	interface Toot {
+		created_at: string;
+		in_reply_to_id: string | null;
+		content: string;
+		url: string;
+		account: {
+			username: string;
+			display_name: string;
+			avatar: string;
+			url: string;
+		};
+		reblog?: Toot;
+		media_attachments: {
+			type: 'unknown' | 'image' | 'gifv' | 'video' | 'audio';
+			url: string;
+			preview_url: string;
+			description: string;
+			blurhash: string;
+		}[];
+	}
+
+	export async function getToots(
+		userURL: string,
+		limit: number,
+		excludeReplies: boolean,
+		accountId?: string
+	): Promise<Toot[]> {
+		const url = new URL(userURL);
+
+		// Either use the account id specified or look it up based on the username
+		// in the link.
+		const userId: string =
+			accountId ??
+			(await (async () => {
+				// Extract username from URL.
+				const parts = /@(\w+)$/.exec(url.pathname);
+				if (!parts) {
+					throw 'not a Mastodon user URL';
+				}
+				const username = parts[1];
+
+				// Look up user ID from username.
+				const lookupURL = Object.assign(new URL(url), {
+					pathname: '/api/v1/accounts/lookup',
+					search: `?acct=${username}`
+				});
+				return (await (await fetch(lookupURL)).json())['id'];
+			})());
+
+		// Fetch toots.
+		const tootURL = Object.assign(new URL(url), {
+			pathname: `/api/v1/accounts/${userId}/statuses`,
+			search: `?limit=${limit ?? 5}&exclude_replies=${!!excludeReplies}`
+		});
+
+		return await (await fetch(tootURL)).json();
+	}
+
+	function loadToots() {
+		getToots(account, maxToots ?? 5, excludeReplies === true, accountId).then((data) => {
+			toots = data;
+			loading = false;
+		});
+	}
+</script>
+
+{#snippet avatar(toot)}
+	<a class="flex flex-row gap-2" href={toot.account.url}>
+		<img
+			class="rounded-md"
+			width="48px"
+			height="48px"
+			src={toot.account.avatar}
+			alt="{toot.account.username} avatar"
+		/>
+		<div class="flex flex-col items-start">
+			<span class="h-6 font-bold hover:underline">{toot.account.display_name}</span>
+			<span class="h-4 text-sm text-muted">@{toot.account.username}</span>
+		</div>
+	</a>
+{/snippet}
+
+{#snippet body(toot)}
+	<div>
+		<div class="[&>p>span>a]:hover:underline">
+			{@html sanitizeHtml(toot.content)}
+		</div>
+		{#each toot.media_attachments.filter((att) => att.type === 'image') as image}
+			<a
+				class="block aspect-16/9 w-full overflow-hidden rounded-md"
+				href={image.url}
+				target="_blank"
+				rel="noopener noreferrer"
+			>
+				<img class="h-full w-full object-cover" src={image.preview_url} alt={image.description} />
+			</a>
+		{/each}
+	</div>
+{/snippet}
+
+<ol class="h-[40rem] w-full overflow-y-auto">
+	{#if loading}
+		{#each Array(maxToots ?? 5) as placeholder}
+			<li class="flex flex-col gap-3 px-4 py-3">
+				<div class="flex flex-row justify-between">
+					<div class="flex flex-row gap-2">
+						<Skeleton class="h-12 w-12 rounded-md" />
+						<div class="flex flex-col items-start gap-1">
+							<Skeleton class="h-6 w-24"></Skeleton>
+							<Skeleton class="h-4 w-20"></Skeleton>
+						</div>
+					</div>
+					<Skeleton class="h-10 w-16" />
+				</div>
+				<Skeleton class="h-36 w-full"></Skeleton>
+			</li>
+		{/each}
+	{:else}
+		{#each toots as toot}
+			<li class="flex flex-col gap-3 px-4 py-3">
+				{#if toot.reblog}
+					<div class="flex flex-row justify-between">
+						<div class="flex flex-col gap-1">
+							<a class="flex flex-row items-center gap-1" href={toot.account.url}>
+								<DoubleArrowUp />
+								<img
+									class="rounded-md"
+									width="23px"
+									height="23px"
+									src={toot.account.avatar}
+									alt="{toot.account.username} avatar"
+								/>
+								<span class="h-6 font-bold hover:underline">{toot.account.display_name}</span>
+							</a>
+							{@render avatar(toot.reblog)}
+						</div>
+						<a
+							class="flex flex-col items-center text-sm text-muted hover:underline"
+							href={toot.url}
+						>
+							<time datetime={toot.created_at}>
+								{new Date(toot.created_at).toLocaleDateString()}
+							</time>
+							<time datetime={toot.created_at}>
+								{new Date(toot.created_at).toLocaleTimeString()}
+							</time>
+						</a>
+					</div>
+					{@render body(toot.reblog)}
+				{:else}
+					<div class="flex flex-row justify-between">
+						{@render avatar(toot)}
+						<a
+							class="flex flex-col items-center text-sm text-muted hover:underline"
+							href={toot.url}
+						>
+							<time datetime={toot.created_at}>
+								{new Date(toot.created_at).toLocaleDateString()}
+							</time>
+							<time datetime={toot.created_at}>
+								{new Date(toot.created_at).toLocaleTimeString()}
+							</time>
+						</a>
+					</div>
+					{@render body(toot)}
+				{/if}
+			</li>
+		{/each}
+	{/if}
+</ol>

src/lib/components/ServerCard.svelte

@@ -0,0 +1,158 @@
+<svelte:options runes={true} />
+
+<script lang="ts">
+	import { Copy, OpenInNewWindow } from 'radix-icons-svelte';
+	import { quintInOut } from 'svelte/easing';
+	import { slide } from 'svelte/transition';
+	import { IconType, type Server } from '$lib/types/data-types';
+	import { Skeleton } from '$lib/components/ui/skeleton';
+	import { Button } from '$lib/components/ui/button';
+
+	let { server, icons } = $props<{
+		server: Server;
+		icons: Array<string>;
+	}>();
+
+	let hover = $state({
+		title: false,
+		link: false,
+		ext: false
+	});
+
+	let img_source: string = $state('');
+
+	function copyToClipboard(value: string) {
+		navigator.clipboard.writeText(value);
+	}
+
+	function checkForImage(server: Server) {
+		const rootSplit = server.icon.split('/');
+		const root = rootSplit[rootSplit.length - 1];
+
+		if (icons.includes(`${root}.${server.iconType}`)) {
+			img_source = `${server.icon}.${server.iconType}`;
+		} else {
+			img_source = '';
+		}
+	}
+
+	$effect(() => {
+		if (icons.length != 0 && typeof server.icon !== 'undefined') {
+			const rootSplit = server.icon.split('/');
+			const root = rootSplit[rootSplit.length - 1];
+
+			if (server.iconType === IconType.SVG) {
+				checkForImage(server);
+			} else {
+				if (icons.includes(`${root}-36.${server.iconType}`)) {
+					img_source = `${server.icon}-36.${server.iconType}`;
+				} else {
+					checkForImage(server);
+				}
+			}
+		}
+	});
+</script>
+
+<div
+	class="z-0 flex h-48 w-[28rem] flex-col gap-y-3 rounded-xl border-t-4 border-secondary bg-black/55 p-4 backdrop-blur-sm"
+>
+	<div class="flex flex-row justify-between">
+		<div
+			class="flex flex-row items-center gap-1"
+			onmouseover={() => (hover.title = true)}
+			onfocus={() => (hover.title = true)}
+			onmouseleave={() => (hover.title = false)}
+		>
+			{#if typeof server.icon !== 'undefined'}
+				{#if img_source != ''}
+					<img
+						width="24px"
+						class="h-6 w-6 cursor-pointer"
+						src={img_source}
+						alt="{server.name} Logo"
+					/>
+				{:else}
+					<Skeleton class="h-6 w-6 rounded-full" />
+				{/if}
+			{:else}{/if}
+			{#if typeof server.href !== 'undefined'}
+				<a href={server.href} class="font-bold {!hover.title || 'text-secondary'}">{server.name}</a>
+				{#if hover.title}
+					<div
+						transition:slide={{ delay: 100, duration: 200, easing: quintInOut, axis: 'x' }}
+						class="grid items-center"
+					>
+						<OpenInNewWindow
+							color={hover.title ? 'hsl(var(--secondary))' : 'hsl(var(--primary)'}
+							class="self-center"
+						/>
+					</div>
+				{/if}
+			{:else}
+				<h2 class="font-bold">{server.name}</h2>
+			{/if}
+		</div>
+	</div>
+	<p class="text-wrap text-center text-sm">{server.desc}</p>
+	{#if typeof server.connection !== 'undefined'}
+		<div class="flex w-full flex-col items-center">
+			<Button
+				variant="ghost"
+				class="	flex w-fit flex-row items-center gap-1 rounded-sm border px-2 py-1 text-center font-mono text-sm font-bold
+							hover:border-primary hover:bg-transparent hover:text-primary/60
+							active:border-secondary active:bg-black/70 active:text-secondary"
+				on:click={() => copyToClipboard(server.connection)}
+			>
+				{server.connection}
+				<Copy />
+			</Button>
+		</div>
+	{/if}
+	<div class="grid {server.extLink ? 'grid-cols-2' : 'grid-cols-1'} mt-auto justify-items-center">
+		{#if typeof server.href !== 'undefined'}
+			<a
+				class="flex flex-row rounded-md border-x-2 px-2 text-sm hover:border-secondary hover:text-secondary"
+				href={server.href}
+				onmouseover={() => (hover.link = true)}
+				onfocus={() => (hover.title = true)}
+				onmouseleave={() => (hover.link = false)}
+			>
+				Open
+				{#if hover.link}
+					<div
+						transition:slide={{ delay: 100, duration: 200, easing: quintInOut, axis: 'x' }}
+						class="grid items-center pl-1 pr-0"
+					>
+						<OpenInNewWindow
+							color={hover.link ? 'hsl(var(--secondary))' : 'hsl(var(--primary)'}
+							class="self-center"
+						/>
+					</div>
+				{/if}
+			</a>
+		{/if}
+		{#if server.extLink}
+			<a
+				class="flex flex-row rounded-md border-x-2 px-2 text-sm hover:border-secondary hover:text-secondary"
+				href={server.extLink}
+				onmouseover={() => (hover.ext = true)}
+				onfocus={() => (hover.title = true)}
+				onmouseleave={() => (hover.ext = false)}
+			>
+				Official Site
+				{#if hover.ext}
+					<div
+						transition:slide={{ delay: 100, duration: 200, easing: quintInOut, axis: 'x' }}
+						class="grid items-center pl-1 pr-0"
+					>
+						<OpenInNewWindow
+							color={hover.ext ? 'hsl(var(--secondary))' : 'hsl(var(--primary)'}
+							class="self-center"
+						/>
+					</div>
+				{/if}
+			</a>
+		{/if}
+	</div>
+</div>

src/lib/components/ServiceCard.svelte

@@ -0,0 +1,134 @@
+<svelte:options runes={true} />
+
+<script lang="ts">
+	import { OpenInNewWindow } from 'radix-icons-svelte';
+	import { quintInOut } from 'svelte/easing';
+	import { slide } from 'svelte/transition';
+	import { IconType, type Service } from '$lib/types/data-types';
+	import { Skeleton } from '$lib/components/ui/skeleton';
+
+	let { service, icons, monitor } = $props<{
+		service: Service;
+		icons: Array<string>;
+	}>();
+
+	let hover = $state({
+		title: false,
+		link: false,
+		ext: false
+	});
+
+	let img_source: string = $state('');
+
+	function checkForImage(service: Service) {
+		const rootSplit = service.icon.split('/');
+		const root = rootSplit[rootSplit.length - 1];
+
+		if (icons.includes(`${root}.${service.iconType}`)) {
+			img_source = `${service.icon}.${service.iconType}`;
+		} else {
+			img_source = '';
+		}
+	}
+
+	$effect(() => {
+		if (icons.length != 0) {
+			const rootSplit = service.icon.split('/');
+			const root = rootSplit[rootSplit.length - 1];
+
+			if (service.iconType === IconType.SVG) {
+				checkForImage(service);
+			} else {
+				if (icons.includes(`${root}-36.${service.iconType}`)) {
+					img_source = `${service.icon}-36.${service.iconType}`;
+				} else {
+					checkForImage(service);
+				}
+			}
+		}
+	});
+</script>
+
+<div
+	class="z-0 flex h-48 w-[28rem] flex-col gap-y-3 rounded-xl border-t-4 border-secondary bg-black/55 p-4 backdrop-blur-sm"
+>
+	<div class="flex flex-row justify-between">
+		<div
+			class="flex flex-row items-center gap-1"
+			onmouseover={() => (hover.title = true)}
+			onfocus={() => (hover.title = true)}
+			onmouseleave={() => (hover.title = false)}
+		>
+			{#if service.icon}
+				{#if img_source != ''}
+					<img
+						width="24px"
+						class="h-6 w-6 cursor-pointer"
+						src={img_source}
+						alt="{service.name} Logo"
+					/>
+				{:else}
+					<Skeleton class="h-6 w-6 rounded-full" />
+				{/if}
+			{:else}{/if}
+			<a href={service.href} class="font-bold {!hover.title || 'text-secondary'}">{service.name}</a>
+			{#if hover.title}
+				<div
+					transition:slide={{ delay: 100, duration: 200, easing: quintInOut, axis: 'x' }}
+					class="grid items-center"
+				>
+					<OpenInNewWindow
+						color={hover.title ? 'hsl(var(--secondary))' : 'hsl(var(--primary)'}
+						class="self-center"
+					/>
+				</div>
+			{/if}
+		</div>
+	</div>
+	<p class="text-wrap text-center text-sm">{service.desc}</p>
+	<p class="text-center text-sm font-bold text-destructive">{service.warn}</p>
+	<div class="grid {service.extLink ? 'grid-cols-2' : 'grid-cols-1'} mt-auto justify-items-center">
+		<a
+			class="flex flex-row rounded-md border-x-2 px-2 text-sm hover:border-secondary hover:text-secondary"
+			href={service.href}
+			onmouseover={() => (hover.link = true)}
+			onfocus={() => (hover.title = true)}
+			onmouseleave={() => (hover.link = false)}
+		>
+			Open
+			{#if hover.link}
+				<div
+					transition:slide={{ delay: 100, duration: 200, easing: quintInOut, axis: 'x' }}
+					class="grid items-center pl-1 pr-0"
+				>
+					<OpenInNewWindow
+						color={hover.link ? 'hsl(var(--secondary))' : 'hsl(var(--primary)'}
+						class="self-center"
+					/>
+				</div>
+			{/if}
+		</a>
+		{#if service.extLink}
+			<a
+				class="flex flex-row rounded-md border-x-2 px-2 text-sm hover:border-secondary hover:text-secondary"
+				href={service.extLink}
+				onmouseover={() => (hover.ext = true)}
+				onfocus={() => (hover.title = true)}
+				onmouseleave={() => (hover.ext = false)}
+			>
+				Official Site
+				{#if hover.ext}
+					<div
+						transition:slide={{ delay: 100, duration: 200, easing: quintInOut, axis: 'x' }}
+						class="grid items-center pl-1 pr-0"
+					>
+						<OpenInNewWindow
+							color={hover.ext ? 'hsl(var(--secondary))' : 'hsl(var(--primary)'}
+							class="self-center"
+						/>
+					</div>
+				{/if}
+			</a>
+		{/if}
+	</div>
+</div>

src/lib/components/ui/button/button.svelte

@@ -0,0 +1,25 @@
+<script lang="ts">
+	import { Button as ButtonPrimitive } from 'bits-ui';
+	import { type Events, type Props, buttonVariants } from './index.js';
+	import { cn } from '$lib/utils.js';
+
+	type $$Props = Props;
+	type $$Events = Events;
+
+	let className: $$Props['class'] = undefined;
+	export let variant: $$Props['variant'] = 'default';
+	export let size: $$Props['size'] = 'default';
+	export let builders: $$Props['builders'] = [];
+	export { className as class };
+</script>
+
+<ButtonPrimitive.Root
+	{builders}
+	class={cn(buttonVariants({ variant, size, className }))}
+	type="button"
+	{...$$restProps}
+	on:click
+	on:keydown
+>
+	<slot />
+</ButtonPrimitive.Root>

src/lib/components/ui/button/index.ts

@@ -0,0 +1,49 @@
+import type { Button as ButtonPrimitive } from 'bits-ui';
+import { type VariantProps, tv } from 'tailwind-variants';
+import Root from './button.svelte';
+
+const buttonVariants = tv({
+	base: 'focus-visible:ring-ring inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 disabled:pointer-events-none disabled:opacity-50',
+	variants: {
+		variant: {
+			default: 'bg-primary text-primary-foreground hover:bg-primary/90 shadow',
+			destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90 shadow-sm',
+			outline:
+				'border-input bg-background hover:bg-accent hover:text-accent-foreground border shadow-sm',
+			secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-sm',
+			ghost: 'hover:bg-accent hover:text-accent-foreground',
+			link: 'text-primary underline-offset-4 hover:underline'
+		},
+		size: {
+			default: 'h-9 px-4 py-2',
+			sm: 'h-8 rounded-md px-3 text-xs',
+			lg: 'h-10 rounded-md px-8',
+			icon: 'h-9 w-9'
+		}
+	},
+	defaultVariants: {
+		variant: 'default',
+		size: 'default'
+	}
+});
+
+type Variant = VariantProps<typeof buttonVariants>['variant'];
+type Size = VariantProps<typeof buttonVariants>['size'];
+
+type Props = ButtonPrimitive.Props & {
+	variant?: Variant;
+	size?: Size;
+};
+
+type Events = ButtonPrimitive.Events;
+
+export {
+	Root,
+	type Props,
+	type Events,
+	//
+	Root as Button,
+	type Props as ButtonProps,
+	type Events as ButtonEvents,
+	buttonVariants
+};

src/lib/components/ui/separator/index.ts

@@ -0,0 +1,7 @@
+import Root from './separator.svelte';
+
+export {
+	Root,
+	//
+	Root as Separator
+};

src/lib/components/ui/separator/separator.svelte

@@ -0,0 +1,22 @@
+<script lang="ts">
+	import { Separator as SeparatorPrimitive } from 'bits-ui';
+	import { cn } from '$lib/utils.js';
+
+	type $$Props = SeparatorPrimitive.Props;
+
+	let className: $$Props['class'] = undefined;
+	export let orientation: $$Props['orientation'] = 'horizontal';
+	export let decorative: $$Props['decorative'] = undefined;
+	export { className as class };
+</script>
+
+<SeparatorPrimitive.Root
+	class={cn(
+		'shrink-0 bg-border',
+		orientation === 'horizontal' ? 'h-[1px] w-full' : 'min-h-full w-[1px]',
+		className
+	)}
+	{orientation}
+	{decorative}
+	{...$$restProps}
+/>

src/lib/components/ui/skeleton/index.ts

@@ -0,0 +1,7 @@
+import Root from './skeleton.svelte';
+
+export {
+	Root,
+	//
+	Root as Skeleton
+};

src/lib/components/ui/skeleton/skeleton.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import { cn } from '$lib/utils.js';
+
+	type $$Props = HTMLAttributes<HTMLDivElement>;
+
+	let className: $$Props['class'] = undefined;
+	export { className as class };
+</script>
+
+<div class={cn('animate-pulse rounded-md bg-primary/10', className)} {...$$restProps}></div>

src/lib/index.ts

@@ -0,0 +1 @@
+// place files you want to import through the `$lib` alias in this folder.

src/lib/types/data-types.ts

@@ -0,0 +1,29 @@
+export type Service = {
+	readonly name: string;
+	readonly icon?: string;
+	readonly iconType?: IconType;
+	readonly href: string;
+	readonly desc: string;
+	readonly warn: string;
+	readonly extLink?: string;
+	readonly id: number;
+};
+
+export type Server = {
+	readonly name: string;
+	readonly icon?: string;
+	readonly iconType?: IconType;
+	readonly connection?: string;
+	readonly href?: string;
+	readonly desc?: string;
+	readonly extLink?: string;
+	readonly id?: number;
+};
+
+export enum IconType {
+	SVG = 'svg',
+	AVIF = 'avif',
+	PNG = 'png',
+	WEBP = 'webp',
+	JPG = 'jpg'
+}

src/lib/utils.ts

@@ -0,0 +1,56 @@
+import { type ClassValue, clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { cubicOut } from 'svelte/easing';
+import type { TransitionConfig } from 'svelte/transition';
+
+export function cn(...inputs: ClassValue[]) {
+	return twMerge(clsx(inputs));
+}
+
+type FlyAndScaleParams = {
+	y?: number;
+	x?: number;
+	start?: number;
+	duration?: number;
+};
+
+export const flyAndScale = (
+	node: Element,
+	params: FlyAndScaleParams = { y: -8, x: 0, start: 0.95, duration: 150 }
+): TransitionConfig => {
+	const style = getComputedStyle(node);
+	const transform = style.transform === 'none' ? '' : style.transform;
+
+	const scaleConversion = (valueA: number, scaleA: [number, number], scaleB: [number, number]) => {
+		const [minA, maxA] = scaleA;
+		const [minB, maxB] = scaleB;
+
+		const percentage = (valueA - minA) / (maxA - minA);
+		const valueB = percentage * (maxB - minB) + minB;
+
+		return valueB;
+	};
+
+	const styleToString = (style: Record<string, number | string | undefined>): string => {
+		return Object.keys(style).reduce((str, key) => {
+			if (style[key] === undefined) return str;
+			return str + `${key}:${style[key]};`;
+		}, '');
+	};
+
+	return {
+		duration: params.duration ?? 200,
+		delay: 0,
+		css: (t) => {
+			const y = scaleConversion(t, [0, 1], [params.y ?? 5, 0]);
+			const x = scaleConversion(t, [0, 1], [params.x ?? 0, 0]);
+			const scale = scaleConversion(t, [0, 1], [params.start ?? 0.95, 1]);
+
+			return styleToString({
+				transform: `${transform} translate3d(${x}px, ${y}px, 0) scale(${scale})`,
+				opacity: t
+			});
+		},
+		easing: cubicOut
+	};
+};

src/routes/+layout.svelte

@@ -0,0 +1,17 @@
+<svelte:options runes={true} />
+
+<script>
+	import '../app.pcss';
+	import Header from './Header.svelte';
+	import Footer from './Footer.svelte';
+
+	let { children } = $props();
+</script>
+
+<Header />
+
+<div class="h-full pb-8 pt-16">
+	{@render children()}
+</div>
+
+<Footer />

src/routes/+page.svelte

@@ -0,0 +1,65 @@
+<script lang="ts">
+	import { Separator } from '$lib/components/ui/separator';
+	import { OpenInNewWindow } from 'radix-icons-svelte';
+	import Emfed from '$lib/components/Emfed.svelte';
+</script>
+
+<svelte:head>
+	<title>Home</title>
+	<meta name="description" content="Landing Page for neshweb.net" />
+</svelte:head>
+
+<div
+	class="flex max-h-full flex-row flex-wrap justify-center justify-around gap-4 overflow-auto p-8"
+>
+	<div class="flex w-[22rem] flex-1 flex-col items-center">
+		<div class="flex flex-col gap-y-2 rounded-xl border bg-black/55 p-4 backdrop-blur-sm">
+			<h1 class="text-center text-2xl">Home Page</h1>
+			<p>
+				I'm not sure what to put here quite yet, maybe I'll think of something eventually. In the
+				meantime I've linked some of my accounts in the sidebar to the right
+			</p>
+		</div>
+	</div>
+	<div
+		class="flex w-[22rem] flex-col items-center gap-y-1 overflow-auto rounded-xl border bg-black/55 py-1 backdrop-blur-sm"
+	>
+		<p class="font-bold">Fediverse Accounts</p>
+		<Separator class="max-w-80" />
+		<a
+			rel="me"
+			href="https://mastodon.neshweb.net/@neshura"
+			target="_blank"
+			class="flex flex-row items-center gap-1 hover:text-secondary"
+		>
+			Mastodon
+			<OpenInNewWindow />
+		</a>
+		<a
+			rel="noopener noreferrer"
+			href="https://bookwormstory.social/u/Neshura"
+			target="_blank"
+			class="flex flex-row items-center gap-1 hover:text-secondary"
+		>
+			Lemmy
+			<OpenInNewWindow />
+		</a>
+		<a
+			rel="noopener noreferrer"
+			href="https://neshweb.tv/c/neshura_ch/videos"
+			target="_blank"
+			class="flex flex-row items-center gap-1 hover:text-secondary"
+		>
+			PeerTube
+			<OpenInNewWindow />
+		</a>
+		<Separator class="max-w-80" />
+		<p class="font-bold">Mastodon Feed</p>
+		<Separator class="max-w-80" />
+		<Emfed
+			account="https://mastodon.neshweb.net/@neshura"
+			maxToots={4}
+			accountId="109199738141333007"
+		/>
+	</div>
+</div>

src/routes/Footer.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+	import { version } from '$app/environment';
+</script>
+
+<div
+	class="absolute bottom-0 z-50 flex h-8 w-full flex-row items-center gap-3 border-t bg-black/40 backdrop-blur-sm"
+>
+	<p class="px-4">
+		Version:
+		<a
+			href="https://forgejo.neshweb.net/Neshweb-Sites/main-site/releases/tag/{version}"
+			class="text-secondary hover:underline"
+		>
+			{version}
+		</a>
+	</p>
+</div>

src/routes/Header.svelte

@@ -0,0 +1,50 @@
+<script lang="ts">
+	import { page } from '$app/state';
+	import { Button } from '$lib/components/ui/button';
+
+	const button = 'border-t-2 bg-black/55 hover:bg-black/70 hover:border-secondary w-28';
+</script>
+
+<ul
+	class="absolute z-50 flex h-16 w-full flex-row items-center gap-3 overflow-x-auto border-b bg-black/40 backdrop-blur-sm"
+>
+	<li class="ml-auto">
+		<Button
+			variant="ghost"
+			href="/"
+			class="{button} + {!(page.url.pathname === '/') || 'border-secondary text-secondary'}"
+		>
+			Home
+		</Button>
+	</li>
+	<li>
+		<Button
+			variant="ghost"
+			href="/servers"
+			class="{button} + {!page.url.pathname.startsWith('/servers') ||
+				'border-secondary text-secondary'}"
+		>
+			Servers
+		</Button>
+	</li>
+	<li>
+		<Button
+			variant="ghost"
+			href="/services"
+			class="{button} + {!page.url.pathname.startsWith('/services') ||
+				'border-secondary text-secondary'}"
+		>
+			Services
+		</Button>
+	</li>
+	<li class="mr-auto">
+		<Button
+			variant="ghost"
+			href="/about"
+			class="{button} + {!page.url.pathname.startsWith('/about') ||
+				'border-secondary text-secondary'}"
+		>
+			About
+		</Button>
+	</li>
+</ul>

src/routes/about/+page.svelte

@@ -0,0 +1,11 @@
+<svelte:head>
+	<title>About</title>
+	<meta name="description" content="Information about this Website" />
+</svelte:head>
+
+<div class="flex max-h-full flex-row flex-wrap justify-center gap-10 overflow-auto p-8">
+	<p>
+		This is just a small Website I built to organize all of the Services I am self-hosting. Maybe
+		I'll eventually add something actually useful to the site but until then this is all you'll get.
+	</p>
+</div>

src/routes/assets/icons/+server.ts

@@ -0,0 +1,10 @@
+import * as fs from 'fs';
+import { json } from '@sveltejs/kit';
+
+export function GET() {
+	let content = fs.readdirSync('static/assets/icons');
+
+	content = content.filter((entry) => entry != '.directory');
+
+	return json(content);
+}

src/routes/css/+page.svelte

@@ -0,0 +1,29 @@
+<svelte:head>
+	<title>CSS Test</title>
+	<meta name="description" content="CSS playground" />
+</svelte:head>
+
+<p class="text-background">Background</p>
+<p class="text-foreground">Foreground</p>
+<p class="text-muted">Muted</p>
+<p class="text-muted-foreground">Muted Foreground</p>
+<p class="text-popover">Popover</p>
+<p class="text-popover-foreground">Popover Foreground</p>
+<p class="text-card">card</p>
+<p class="text-card-foreground">card-foreground</p>
+<p class="text-border">border</p>
+<p class="text-input">input</p>
+<p class="text-primary">Primary</p>
+<p class="text-primary-foreground">primary-foreground</p>
+<p class="text-secondary">secondary</p>
+<p class="text-secondary-foreground">secondary-foreground</p>
+<p class="text-accent">accent</p>
+<p class="text-secondary-foreground">secondary-foreground</p>
+<p class="text-accent">accent</p>
+<p class="text-accent-foreground">accent-foreground</p>
+<p class="text-destructive">destructive</p>
+<p class="text-destructive-foreground">destructive-foreground</p>
+<p class="text-offline">offline</p>
+<p class="text-online">online</p>
+<p class="text-pending">pending</p>
+<p class="text-maintenance">maintenance</p>

src/routes/data/servers/+server.ts

@@ -0,0 +1,10 @@
+import * as fs from 'fs';
+import { json } from '@sveltejs/kit';
+
+export function GET() {
+	const content = fs.readFileSync('static/data/servers.json').toString();
+
+	const data = JSON.parse(content);
+
+	return json(data);
+}

src/routes/data/services/+server.ts

@@ -0,0 +1,10 @@
+import * as fs from 'fs';
+import { json } from '@sveltejs/kit';
+
+export function GET() {
+	const content = fs.readFileSync('static/data/services.json').toString();
+
+	const data = JSON.parse(content);
+
+	return json(data);
+}

src/routes/servers/+page.svelte

@@ -0,0 +1,47 @@
+<svelte:options runes={true} />
+
+<script lang="ts">
+	import type { Server } from '$lib/types/data-types';
+	import ServerCard from '$lib/components/ServerCard.svelte';
+
+	let servers: readonly Server[] = $state.raw([]);
+
+	let icons: readonly string[] = $state.raw([]);
+
+	async function get(url: string): Promise<any> {
+		let res = await fetch(url);
+		if (res.ok) {
+			let data = await res.json();
+			return data;
+		} else {
+			return Promise.reject();
+		}
+	}
+
+	$effect(() => {
+		get('/data/servers').then((data: Server[]) => {
+			servers = data;
+		});
+	});
+
+	$effect(() => {
+		get('/assets/icons').then((data: string[]) => {
+			icons = data;
+		});
+	});
+</script>
+
+<svelte:head>
+	<title>Servers</title>
+	<meta name="description" content="Overview of Game Servers running on neshweb.net" />
+</svelte:head>
+
+<div class="flex max-h-full flex-row flex-wrap justify-center gap-10 overflow-auto p-8">
+	{#each servers as server}
+		{#if typeof server.id === 'undefined'}
+			<ServerCard {server} {icons} />
+		{:else}
+			<ServerCard {server} {icons} />
+		{/if}
+	{/each}
+</div>

src/routes/services/+page.svelte

@@ -0,0 +1,43 @@
+<svelte:options runes={true} />
+
+<script lang="ts">
+	import ServiceCard from '$lib/components/ServiceCard.svelte';
+	import type { Service } from '$lib/types/data-types';
+
+	let services: readonly Service[] = $state.raw([]);
+
+	let icons: readonly string[] = $state.raw([]);
+
+	async function get(url: string): Promise<any> {
+		let res = await fetch(url);
+		if (res.ok) {
+			let data = await res.json();
+			return data;
+		} else {
+			return Promise.reject();
+		}
+	}
+
+	$effect(() => {
+		get('/data/services').then((data: Service[]) => {
+			services = data;
+		});
+	});
+
+	$effect(() => {
+		get('/assets/icons').then((data: string[]) => {
+			icons = data;
+		});
+	});
+</script>
+
+<svelte:head>
+	<title>Services</title>
+	<meta name="description" content="Overview of Services running on neshweb.net" />
+</svelte:head>
+
+<div class="flex max-h-full flex-row flex-wrap justify-center gap-10 overflow-auto p-8">
+	{#each services as service}
+		<ServiceCard {service} {icons} />
+	{/each}
+</div>

static/assets/icons/.directory

@@ -0,0 +1,4 @@
+[Dolphin]
+Timestamp=2024,1,1,19,4,51.936
+Version=4
+ViewMode=1

static/assets/icons/forgejo-logo.svg

@@ -0,0 +1,40 @@
+<svg viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg">
+  <metadata
+    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+    xmlns:cc="http://creativecommons.org/ns#"
+    xmlns:dc="http://purl.org/dc/elements/1.1/"
+  >
+    <rdf:RDF>
+      <cc:Work rdf:about="https://codeberg.org/forgejo/governance/src/branch/main/branding#logo">
+        <dc:title>Forgejo logo</dc:title>
+        <cc:creator rdf:resource="https://caesarschinas.com/"><cc:attributionName>Caesar Schinas</cc:attributionName></cc:creator>
+        <cc:license rdf:resource="http://creativecommons.org/licenses/by-sa/4.0/" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <style type="text/css">
+    circle {
+      fill: none;
+      stroke: #000;
+      stroke-width: 15;
+    }
+    path {
+      fill: none;
+      stroke: #000;
+      stroke-width: 25;
+    }
+    .orange {
+      stroke:#ff6600;
+    }
+    .red {
+      stroke:#d40000;
+    }
+  </style>
+  <g transform="translate(28,28)">
+    <path d="M58 168 v-98 a50 50 0 0 1 50-50 h20" class="orange" />
+    <path d="M58 168 v-30 a50 50 0 0 1 50-50 h20" class="red" />
+    <circle cx="142" cy="20" r="18" class="orange" />
+    <circle cx="142" cy="88" r="18" class="red" />
+    <circle cx="58" cy="180" r="18" class="red" />
+  </g>
+</svg>

static/assets/icons/jellyfin-logo.svg

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- ***** BEGIN LICENSE BLOCK *****
+  - Part of the Jellyfin project (https://jellyfin.media)
+  - 
+  - All copyright belongs to the Jellyfin contributors; a full list can
+  - be found in the file CONTRIBUTORS.md
+  - 
+  - This work is licensed under the Creative Commons Attribution-ShareAlike 4.0 International License.
+  - To view a copy of this license, visit http://creativecommons.org/licenses/by-sa/4.0/.
+- ***** END LICENSE BLOCK ***** -->
+<svg version="1.1" id="icon-transparent" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 512 512">
+	<defs>
+		<linearGradient id="linear-gradient" gradientUnits="userSpaceOnUse" x1="110.25" y1="213.3" x2="496.14" y2="436.09">
+			<stop offset="0" style="stop-color:#AA5CC3"/>
+			<stop offset="1" style="stop-color:#00A4DC"/>
+		</linearGradient>
+	</defs>
+	<title>icon-transparent</title>
+	<g id="icon-transparent">
+		<path id="inner-shape" d="M256,201.6c-20.4,0-86.2,119.3-76.2,139.4s142.5,19.9,152.4,0S276.5,201.6,256,201.6z" fill="url(#linear-gradient)"/>
+		<path id="outer-shape" d="M256,23.3c-61.6,0-259.8,359.4-229.6,420.1s429.3,60,459.2,0S317.6,23.3,256,23.3z
+		M406.5,390.8c-19.6,39.3-281.1,39.8-300.9,0s110.1-275.3,150.4-275.3S426.1,351.4,406.5,390.8z" fill="url(#linear-gradient)"/>
+	</g>
+</svg>

static/assets/icons/kavita-logo.svg

@@ -0,0 +1,124 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 64 64" enable-background="new 0 0 64 64" xml:space="preserve">
+<g>
+	<g>
+		<g>
+			<path fill="#4AC694" d="M32,0c17.7,0,32,14.3,32,32S49.7,64,32,64S0,49.7,0,32S14.3,0,32,0z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#424C72" d="M52,17H12c-0.6,0-1,0.4-1,1v30c0,0.6,0.4,1,1,1h14.3c1,0,1.9,0.4,2.4,1.2c0.7,1.1,1.9,1.8,3.3,1.8
+				s2.6-0.7,3.3-1.8c0.5-0.8,1.5-1.2,2.4-1.2H52c0.6,0,1-0.4,1-1V18C53,17.4,52.6,17,52,17z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M14,28v18h16c1.1,0,2,0.9,2,2c0-1.1,0.9-2,2-2h16V28H14z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#FFFFFF" d="M35,13c-1.7,0-3,1.3-3,3c0-1.7-1.3-3-3-3H14v31h16c1.1,0,2,0.9,2,2c0-1.1,0.9-2,2-2h16V13H35z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<rect x="18" y="16" fill="#57D1F7" width="4" height="7"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M29,26.5H18c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S29.3,26.5,29,26.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M29,23.5h-4.4c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5H29c0.3,0,0.5,0.2,0.5,0.5S29.3,23.5,29,23.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M29,20.5h-4.4c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5H29c0.3,0,0.5,0.2,0.5,0.5S29.3,20.5,29,20.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M29,17.5h-4.4c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5H29c0.3,0,0.5,0.2,0.5,0.5S29.3,17.5,29,17.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M29,29.5H18c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S29.3,29.5,29,29.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M29,32.5H18c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S29.3,32.5,29,32.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M29,35.5H18c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S29.3,35.5,29,35.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M29,38.5H18c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S29.3,38.5,29,38.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M29,41.5H18c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S29.3,41.5,29,41.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M46,26.5H35c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S46.3,26.5,46,26.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M46,29.5H35c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S46.3,29.5,46,29.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M46,20.5H35c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S46.3,20.5,46,20.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M46,17.5H35c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S46.3,17.5,46,17.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M46,23.5H35c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S46.3,23.5,46,23.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M46,32.5H35c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S46.3,32.5,46,32.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M46,35.5H35c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S46.3,35.5,46,35.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M46,38.5H35c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S46.3,38.5,46,38.5z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<path fill="#E4E7EF" d="M46,41.5H35c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h11c0.3,0,0.5,0.2,0.5,0.5S46.3,41.5,46,41.5z"/>
+		</g>
+	</g>
+</g>
+</svg>

static/assets/icons/mastodon-logo.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="61.076954mm" height="65.47831mm" viewBox="0 0 216.4144 232.00976">
+  <path fill="#2b90d9" d="M211.80734 139.0875c-3.18125 16.36625-28.4925 34.2775-57.5625 37.74875-15.15875 1.80875-30.08375 3.47125-45.99875 2.74125-26.0275-1.1925-46.565-6.2125-46.565-6.2125 0 2.53375.15625 4.94625.46875 7.2025 3.38375 25.68625 25.47 27.225 46.39125 27.9425 21.11625.7225 39.91875-5.20625 39.91875-5.20625l.8675 19.09s-14.77 7.93125-41.08125 9.39c-14.50875.7975-32.52375-.365-53.50625-5.91875C9.23234 213.82 1.40609 165.31125.20859 116.09125c-.365-14.61375-.14-28.39375-.14-39.91875 0-50.33 32.97625-65.0825 32.97625-65.0825C49.67234 3.45375 78.20359.2425 107.86484 0h.72875c29.66125.2425 58.21125 3.45375 74.8375 11.09 0 0 32.975 14.7525 32.975 65.0825 0 0 .41375 37.13375-4.59875 62.915"/>
+  <path fill="#fff" d="M177.50984 80.077v60.94125h-24.14375v-59.15c0-12.46875-5.24625-18.7975-15.74-18.7975-11.6025 0-17.4175 7.5075-17.4175 22.3525v32.37625H96.20734V85.42325c0-14.845-5.81625-22.3525-17.41875-22.3525-10.49375 0-15.74 6.32875-15.74 18.7975v59.15H38.90484V80.077c0-12.455 3.17125-22.3525 9.54125-29.675 6.56875-7.3225 15.17125-11.07625 25.85-11.07625 12.355 0 21.71125 4.74875 27.8975 14.2475l6.01375 10.08125 6.015-10.08125c6.185-9.49875 15.54125-14.2475 27.8975-14.2475 10.6775 0 19.28 3.75375 25.85 11.07625 6.36875 7.3225 9.54 17.22 9.54 29.675"/>
+</svg>

static/assets/icons/peertube-logo.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg height="682.68799" viewBox="2799 -911 512 682.688" width="512" xmlns="http://www.w3.org/2000/svg"><g stroke-width="32"><path d="m2799-911v341.344l256-170.656" fill="#211f20"/><path d="m2799-569.656v341.344l256-170.656" fill="#737373"/><path d="m3055-740.344v341.344l256-170.656" fill="#f1680d"/></g></svg>

static/assets/icons/roundcube-logo.svg

@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="9.14 141.8 573.65 573.65">
+<style type="text/css">
+.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#404F54;}
+.st1{fill-rule:evenodd;clip-rule:evenodd;fill:#E5E5E5;}
+.st2{fill-rule:evenodd;clip-rule:evenodd;fill:#CCCCCC;}
+.st3{fill-rule:evenodd;clip-rule:evenodd;fill:#37BEFF;}
+</style>
+<polygon class="st3" points="582.79,549.77 295.96,384.1 295.96,207.27 582.79,372.95 "/>
+<polygon class="st0" points="9.14,549.77 295.96,384.1 295.96,207.27 9.14,372.95 "/>
+<path class="st2" d="M295.96,141.8c109.56,0,198.41,88.85,198.41,198.41c0,109.56-88.85,198.41-198.41,198.41 c-109.56,0-198.41-88.85-198.41-198.41C97.55,230.65,186.4,141.8,295.96,141.8"/>
+<path class="st1" d="M295.96,141.8c109.6,0,198.48,88.85,198.48,198.41c0,109.56-88.88,198.41-198.48,198.41 c-62.91-42.34-88.94-127.64-88.94-198.3S233.05,184.22,295.96,141.8"/>
+<polygon class="st3" points="582.79,372.95 295.96,538.62 295.96,715.45 582.79,549.77 "/>
+<polygon class="st0" points="9.14,372.95 295.96,538.62 295.96,715.45 9.14,549.77 "/>
+</svg>

static/assets/icons/vaultwarden-logo.svg

@@ -0,0 +1,74 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg version="1.1" viewBox="0 0 256 256" id="svg383" sodipodi:docname="vaultwarden-icon.svg" inkscape:version="1.2.1 (9c6d41e410, 2022-07-14, custom)" width="256" height="256" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
+  <defs id="defs387" />
+  <sodipodi:namedview id="namedview385" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" showgrid="false" inkscape:zoom="3.3359375" inkscape:cx="128" inkscape:cy="128" inkscape:window-width="1874" inkscape:window-height="1056" inkscape:window-x="46" inkscape:window-y="24" inkscape:window-maximized="1" inkscape:current-layer="svg383" />
+  <title id="title287">Vaultwarden Icon</title>
+  <g id="logo" transform="matrix(2.4381018,0,0,2.4381018,128,128)">
+    <g id="gear" mask="url(#holes)">
+      <path d="m-31.1718-33.813208 26.496029 74.188883h9.3515399l26.49603-74.188883h-9.767164l-16.728866 47.588948q-1.662496 4.571864-2.805462 8.624198-1.142966 3.948427-1.870308 7.585137-.72734199-3.63671-1.8703079-7.689043-1.142966-4.052334-2.805462-8.728104l-16.624959-47.381136z" stroke="#000" stroke-width="4.51171" id="path289" />
+      <circle transform="scale(-1,1)" r="43" fill="none" stroke="#000" stroke-width="9" id="circle291" />
+      <g id="cogs" transform="scale(-1,1)">
+        <polygon id="cog" points="51 0 46 -3 46 3" stroke="#000" stroke-linejoin="round" stroke-width="3" />
+        <use transform="rotate(11.25)" xlink:href="#cog" id="use294" />
+        <use transform="rotate(22.5)" xlink:href="#cog" id="use296" />
+        <use transform="rotate(33.75)" xlink:href="#cog" id="use298" />
+        <use transform="rotate(45)" xlink:href="#cog" id="use300" />
+        <use transform="rotate(56.25)" xlink:href="#cog" id="use302" />
+        <use transform="rotate(67.5)" xlink:href="#cog" id="use304" />
+        <use transform="rotate(78.75)" xlink:href="#cog" id="use306" />
+        <use transform="rotate(90)" xlink:href="#cog" id="use308" />
+        <use transform="rotate(101.25)" xlink:href="#cog" id="use310" />
+        <use transform="rotate(112.5)" xlink:href="#cog" id="use312" />
+        <use transform="rotate(123.75)" xlink:href="#cog" id="use314" />
+        <use transform="rotate(135)" xlink:href="#cog" id="use316" />
+        <use transform="rotate(146.25)" xlink:href="#cog" id="use318" />
+        <use transform="rotate(157.5)" xlink:href="#cog" id="use320" />
+        <use transform="rotate(168.75)" xlink:href="#cog" id="use322" />
+        <use transform="scale(-1)" xlink:href="#cog" id="use324" />
+        <use transform="rotate(191.25)" xlink:href="#cog" id="use326" />
+        <use transform="rotate(202.5)" xlink:href="#cog" id="use328" />
+        <use transform="rotate(213.75)" xlink:href="#cog" id="use330" />
+        <use transform="rotate(225)" xlink:href="#cog" id="use332" />
+        <use transform="rotate(236.25)" xlink:href="#cog" id="use334" />
+        <use transform="rotate(247.5)" xlink:href="#cog" id="use336" />
+        <use transform="rotate(258.75)" xlink:href="#cog" id="use338" />
+        <use transform="rotate(-90)" xlink:href="#cog" id="use340" />
+        <use transform="rotate(-78.75)" xlink:href="#cog" id="use342" />
+        <use transform="rotate(-67.5)" xlink:href="#cog" id="use344" />
+        <use transform="rotate(-56.25)" xlink:href="#cog" id="use346" />
+        <use transform="rotate(-45)" xlink:href="#cog" id="use348" />
+        <use transform="rotate(-33.75)" xlink:href="#cog" id="use350" />
+        <use transform="rotate(-22.5)" xlink:href="#cog" id="use352" />
+        <use transform="rotate(-11.25)" xlink:href="#cog" id="use354" />
+      </g>
+      <g id="mounts" transform="scale(-1,1)">
+        <polygon id="mount" points="0 -35 7 -42 -7 -42" stroke="#000" stroke-linejoin="round" stroke-width="6" />
+        <use transform="rotate(72)" xlink:href="#mount" id="use358" />
+        <use transform="rotate(144)" xlink:href="#mount" id="use360" />
+        <use transform="rotate(216)" xlink:href="#mount" id="use362" />
+        <use transform="rotate(-72)" xlink:href="#mount" id="use364" />
+      </g>
+    </g>
+    <mask id="holes">
+      <rect x="-60" y="-60" width="120" height="120" fill="#fff" id="rect368" />
+      <circle id="hole" cy="-40" r="3" />
+      <use transform="rotate(72)" xlink:href="#hole" id="use371" />
+      <use transform="rotate(144)" xlink:href="#hole" id="use373" />
+      <use transform="rotate(216)" xlink:href="#hole" id="use375" />
+      <use transform="rotate(-72)" xlink:href="#hole" id="use377" />
+    </mask>
+  </g>
+  <metadata id="metadata381">
+    <rdf:RDF>
+      <cc:Work rdf:about="">
+        <dc:title>Vaultwarden Icon</dc:title>
+        <dc:creator>
+          <cc:Agent>
+            <dc:title>Mathijs van Veluw</dc:title>
+          </cc:Agent>
+        </dc:creator>
+        <dc:relation>Rust Logo</dc:relation>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+</svg>

static/data/servers.json

@@ -0,0 +1,25 @@
+[
+  {
+    "name": "Minecraft",
+    "icon": "/assets/icons/minecraft-logo",
+    "iconType": "avif",
+    "connection": "minecraft.neshweb.net",
+    "href": "https://minecraft.neshweb.net/",
+    "desc": "View all currently available Minecraft Servers and their mods",
+    "id": 38
+  },
+  {
+    "name": "Ready or Not",
+    "icon": "/assets/icons/ron-logo",
+    "iconType": "avif",
+    "href": "https://readyornot.neshweb.net/",
+    "desc": "Collection of Floor Plans for the Game 'Ready or Not'"
+  },
+  {
+    "name": "Factorio"
+  },
+  {
+    "name": "Space Engineers",
+    "id": 13
+  }
+]

static/data/services.json

@@ -0,0 +1,102 @@
+[
+	{
+		"name": "Nextcloud",
+		"icon": "/assets/icons/nextcloud-logo",
+		"iconType": "svg",
+		"href": "https://cloud.neshweb.net/",
+		"desc": "Self-hosted Cloud Storage Service",
+		"warn": "Note: Registration requires approval",
+		"extLink": "https://nextcloud.com/",
+		"id": 7
+	},
+	{
+		"name": "Kavita",
+		"icon": "/assets/icons/kavita-logo",
+		"iconType": "svg",
+		"href": "https://kavita.neshweb.net/",
+		"desc": "Self-hosted Manga Library",
+		"warn": "Registration via Admin invite",
+		"id": 5
+	},
+	{
+		"name": "Roundcube Mail",
+		"icon": "/assets/icons/roundcube-logo",
+		"iconType": "svg",
+		"href": "https://mail.neshweb.net/rc",
+		"desc": "Self-hosted Mail Server",
+		"warn": "Registration via Admin invite",
+		"id": 5
+	},
+	{
+		"name": "Dun Scaith",
+		"icon": "/assets/icons/chevereto-logo",
+		"iconType": "png",
+		"href": "https://dun-scaith.com/",
+		"desc": "Self-hosted Chevereto Image Service",
+		"warn": "",
+		"extLink": "https://chevereto.com/",
+		"id": 4
+	},
+	{
+		"name": "PeerTube",
+		"icon": "/assets/icons/peertube-logo",
+		"iconType": "svg",
+		"href": "https://neshweb.tv/",
+		"desc": "Self-hosted PeerTube Instance",
+		"warn": "Note: Registration only via Admin",
+		"id": 8
+	},
+	{
+		"name": "Mastodon",
+		"icon": "/assets/icons/mastodon-logo",
+		"iconType": "svg",
+		"href": "https://mastodon.neshweb.net/",
+		"desc": "Self-hosted Mastodon Instance",
+		"warn": "Note: Registration requires approval",
+		"id": 3
+	},
+	{
+		"name": "Vaultwarden",
+		"icon": "/assets/icons/vaultwarden-logo",
+		"iconType": "svg",
+		"href": "https://vault.neshweb.net/",
+		"desc": "Self-hosted Password Manager",
+		"warn": "Note: Invite only",
+		"id": 9
+	},
+	{
+		"name": "Jellyfin",
+		"icon": "/assets/icons/jellyfin-logo",
+		"iconType": "svg",
+		"href": "https://mov.neshweb.tv/",
+		"desc": "Open-Source, Self-Hosted Media Platform",
+		"warn": "Note: Registration only via Admin",
+		"id": 37
+	},
+	{
+		"name": "Navidrome",
+		"icon": "/assets/icons/navidrome-logo",
+		"iconType": "avif",
+		"href": "https://music.neshweb.net/",
+		"desc": "Open-Source, Self-Hosted Music Streaming Platform",
+		"warn": "Note: Registration only via Admin",
+		"id": 10
+	},
+	{
+		"name": "Forgejo",
+		"icon": "/assets/icons/forgejo-logo",
+		"iconType": "svg",
+		"href": "https://forgejo.neshweb.net/",
+		"desc": "Self-hosted Git Service",
+		"warn": "Note: Registration only via Admin",
+		"id": 36
+	},
+	{
+		"name": "bookwormstory.social",
+		"icon": "/assets/icons/bookworm-logo",
+		"iconType": "avif",
+		"href": "https://bookwormstory.social/",
+		"desc": "Lemmy Instance hosted for the community around Ascendance of a Bookworm",
+		"id": 19
+	}
+]

static/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

styles/Home.module.css

@@ -1,207 +0,0 @@
-.page {
-  width: 100%;
-  background-color: var(--black-0f);
-}
-
-.container {
-  padding: 0 2rem;
-}
-
-.main {
-  color: var(--def-blue);
-  min-height: 100vh;
-  padding: 1rem 0;
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  justify-content: flex-start;
-  align-items: center;
-}
-
-.navbar {
-  display: flex;
-  flex: 1;
-  padding: 2rem 0;
-  border-bottom: 1px solid var(--def-blue);
-  flex-wrap: nowrap;
-  justify-content: center;
-  align-items: center;
-
-}
-
-.navelem {
-  width: auto;
-  color: var(--def-blue);
-  margin: 0.2rem;
-  border: 1px solid;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-grow: 0.05;
-}
-
-.navelem:hover {
-  color: var(--def-orange);
-  background-color: var(--black-1e);
-}
-
-.navelem_active {
-  width: auto;
-  color: var(--def-orange);
-  margin: 0.2rem;
-  border: 1px solid;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-grow: 0.05;
-}
-
-.footer {
-  color: var(--def-blue);
-  display: flex;
-  flex: 1;
-  padding: 2rem 0;
-  border-top: 1px solid var(--def-blue);
-  justify-content: center;
-  align-items: center;
-}
-
-.footer a {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-grow: 1;
-}
-
-.title a {
-  color: var(--def-orange);
-  text-decoration: none;
-}
-
-.title a:hover,
-.title a:focus,
-.title a:active {
-  text-decoration: underline;
-}
-
-.title {
-  margin: 0;
-  line-height: 1.15;
-  font-size: 4rem;
-}
-
-.title,
-.description {
-  text-align: center;
-}
-
-.description {
-  margin: 4rem 0;
-  line-height: 1.5;
-  font-size: 1.5rem;
-}
-
-.code {
-  background: var(--black-1e);
-  border-radius: 5px;
-  padding: 0.75rem;
-  font-size: 1.1rem;
-  font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
-    Bitstream Vera Sans Mono, Courier New, monospace;
-}
-
-.grid {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-wrap: wrap;
-  max-width: 80%;
-}
-
-.contentoffline {
-  color: var(--def-red);
-}
-
-.contentonline {
-  color: var(--def-green);
-}
-
-.contentcard {
-  margin: 1rem;
-  padding: 1rem;
-  text-align: center;
-  color: inherit;
-  text-decoration: none;
-  border: 1px solid var(--black-2d);
-  border-radius: 10px;
-  border-color: var(--def-blue);
-  transition: color 0.15s ease, border-color 0.15s ease;
-  max-width: 300px;
-}
-
-.contentcardstatic {
-  margin: 1rem;
-  padding: 1rem;
-  text-align: center;
-  color: inherit;
-  text-decoration: none;
-  border: 1px solid var(--black-2d);
-  border-radius: 10px;
-  border-color: var(--def-blue);
-  transition: color 0.15s ease, border-color 0.15s ease;
-  max-width: 300px;
-}
-
-.contentcard:hover,
-.contentcard:focus,
-.contentcard:active {
-  color: var(--def-orange);
-  border-color: var(--def-orange);
-}
-
-.card {
-  margin: 1rem;
-  padding: 1.5rem;
-  text-align: left;
-  color: inherit;
-  text-decoration: none;
-  border: 1px solid var(--black-2d);
-  border-radius: 10px;
-  border-color: var(--def-blue);
-  transition: color 0.15s ease, border-color 0.15s ease;
-  max-width: 300px;
-}
-
-.card:hover,
-.card:focus,
-.card:active {
-  color: var(--def-orange);
-  border-color: var(--def-orange);
-}
-
-.card h2 {
-  margin: 0 0 1rem 0;
-  font-size: 1.5rem;
-}
-
-.card p {
-  margin: 0;
-  font-size: 1.25rem;
-  line-height: 1.5;
-}
-
-.cardwarn {
-  color: var(--def-orange);
-}
-
-.logo {
-  height: 1em;
-  margin-left: 0.5rem;
-}
-
-@media (max-width: 600px) {
-  .grid {
-    width: 100%;
-    flex-direction: column;
-  }
-}

styles/globals.css

@@ -1,27 +0,0 @@
-html,
-body {
-  padding: 0;
-  margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
-    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
-}
-
-:root {
-  --black-0f: #0f0f0f;
-  --black-1e: #1e1e1e;
-  --black-2d: #2d2d2d;
-
-  --def-blue: #00aaff;
-  --def-orange: #ff5300;
-  --def-red: #ff0000;
-  --def-green: #00ff00;
-}
-
-a {
-  color: inherit;
-  text-decoration: none;
-}
-
-* {
-  box-sizing: border-box;
-}

svelte.config.js

@@ -0,0 +1,26 @@
+import adapter from '@sveltejs/adapter-auto';
+import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
+import { readFileSync } from 'node:fs';
+import { fileURLToPath } from 'node:url';
+
+const path = fileURLToPath(new URL('package.json', import.meta.url));
+const pkg = JSON.parse(readFileSync(path, 'utf8'));
+
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
+	// Consult https://kit.svelte.dev/docs/integrations#preprocessors
+	// for more information about preprocessors
+	preprocess: [vitePreprocess({})],
+
+	kit: {
+		// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
+		// If your environment is not supported or you settled on a specific environment, switch out the adapter.
+		// See https://kit.svelte.dev/docs/adapters for more information about adapters.
+		adapter: adapter(),
+		version: {
+			name: pkg.version
+		}
+	}
+};
+
+export default config;

tailwind.config.js

@@ -0,0 +1,79 @@
+import { fontFamily } from "tailwindcss/defaultTheme";
+
+/** @type {import('tailwindcss').Config} */
+const config = {
+	darkMode: ["class"],
+	content: ["./src/**/*.{html,js,svelte,ts}"],
+  safelist: ["dark", "nordlys"],
+	theme: {
+		container: {
+			center: true,
+			padding: "2rem",
+			screens: {
+				"2xl": "1400px"
+			}
+		},
+		extend: {
+			colors: {
+				border: "hsl(var(--border) / <alpha-value>)",
+				input: "hsl(var(--input) / <alpha-value>)",
+				ring: "hsl(var(--ring) / <alpha-value>)",
+				background: "hsl(var(--background) / <alpha-value>)",
+				foreground: "hsl(var(--foreground) / <alpha-value>)",
+				primary: {
+					DEFAULT: "hsl(var(--primary) / <alpha-value>)",
+					foreground: "hsl(var(--primary-foreground) / <alpha-value>)"
+				},
+				secondary: {
+					DEFAULT: "hsl(var(--secondary) / <alpha-value>)",
+					foreground: "hsl(var(--secondary-foreground) / <alpha-value>)"
+				},
+				destructive: {
+					DEFAULT: "hsl(var(--destructive) / <alpha-value>)",
+					foreground: "hsl(var(--destructive-foreground) / <alpha-value>)"
+				},
+				muted: {
+					DEFAULT: "hsl(var(--muted) / <alpha-value>)",
+					foreground: "hsl(var(--muted-foreground) / <alpha-value>)"
+				},
+				accent: {
+					DEFAULT: "hsl(var(--accent) / <alpha-value>)",
+					foreground: "hsl(var(--accent-foreground) / <alpha-value>)"
+				},
+				popover: {
+					DEFAULT: "hsl(var(--popover) / <alpha-value>)",
+					foreground: "hsl(var(--popover-foreground) / <alpha-value>)"
+				},
+				card: {
+					DEFAULT: "hsl(var(--card) / <alpha-value>)",
+					foreground: "hsl(var(--card-foreground) / <alpha-value>)"
+				},
+				offline: {
+					DEFAULT: "hsl(var(--offline) / <alpha-value>)",
+				},
+				online: {
+					DEFAULT: "hsl(var(--online) / <alpha-value>)",
+				},
+				pending: {
+					DEFAULT: "hsl(var(--pending) / <alpha-value>)",
+				},
+				maintenance: {
+					DEFAULT: "hsl(var(--maintenance) / <alpha-value>)",
+				}
+			},
+			borderRadius: {
+				lg: "var(--radius)",
+				md: "calc(var(--radius) - 2px)",
+				sm: "calc(var(--radius) - 4px)"
+			},
+			fontFamily: {
+				sans: [...fontFamily.sans]
+			},
+			aspectRatio: {
+				'16/9': '16 / 9',
+			}
+		}
+	},
+};
+
+export default config;

tsconfig.json

@@ -1,30 +1,18 @@
 {
-  "compilerOptions": {
+	"extends": "./.svelte-kit/tsconfig.json",
-    "target": "es5",
+	"compilerOptions": {
-    "lib": [
+		"allowJs": true,
-      "dom",
+		"checkJs": true,
-      "dom.iterable",
+		"esModuleInterop": true,
-      "esnext"
+		"forceConsistentCasingInFileNames": true,
-    ],
+		"resolveJsonModule": true,
-    "allowJs": true,
+		"skipLibCheck": true,
-    "skipLibCheck": true,
+		"sourceMap": true,
-    "strict": true,
+		"strict": true,
-    "forceConsistentCasingInFileNames": true,
+		"moduleResolution": "bundler"
-    "noEmit": true,
+	}
-    "incremental": true,
+	// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
-    "esModuleInterop": true,
+	//
-    "module": "esnext",
+	// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
-    "moduleResolution": "nodenext",
+	// from the referenced tsconfig.json - TypeScript does not merge them in
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "jsx": "preserve"
-  },
-  "include": [
-    "next-env.d.ts",
-    "**/*.ts",
-    "**/*.tsx"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
 }

unlighthouse.config.ts

@@ -0,0 +1,13 @@
+export default {
+	site: 'http://localhost:8000',
+	ci: {
+		budget: {
+			performance: 60,
+			accessibility: 100,
+			'best-practices': 90,
+			seo: 90
+		},
+		buildStatic: true
+	},
+	urls: ['/', '/servers', '/services', '/about']
+};

vite.config.ts

@@ -0,0 +1,15 @@
+import { sveltekit } from '@sveltejs/kit/vite';
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+	plugins: [sveltekit()],
+	server: {
+		host: true,
+		port: 8000,
+	},
+	preview: {
+		host: true,
+		port: 8000,
+		allowedHosts: true,
+	}
+});