initial commit

pull/1/head
Andriy 2023-01-17 22:54:31 +02:00
commit cfd0a4656e
31 changed files with 2776 additions and 0 deletions

13
.eslintignore Normal file
View File

@ -0,0 +1,13 @@
.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

20
.eslintrc.cjs Normal file
View File

@ -0,0 +1,20 @@
module.exports = {
root: true,
parser: '@typescript-eslint/parser',
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'prettier'],
plugins: ['svelte3', '@typescript-eslint'],
ignorePatterns: ['*.cjs'],
overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }],
settings: {
'svelte3/typescript': () => require('typescript')
},
parserOptions: {
sourceType: 'module',
ecmaVersion: 2020
},
env: {
browser: true,
es2017: true,
node: true
}
};

10
.gitignore vendored Normal file
View File

@ -0,0 +1,10 @@
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example
vite.config.js.timestamp-*
vite.config.ts.timestamp-*

1
.npmrc Normal file
View File

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

13
.prettierignore Normal file
View File

@ -0,0 +1,13 @@
.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

9
.prettierrc Normal file
View File

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

38
README.md Normal file
View File

@ -0,0 +1,38 @@
# create-svelte
Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).
## Creating a project
If you're seeing this, you've probably already done this step. Congrats!
```bash
# create a new project in the current directory
npm create svelte@latest
# create a new project in my-app
npm create svelte@latest my-app
```
## Developing
Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
```bash
npm run dev
# or start the server and open the app in a new browser tab
npm run dev -- --open
```
## Building
To create a production version of your app:
```bash
npm run build
```
You can preview the production build with `npm run preview`.
> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.

42
package.json Normal file
View File

@ -0,0 +1,42 @@
{
"name": "m0e.space",
"version": "0.0.1",
"private": true,
"scripts": {
"dev": "vite dev",
"build": "vite build",
"preview": "vite preview",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"lint": "prettier --plugin-search-dir . --check . && eslint .",
"format": "prettier --plugin-search-dir . --write ."
},
"devDependencies": {
"@sveltejs/adapter-auto": "^1.0.0",
"@sveltejs/kit": "^1.0.0",
"@tailwindcss/typography": "^0.5.9",
"@types/marked": "^4.0.8",
"@types/md5": "^2.3.2",
"@typescript-eslint/eslint-plugin": "^5.45.0",
"@typescript-eslint/parser": "^5.45.0",
"autoprefixer": "^10.4.13",
"eslint": "^8.28.0",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-svelte3": "^4.0.0",
"postcss": "^8.4.21",
"prettier": "^2.8.0",
"prettier-plugin-svelte": "^2.8.1",
"svelte": "^3.54.0",
"svelte-check": "^2.9.2",
"tailwindcss": "^3.2.4",
"tslib": "^2.4.1",
"typescript": "^4.9.3",
"vite": "^4.0.0"
},
"type": "module",
"dependencies": {
"@sveltejs/adapter-node": "^1.1.0",
"marked": "^4.2.12",
"md5": "^2.3.0"
}
}

2172
pnpm-lock.yaml Normal file

File diff suppressed because it is too large Load Diff

6
postcss.config.cjs Normal file
View File

@ -0,0 +1,6 @@
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {}
}
};

44
src/app.css Normal file
View File

@ -0,0 +1,44 @@
@import url('https://fonts.googleapis.com/css2?family=Fira+Mono:wght@500&family=Martian+Mono:wght@500&display=swap');
@tailwind base;
@tailwind components;
@tailwind utilities;
/* html {
@apply h-full;
} */
body {
@apply bg-bg-900 flex items-center justify-center min-w-full min-h-screen bg-cover;
background-image: url('/bg.gif');
image-rendering: crisp-edges !important;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
backdrop-filter: brightness(50%);
}
* {
@apply text-text;
font-family: 'Martian Mono', monospace;
image-rendering: auto;
}
p {
@apply text-base;
}
a {
@apply text-accent;
}
.button {
box-shadow: 0px 0px 0px 1px rgba(var(--color-accent), 0.8);
}
.monospace {
@apply text-sm bg-stone-900 p-1 rounded-md;
}
ul {
@apply list-inside list-disc ml-3;
}

9
src/app.d.ts vendored Normal file
View File

@ -0,0 +1,9 @@
// See https://kit.svelte.dev/docs/types#app
// for information about these interfaces
// and what to do when importing types
declare namespace App {
// interface Error {}
// interface Locals {}
// interface PageData {}
// interface Platform {}
}

12
src/app.html Normal file
View File

@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>

View File

@ -0,0 +1,9 @@
<script lang="ts">
export let url: string;
</script>
<a
href={url}
class="border border-accent/60 hover:border-accent active:border-2 active:-my-0.5 p-3 px-5 select-none text-accent bg-card text-center mx-auto w-fit"
><slot /></a
>

View File

@ -0,0 +1,39 @@
<script lang="ts">
import md5 from 'md5';
export let name: string;
export let email: string;
export let description: string;
export let url: string | null = null;
export let fedi: string | null = null;
export let youtube: string | null = null;
const image = `http://www.gravatar.com/avatar/${md5(email)}`;
</script>
<div class="flex flex-row gap-4 items-center p-4">
<a href={url}><img class="w-16 h-16" src={image} alt="" /></a>
<div class="grow flex flex-col">
<p class="text-text font-title text-xl">{name}</p>
<p class="text-text/70 text-md break-words">{description}</p>
<div class="flex flex-row gap-2 text-sm">
{#if url}
<a
class="last:after:content-none after:content-['|'] after:ml-2 after:text-stone-800"
href={url}>Website</a
>
{/if}
{#if fedi}
<a
class="last:after:content-none after:content-['|'] after:ml-2 after:text-stone-800"
href={fedi}>Fediverse</a
>
{/if}
{#if youtube}
<a
class="last:after:content-none after:content-['|'] after:ml-2 after:text-stone-800"
href={youtube}>Youtube</a
>
{/if}
</div>
</div>
</div>

View File

@ -0,0 +1,20 @@
<script lang="ts">
export let title: string;
const anchorTitle = `#${title.trim().replaceAll(' ', '').toLocaleLowerCase()}`;
</script>
<div class="flex flex-col gap-1 mt-3">
<p class="text-2xl relative group font-bold text-text mb-2">
<h id={anchorTitle}>{title}</h>
<span
class="absolute top-0 w-6 transition-opacity opacity-0 ltr:-left-7 rtl:-right-7 not-prose group-hover:opacity-100 text-neutral-700"
><a
class="group-hover:text-primary-300"
style="text-decoration-line: none !important;"
href={anchorTitle}
aria-label="Гачок">#</a
></span
>
</p>
<slot />
</div>

View File

@ -0,0 +1,18 @@
<script ctx="module" lang="ts">
import { marked } from 'marked';
export let name: string;
export let description: string;
export let url: string;
description = marked(description.replaceAll('\n', '\n\n'));
</script>
<div class="flex flex-row gap-4 items-center p-4 border-b-2 border-b-accent/40 last:border-b-0">
<div class="grow flex flex-col">
<a class="text-accent font-title text-xl" href={url}>{name}</a>
<div
class="prose prose-sm prose-strong:font-bold prose-strong:text-text/90 prose-p:text-text/70 text-md break-words mt-1"
>
{@html description}
</div>
</div>
</div>

22
src/lib/data/hosted.json Normal file
View File

@ -0,0 +1,22 @@
[
{
"title": "Akkoma",
"description": "Ukrainian Akkoma instance",
"link": "https://pl.m0e.space"
},
{
"title": "Gitea",
"description": "Git repository hosting",
"link": "https://git.m0e.space"
},
{
"title": "Dendrite",
"description": "Matrix homeserver\nDendrite is a second-generation Matrix homeserver written in Go. ",
"link": "https://matrix.m0e.space"
},
{
"title": "Uptime Kuma",
"description": "Self-hosted monitoring tool",
"link": "https://st.m0e.space"
}
]

View File

@ -0,0 +1,12 @@
[
{
"title": "UAMonitor",
"description": "FOSS minecraft monitoring web service originally made for ukrainians\nIt pings all servers from DB every 10 minutes and writes results into DB (WIP autoremove)\nBackend was made using Fastify as framework and Prisma as ORM, Frontend was made using SvelteKit as framework and TailwindCSS.",
"link": "https://stats.m0e.space"
},
{
"title": "RPZ",
"description": "SMP Minecraft Server\nCurrent version: **Beta 1.7.3** with **Better Than Adventure** mod",
"link": "https://mc.m0e.space"
}
]

13
src/routes/+error.svelte Normal file
View File

@ -0,0 +1,13 @@
<script lang="ts">
//throw new Error("@migration task: Replace error load function (https://github.com/sveltejs/kit/discussions/5774#discussioncomment-3293209)");
import { page } from '$app/stores';
import Button from '$lib/components/Button.svelte';
</script>
<svelte:head>
<title>{$page.status}</title>
</svelte:head>
<p class="text-accent text-center text-5xl my-5">{$page.status}</p>
<Button url="/">Back to home</Button>

40
src/routes/+layout.svelte Normal file
View File

@ -0,0 +1,40 @@
<script>
import '../app.css';
const splashes = [
'no life since 1980 - 1jem',
'also try fediverse - qugalet',
'Усе тільки починається - Ternox'
];
const splash = splashes[Math.floor(Math.random() * splashes.length)];
</script>
<div
class="bg-black bg-opacity-80 border-accent border p-4 sm:max-w-xl sm:min-h-0 min-h-screen flex flex-col gap-2"
>
<slot />
<div class="border-t-2 border-t-accent/40">
<p
class="text-green text-center text-lg text-green-600 mt-3 font-bold"
style="font-family: 'Fira Mono', monospace !important;"
>
&gt; {splash}
</p>
<div class="flex flex-row gap-2 justify-center items-center">
<p
class="text-text/60 text-sm last:after:content-none after:content-['|'] after:ml-2 after:text-stone-800"
>
&copy; qugalet 2022-2023
</p>
<a
class="text-text/80 text-sm last:after:content-none after:content-['|'] after:ml-2 after:text-stone-800"
href="/">Home</a
>
<a
class="text-text/80 text-sm last:after:content-none after:content-['|'] after:ml-2 after:text-stone-800"
href="https://st.m0e.space/status/m0espace"
target="_blank"
rel="noreferrer">Uptime</a
>
</div>
</div>
</div>

20
src/routes/+page.svelte Normal file
View File

@ -0,0 +1,20 @@
<script lang="ts">
import Button from '$lib/components/Button.svelte';
</script>
<svelte:head>
<title>guest@m0e.space ~/</title>
<meta property="og:title" content="m0e.space" />
</svelte:head>
<img class="h-56 mx-auto block" src="/favicon.png" alt="m0e.space logo" />
<h1 class="text-center text-3xl">m0e.space</h1>
<p class="text-md text-stone-400 text-center">
Open Source services for cuties, who loves anime and tech from Ukraine!
</p>
<div class="flex flex-row gap-4 mt-3 justify-center items-center mb-4">
<Button url="/about">About</Button>
<Button url="/projects">Projects</Button>
<Button url="/hosted">Hosted</Button>
</div>

View File

@ -0,0 +1,83 @@
<script lang="ts">
import Member from '$lib/components/Member.svelte';
import Paragraph from '$lib/components/Paragraph.svelte';
</script>
<svelte:head>
<title>guest@m0e.space ~/about</title>
<meta property="og:title" content="guest@m0e.space ~/about" />
</svelte:head>
<h1 class="text-center text-3xl mt-2">About</h1>
<Paragraph title="Who we are?">
<p>We are tech cuties from Ukraine, who love Open Source Software and hating russians</p>
<p>We provide self-hosted and our own services for our members.</p>
</Paragraph>
<Paragraph title="Our languages">
<p>Our languages are Ukrainian and English.</p>
<p>Russian language is not allowed.</p>
</Paragraph>
<Paragraph title="How to join">
<p>
You can sign up Fediverse account on our <a href="https://pl.m0e.space">Akkoma</a> instance.
After that, you can message <a href="https://pl.m0e.space/qugalet">qugalet</a> for more info and
grating you access for more services.
</p>
</Paragraph>
<Paragraph title="Contact">
<p class="text-lg">You can contact admin using:</p>
<ul>
<li>
Email: <span class="monospace">admin(meow)m0e.space</span>
</li>
<li>
Matrix: <span class="monospace">(meow)qugalet:m0e.space</span>
</li>
<li><a href="https://pl.m0e.space/qugalet">Fediverse</a></li>
<li><a href="https://t.me/Andrmist">Telegram</a></li>
</ul>
</Paragraph>
<Paragraph title="Donate">
<p class="text-lg">You can help us financially:</p>
<ul>
<li>
My credit cards:
<ul class="list-decimal">
<li><span class="monospace">5375 4114 1585 7825</span> Monobank (MasterCard)</li>
<li><span class="monospace">5168 7559 0529 7772</span> PrivatBank (MasterCard)</li>
</ul>
</li>
<li>
<a href="https://send.monobank.ua/jar/8qpC6WMUHT">Monobank jar</a>
</li>
<li>We don't have crypto wallets but if you want it, please contact admin.</li>
</ul>
</Paragraph>
<Paragraph title="Members">
<Member
name="Qugalet"
email="qugalet@m0e.space"
description="Server owner and system administrator"
url="https://quga.m0e.space"
fedi="https://pl.m0e.space/qugalet"
/>
<Member
name="Ternox"
email="me@ternoxgames.com"
description="Indie game developer"
url="https://ternox.com/"
fedi="https://pl.m0e.space/trnx"
/>
<Member
name="1jem"
email="bjnu@protonmail.com"
description="average donetsk children"
fedi="https://pl.m0e.space/1jem"
/>
</Paragraph>

View File

@ -0,0 +1,16 @@
<script lang="ts">
import Project from '$lib/components/Project.svelte';
import hosted from '$lib/data/hosted.json';
</script>
<svelte:head>
<title>guest@m0e.space ~/hosted</title>
<meta property="og:title" content="Projects" />
</svelte:head>
<h1 class="text-center text-3xl mt-2">Hosted</h1>
<div>
{#each hosted as project}
<Project name={project.title} description={project.description} url={project.link} />
{/each}
</div>

View File

@ -0,0 +1,16 @@
<script lang="ts">
import Project from '$lib/components/Project.svelte';
import projects from '$lib/data/projects.json';
</script>
<svelte:head>
<title>guest@m0e.space ~/projects</title>
<meta property="og:title" content="Projects" />
</svelte:head>
<h1 class="text-center text-3xl mt-2">Projects</h1>
<div>
{#each projects as project}
<Project name={project.title} description={project.description} url={project.link} />
{/each}
</div>

BIN
static/bg.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 65 KiB

BIN
static/favicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 229 KiB

15
svelte.config.js Normal file
View File

@ -0,0 +1,15 @@
import adapter from '@sveltejs/adapter-node';
import { vitePreprocess } from '@sveltejs/kit/vite';
/** @type {import('@sveltejs/kit').Config} */
const config = {
// Consult https://kit.svelte.dev/docs/integrations#preprocessors
// for more information about preprocessors
preprocess: vitePreprocess(),
kit: {
adapter: adapter()
}
};
export default config;

39
tailwind.config.cjs Normal file
View File

@ -0,0 +1,39 @@
const colors = require('tailwindcss/colors');
/** @type {import('tailwindcss').Config} */
module.exports = {
content: ['./src/**/*.{html,js,svelte,ts}'],
theme: {
extend: {
colors: {
text: '#c1b492',
accent: '#d2738a',
card: '#1a1a1a',
bg: colors.zinc
}
}
},
plugins: [
function ({ addBase, theme }) {
function extractColorVars(colorObj, colorGroup = '') {
return Object.keys(colorObj).reduce((vars, colorKey) => {
const value = colorObj[colorKey];
const cssVariable =
colorKey === 'DEFAULT' ? `--color${colorGroup}` : `--color${colorGroup}-${colorKey}`;
const newVars =
typeof value === 'string'
? { [cssVariable]: value }
: extractColorVars(value, `-${colorKey}`);
return { ...vars, ...newVars };
}, {});
}
addBase({
':root': extractColorVars(theme('colors'))
});
},
require('@tailwindcss/typography')
]
};

17
tsconfig.json Normal file
View File

@ -0,0 +1,17 @@
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true
}
// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
//
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
// from the referenced tsconfig.json - TypeScript does not merge them in
}

8
vite.config.ts Normal file
View File

@ -0,0 +1,8 @@
import { sveltekit } from '@sveltejs/kit/vite';
import type { UserConfig } from 'vite';
const config: UserConfig = {
plugins: [sveltekit()]
};
export default config;