refactor: configure for myself

2024-09-19 21:13:17 +02:00 · 2023-04-01 11:21:00 +02:00 · 2023-04-01 11:21:00 +02:00 · ec167cd2ee
commit ec167cd2ee
parent 4790f284bf
20 changed files with 5515 additions and 14054 deletions
--- a/.gitignore
+++ b/.gitignore
@ -1,5 +1,4 @@
 # build output
-.vercel/
 dist/
 .output/

--- a/.prettierignore
+++ b/.prettierignore
@ -1,4 +1 @@
-dist
-node_modules
-.github
-.changeset
+dist/*
--- a/.prettierrc
+++ b/.prettierrc
@ -1,16 +0,0 @@
-{
-    "printWidth": 120,
-    "semi": true,
-    "singleQuote": true,
-    "tabWidth": 2,
-    "trailingComma": "es5",
-    "useTabs": true,
-    "overrides": [
-        {
-            "files": [".*", "*.json", "*.md", "*.toml", "*.yml"],
-            "options": {
-                "useTabs": false
-            }
-        }
-    ]
-}
--- a/.prettierrc.cjs
+++ b/.prettierrc.cjs
@ -0,0 +1,15 @@
+module.exports = {
+    plugins: [
+      require.resolve("prettier-plugin-astro"),
+      require.resolve("prettier-plugin-tailwindcss"),
+    ],
+    overrides: [
+      {
+        files: "*.astro",
+        options: {
+          parser: "astro",
+        },
+      },
+    ],
+  };
+  
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@ -0,0 +1,110 @@
+## <a name="commit"></a> Commit Message Format
+
+_This specification is inspired by and supersedes the [Brainclements commit message format](https://gist.github.com/brianclements/841ea7bffdb01346392c)._
+
+We have very precise rules over how our Git commit messages must be formatted.
+This format leads to **easier to read commit history**.
+
+Each commit message consists of a **header**, a **body**, and a **footer**.
+
+```
+<header>
+<BLANK LINE>
+<body>
+<BLANK LINE>
+<footer>
+```
+
+The `header` is mandatory and must conform to the [Commit Message Header](#commit-header) format.
+
+The `body` is mandatory for all commits except for those of type "docs".
+When the body is present it must be at least 20 characters long and must conform to the [Commit Message Body](#commit-body) format.
+
+The `footer` is optional. The [Commit Message Footer](#commit-footer) format describes what the footer is used for and the structure it must have.
+
+#### <a name="commit-header"></a>Commit Message Header
+
+```
+<type>(<scope>)(!?): <short summary>
+  │       │      │      │
+  │       │      │      └─⫸ Summary in present tense. Not capitalized. No period at the end.
+  │       │      │
+  │       │      └─⫸ Exclamation mark: breaking change
+  │       │
+  │       └─⫸ Commit Scope: layouts|components|pages
+  │
+  └─⫸ Commit Type: build|ci|docs|feat|fix|perf|refactor|test
+```
+
+The `<type>` and `<summary>` fields are mandatory, the `(<scope>)` field is optional.  
+Exclamation mark is optional too, but it's used to mark breaking changes.
+
+##### Type
+
+Must be one of the following:
+
+- **build**: Changes that affect the build system or external dependencies (example scopes: gulp, broccoli, npm)
+- **ci**: Changes to our CI configuration files and scripts (examples: CircleCi, SauceLabs)
+- **docs**: Documentation only changes
+- **feat**: A new feature
+- **fix**: A bug fix
+- **perf**: A code change that improves performance
+- **refactor**: A code change that neither fixes a bug nor adds a feature
+- **test**: Adding missing tests or correcting existing tests
+
+##### Scope
+
+The scope should be the name of the npm package affected (as perceived by the person reading the changelog generated from commit messages).
+
+The following is the list of supported scopes:
+
+- `layouts`
+- `components`
+- `pages`
+
+There are currently a few exceptions to the "use package name" rule:
+
+- none/empty string: useful for `test` and `refactor` changes that are done across all packages (e.g. `test: add missing unit tests`) and for docs changes that are not related to a specific package (e.g. `docs: fix typo in tutorial`).
+
+##### Summary
+
+Use the summary field to provide a succinct description of the change:
+
+- use the imperative, present tense: "change" not "changed" nor "changes"
+- don't capitalize the first letter
+- no dot (.) at the end
+
+#### <a name="commit-body"></a>Commit Message Body
+
+Just as in the summary, use the imperative, present tense: "fix" not "fixed" nor "fixes".
+
+Explain the motivation for the change in the commit message body. This commit message should explain _why_ you are making the change.
+You can include a comparison of the previous behavior with the new behavior in order to illustrate the impact of the change.
+
+#### <a name="commit-footer"></a>Commit Message Footer
+
+The footer is optional and is used for two purposes:
+
+- To reference issues that this commit closes
+- To include information that doesn't fit in the header or body, such as a link to a file or a suggestion to review a pull request
+
+The format for the footer is as follows:
+
+```
+Closes/Fixes #<issue number>
+```
+
+or
+
+```
+See pull request #<pull request number>
+```
+
+### Revert commits
+
+If the commit reverts a previous commit, it should begin with `revert: `, followed by the header of the reverted commit.
+
+The content of the commit message body should contain:
+
+- information about the SHA of the commit being reverted in the following format: `This reverts commit <SHA>`,
+- a clear description of the reason for reverting the commit message.
--- a/README.md
+++ b/README.md
@ -0,0 +1,35 @@
+<h1 align="center">
+  <br>
+  <img src="https://github.com/xHyroM/website/blob/main/src/assets/logo.png?raw=true" alt="Hyro" width="256">
+  <br>
+</h1>
+
+<h4 align="center">Source code for hyro's links website, simple and modern page.</h4>
+
+<p align="center">
+    <a href="https://discord.gg/kFPKmEKeMS/" alt="Discord">
+        <img src="https://img.shields.io/discord/1046534628577640528?label=discord&style=for-the-badge&color=2fbfc4"/>
+    </a>
+</p>
+
+## Setup
+
+1. Clone this repository: `git clone https://github.com/xHyroM/links.git`
+2. Navigate to the project directory: `cd links`
+3. Install the dependencies: `pnpm install`
+
+## Usage
+
+- To run the development server: `pnpm run dev`
+- To build the project for production: `pnpm run build`
+- To preview the production build: `pnpm run preview`
+
+## Contributing
+
+To contribute to this project, please follow the [standard Git workflow](https://git-scm.com/book/en/v2/Git-Basics-Getting-a-Git-Repository#The-Standard-Git-Workflow) and [CONTRIBUTING](./CONTRIBUTING.md).
+
+1. Fork this repository
+2. Create a new branch for your changes: `git checkout -b my-feature`
+3. Commit your changes: `git commit -am "Add my feature"`
+4. Push the branch: `git push origin my-feature`
+5. Open a pull request
--- a/astro.config.ts
+++ b/astro.config.ts
@ -1,39 +1,39 @@
-import { defineConfig } from 'astro/config';
+import { defineConfig } from "astro/config";

-import tailwind from '@astrojs/tailwind';
-import sitemap from '@astrojs/sitemap';
-import image from '@astrojs/image';
-import vercel from '@astrojs/vercel/static';
-import compress from 'astro-compress';
-import robotsTxt from 'astro-robots-txt';
+import tailwind from "@astrojs/tailwind";
+import sitemap from "@astrojs/sitemap";
+import image from "@astrojs/image";
+import vercel from "@astrojs/vercel/static";
+import compress from "astro-compress";
+import robotsTxt from "astro-robots-txt";

-import { SITE } from './src/config';
+import { SITE } from "./src/config";

 // https://astro.build/config
 export default defineConfig({
-	site: SITE.url,
-	base: '/',
-	trailingSlash: 'never',
-	output: 'static',
-	integrations: [
-		tailwind(),
-		sitemap(),
-		image(),
-		compress({
-			css: true,
-			html: true,
-			img: false,
-			js: true,
-			svg: false,
-		}),
-		robotsTxt({
-			policy: [
-				{
-					userAgent: '*',
-				},
-			],
-			sitemap: true,
-		}),
-	],
-	adapter: vercel(),
+  site: SITE.url,
+  base: "/",
+  trailingSlash: "never",
+  output: "static",
+  integrations: [
+    tailwind(),
+    sitemap(),
+    image(),
+    compress({
+      css: true,
+      html: true,
+      img: false,
+      js: true,
+      svg: false,
+    }),
+    robotsTxt({
+      policy: [
+        {
+          userAgent: "*",
+        },
+      ],
+      sitemap: true,
+    }),
+  ],
+  adapter: vercel(),
 });
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -11,17 +11,21 @@
    "astro": "astro"
  },
  "dependencies": {
-    "@astrojs/image": "^0.12.1",
-    "@astrojs/sitemap": "^1.0.0",
-    "@astrojs/tailwind": "^2.1.3",
+    "@astrojs/image": "^0.16.4",
+    "@astrojs/sitemap": "^1.2.1",
+    "@astrojs/tailwind": "^3.1.1",
    "@astrojs/vercel": "^2.4.0",
-    "astro": "^1.9.0",
-    "astro-compress": "^1.1.24",
+    "astro": "^2.1.9",
+    "astro-compress": "^1.1.35",
+    "astro-robots-txt": "^0.4.1",
    "autoprefixer": "^10.4.13",
    "cssnano": "^5.1.14",
+    "postcss": "^8.4.21",
    "tailwindcss": "^3.2.4"
  },
  "devDependencies": {
-    "astro-robots-txt": "^0.3.10"
+    "prettier": "^2.8.7",
+    "prettier-plugin-astro": "^0.8.0",
+    "prettier-plugin-tailwindcss": "^0.2.6"
  }
 }
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/public/og_image.png
+++ b/public/og_image.png
--- a/src/assets/images/logo.png
+++ b/src/assets/images/logo.png
--- a/src/components/HeadSEO.astro
+++ b/src/components/HeadSEO.astro
@ -1,6 +1,6 @@
 ---
-import { getImage } from '@astrojs/image';
-import { SITE, OPEN_GRAPH } from '../config';
+import { getImage } from "@astrojs/image";
+import { SITE, OPEN_GRAPH } from "../config";
 ---

 <!-- Primary Meta Tags -->
--- a/src/components/Item.astro
+++ b/src/components/Item.astro
@ -1,14 +1,14 @@
 ---
-import { BUTTONS } from '../config';
+import { BUTTONS } from "../config";
 ---

 {
-	BUTTONS.map((button) => (
-		<a
-			href={button.href}
-			class={`${button.background} w-full rounded-xl border-2 border-black py-4 text-center text-xl font-bold text-white drop-shadow-[4px_5px_0_rgba(0,0,0,1)] duration-75 hover:translate-y-1 hover:translate-x-1 hover:drop-shadow-none`}
-		>
-			{button.name}
-		</a>
-	))
+  BUTTONS.map((button) => (
+    <a
+      href={button.href}
+      class={`${button.background} w-full rounded-xl border-2 border-black py-4 text-center text-xl font-bold text-white drop-shadow-[4px_5px_0_rgba(0,0,0,1)] duration-75 hover:translate-x-1 hover:translate-y-1 hover:drop-shadow-none`}
+    >
+      {button.name}
+    </a>
+  ))
 }
--- a/src/components/Picture.astro
+++ b/src/components/Picture.astro
@ -1,7 +1,7 @@
 ---
-import { Image } from '@astrojs/image/components';
+import { Image } from "@astrojs/image/components";

-import logo from '../assets/images/logo.png';
+import logo from "../assets/images/logo.png";
 ---

-<Image src={logo} alt="Profilová Fotografia" class="rounded-full w-28" /><img />
+<Image src={logo} alt="profile foto" class="w-36" />
--- a/src/components/Username.astro
+++ b/src/components/Username.astro
@ -1,3 +1,3 @@
 <h1 class="mt-4 text-3xl font-bold text-black">
-	<span class="mr-1 text-[#0091FF]">@</span>oliminator
+  <span class="mr-1 text-[#0091FF]">@</span>xHyroM
 </h1>
--- a/src/config.ts
+++ b/src/config.ts
@ -1,49 +1,58 @@
 export const SITE = {
-	title: 'Oliminator Odkazy',
-	description: 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure, placeat!',
-	url: 'https://odkazy.oliminator.net',
-	themeColor: '#f9f9f1',
+  title: "Hyro's Links",
+  description:
+    "Hyro's Links is a website that contains links to my social media accounts and other useful links.",
+  url: "https://links.xhyrom.me",
+  themeColor: "#fbc119",
 };

 export const OPEN_GRAPH = {
-	image: {
-		src: 'og_image.png',
-		alt: 'Odkazy text s tlačítkami',
-	},
-	twitter: 'oliminator34',
+  image: {
+    src: "og_image.png",
+    alt: "just a picture with buttons",
+  },
+  twitter: "hyrousek",
 };

 export const BUTTONS = [
-	{
-		name: 'Môj Minecraft Server',
-		background: 'bg-lendmark hover:bg-lendmark/80',
-		href: 'https://go.oliminator.net/lendmark',
-	},
-	{
-		name: 'TikTok',
-		background: 'bg-tiktok hover:bg-tiktok/80',
-		href: 'https://go.oliminator.net/titok',
-	},
-	{
-		name: 'YouTube',
-		background: 'bg-youtube hover:bg-youtube/80',
-		href: 'https://go.oliminator.net/youtube',
-	},
-
-	{
-		name: 'Instagram',
-		background: 'bg-instagram hover:bg-instagram/80',
-		href: 'https://go.oliminator.net/instagram',
-	},
-	{
-		name: 'GitHub',
-		background: 'bg-github hover:bg-github/80',
-		href: 'https://go.oliminator.net/github',
-	},
-	{
-		name: 'Discord',
-		background: 'bg-discord hover:bg-discord/80',
-		href: 'https://discord.lendmark.sk/',
-	},
-	,
+  {
+    name: "Personal (GitHub)",
+    background: "bg-github hover:bg-github/80",
+    href: "https://github.com/xHyroM",
+  },
+  {
+    name: "Hyro Blobs (GitHub)",
+    background: "bg-github hover:bg-github/80",
+    href: "https://github.com/Hyro-Blobs/blobs",
+  },
+  {
+    name: "Hyro's Forks (GitHub)",
+    background: "bg-github hover:bg-github/80",
+    href: "https://github.com/xhyrom-forks",
+  },
+  {
+    name: "Discord",
+    background: "bg-discord hover:bg-discord/80",
+    href: "https://discord.gg/kFPKmEKeMS",
+  },
+  {
+    name: "Instagram",
+    background: "bg-instagram hover:bg-instagram/80",
+    href: "https://instagram.com/hyro.dev",
+  },
+  {
+    name: "Twitter",
+    background: "bg-twitter hover:bg-twitter/80",
+    href: "https://twitter.com/hyrousek",
+  },
+  {
+    name: "Chess",
+    background: "bg-chess hover:bg-chess/80",
+    href: "https://www.chess.com/member/Hyriik",
+  },
+  {
+    name: "Reddit",
+    background: "bg-reddit hover:bg-reddit/80",
+    href: "https://reddit.com/u/xHyroM",
+  },
 ];
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@ -1,15 +1,15 @@
 ---
-import HeadCommon from '../components/HeadCommon.astro';
-import HeadSEO from '../components/HeadSEO.astro';
+import HeadCommon from "../components/HeadCommon.astro";
+import HeadSEO from "../components/HeadSEO.astro";
 ---

 <!DOCTYPE html>
 <html dir="ltr" lang="sk-SK">
-	<head>
-		<HeadCommon />
-		<HeadSEO />
-	</head>
-	<body class="bg-primaryDotted bg-primaryDottedSize overflow-x-hidden">
-		<slot />
-	</body>
+  <head>
+    <HeadCommon />
+    <HeadSEO />
+  </head>
+  <body class="overflow-x-hidden bg-primaryDotted bg-primaryDottedSize">
+    <slot />
+  </body>
 </html>
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@ -1,18 +1,18 @@
 ---
-import Layout from '../layouts/Layout.astro';
-import Picture from '../components/Picture.astro';
-import Username from '../components/Username.astro';
-import Item from '../components/Item.astro';
+import Layout from "../layouts/Layout.astro";
+import Picture from "../components/Picture.astro";
+import Username from "../components/Username.astro";
+import Item from "../components/Item.astro";
 ---

 <Layout>
-	<main class="mx-auto w-max mb-12">
-		<header class="mt-12 flex flex-col items-center">
-			<Picture />
-			<Username />
-		</header>
-		<section class="mt-6 flex w-72 md:w-80 flex-col gap-y-6">
-			<Item />
-		</section>
-	</main>
+  <main class="mx-auto mb-12 w-max">
+    <header class="mt-12 flex flex-col items-center">
+      <Picture />
+      <Username />
+    </header>
+    <section class="mt-6 flex w-72 flex-col gap-y-6 md:w-80">
+      <Item />
+    </section>
+  </main>
 </Layout>
--- a/tailwind.config.cjs
+++ b/tailwind.config.cjs
@ -1,80 +1,76 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-	content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
-	theme: {
-		extend: {
-			colors: {
-				adobe: '#ff0000',
-				airbnb: '#fd5c63',
-				algolia: '#050f2c',
-				amazon: '#ff9900',
-				android: '#a4c639',
-				atlassian: '#003366',
-				behance: '#1769ff',
-				codepen: '#0ebeff',
-				dailymotion: '#00aaff',
-				tiktok: '#fe3f69',
-				deviantart: '#05cc47',
-				discord: '#5865F2',
-				dribbble: '#ea4c89',
-				dropbox: '#007ee5',
-				duolingo: '#7ac70c',
-				etsy: '#d5641c',
-				evernote: '#2dbe60',
-				facebook: '#3b5998',
-				feedly: '#2bb24c',
-				github: '#333',
-				gitlab: '#fc6d26',
-				google: '#4285f4',
-				instagram: '#e1306c',
-				linkedin: '#0077b5',
-				medium: '#00ab6c',
-				messenger: '#0084ff',
-				microsoft: '#f65314',
-				netflix: '#e50914',
-				pinterest: '#e60023',
-				pocket: '#ef4056',
-				react: '#00d8ff',
-				reddit: '#ff4500',
-				shopify: '#96bf48',
-				skype: '#00aff0',
-				slack: '#611f69',
-				snapchat: '#fffc00',
-				spotify: '#1db954',
-				stackoverflow: '#f48024',
-				stripe: '#6772e5',
-				telegram: '#0088cc',
-				trello: '#0079bf',
-				tumblr: '#35465c',
-				twitch: '#6441a5',
-				twitter: '#1da1f2',
-				uber: '#09091a',
-				ubuntu: '#dd4814',
-				vimeo: '#162221',
-				vue: '#42b883',
-				whatsapp: '#075e54',
-				wikipedia: '#000000',
-				youtube: '#ff0000',
-				lendmark: '#5e8949',
-				transparent: 'transparent',
-				current: 'currentColor',
-				black: '#000',
-				white: '#fff',
-				background: '#F9F9F1',
-				blue: '#44C3EC',
-			},
-			/*
-			fontFamily: {
-				default: ['Outfit', 'sans-serif'],
-			},
-			*/
-			backgroundImage: {
-				primaryDotted: 'radial-gradient(#E6E6D1 1px, #F9F9F1 1px)',
-			},
-			backgroundSize: {
-				primaryDottedSize: '15px 15px',
-			},
-		},
-	},
-	plugins: [],
+  content: ["./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}"],
+  theme: {
+    extend: {
+      colors: {
+        adobe: "#ff0000",
+        airbnb: "#fd5c63",
+        algolia: "#050f2c",
+        amazon: "#ff9900",
+        android: "#a4c639",
+        atlassian: "#003366",
+        behance: "#1769ff",
+        codepen: "#0ebeff",
+        dailymotion: "#00aaff",
+        tiktok: "#fe3f69",
+        deviantart: "#05cc47",
+        discord: "#5865F2",
+        dribbble: "#ea4c89",
+        dropbox: "#007ee5",
+        duolingo: "#7ac70c",
+        etsy: "#d5641c",
+        evernote: "#2dbe60",
+        facebook: "#3b5998",
+        feedly: "#2bb24c",
+        github: "#333",
+        gitlab: "#fc6d26",
+        google: "#4285f4",
+        instagram: "#e1306c",
+        linkedin: "#0077b5",
+        medium: "#00ab6c",
+        messenger: "#0084ff",
+        microsoft: "#f65314",
+        netflix: "#e50914",
+        pinterest: "#e60023",
+        pocket: "#ef4056",
+        react: "#00d8ff",
+        reddit: "#ff4500",
+        shopify: "#96bf48",
+        skype: "#00aff0",
+        slack: "#611f69",
+        snapchat: "#fffc00",
+        spotify: "#1db954",
+        stackoverflow: "#f48024",
+        stripe: "#6772e5",
+        telegram: "#0088cc",
+        trello: "#0079bf",
+        tumblr: "#35465c",
+        twitch: "#6441a5",
+        twitter: "#1da1f2",
+        uber: "#09091a",
+        ubuntu: "#dd4814",
+        vimeo: "#162221",
+        vue: "#42b883",
+        whatsapp: "#075e54",
+        wikipedia: "#000000",
+        youtube: "#ff0000",
+        // custom services
+        chess: "#5e8949",
+        // ^ custom services
+        transparent: "transparent",
+        current: "currentColor",
+        black: "#000",
+        white: "#fff",
+        blue: "#44C3EC",
+      },
+      backgroundImage: {
+        primaryDotted: "radial-gradient(#E6E6D1 1px, #F9F9F1 1px)",
+      },
+      backgroundSize: {
+        primaryDottedSize: "15px 15px",
+      },
+    },
+  },
+  plugins: [],
 };