From 34e1387aa851448e8a7d72be7b447179c980596c Mon Sep 17 00:00:00 2001 From: AramJonghu Date: Fri, 31 Jul 2026 20:47:10 +0200 Subject: [PATCH] feat(contacts+css): minor css changes + contacts page --- frontend/src/App.css | 4 ++-- frontend/src/App.tsx | 5 +++++ frontend/src/content/about.md | 4 ++-- frontend/src/content/contact.md | 28 ++++++++++++++++++++++++++++ frontend/src/pages/Contact.tsx | 17 +++++++++++++++++ 5 files changed, 54 insertions(+), 4 deletions(-) create mode 100644 frontend/src/content/contact.md create mode 100644 frontend/src/pages/Contact.tsx diff --git a/frontend/src/App.css b/frontend/src/App.css index 812b628..95b3ee8 100644 --- a/frontend/src/App.css +++ b/frontend/src/App.css @@ -44,11 +44,11 @@ } .ui-btn { - @apply text-ctp-text border border-ctp-text rounded px-3 py-1 min-w-8 2xl:min-w-36 text-center cursor-pointer transition-colors; + @apply text-ctp-text text-sm border border-ctp-text rounded px-3 py-1 min-w-8 lg:min-w-26 text-center cursor-pointer transition-colors; } .theme-ui-btn { - @apply text-ctp-text border border-ctp-text rounded px-3 py-1 min-w-10 text-center cursor-pointer transition-colors; + @apply text-ctp-text text-3xl border border-ctp-text rounded px-3 py-1 min-w-10 text-center cursor-pointer transition-colors; } .ui-btn:hover { diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 7587deb..c43d840 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -4,6 +4,7 @@ import "./App.css"; import Layout from "./components/Layout"; import Home from "./pages/Home"; import Stream from "./pages/Stream"; +import Contact from "./pages/Contact" export default function App(): ReactElement { const path = window.location.pathname.toLowerCase(); @@ -13,5 +14,9 @@ export default function App(): ReactElement { content = ; } + if (path === "/contact") { + content = ; + } + return {content}; } diff --git a/frontend/src/content/about.md b/frontend/src/content/about.md index 69a3bfe..8272abf 100644 --- a/frontend/src/content/about.md +++ b/frontend/src/content/about.md @@ -27,7 +27,7 @@ A few notable projects I am interested in: ## Contact -You can contact me via **Email: aramjonghu@tutamail.com** and on **XMPP: aramjonghu@aramjonghu.dev**. +You can contact me via **XMPP: aramjonghu@aramjonghu.dev** and on **Email: aramjonghu@tutamail.com**. More info at [contact](/contact) page. ## Languages & Tools @@ -84,7 +84,7 @@ For my personal projects, I host them on my own Forgejo instance at https://git. > **Q:** Are you on LinkedIn? > -> **A:** No. I quit in 2025, understanding that LinkedIn has been a platform to curate a fake image in a race for relevance. It is also owned by Microsoft, which is another deterrent. In my eyes, it is slop. +> **A:** No. I quit in 2025, understanding that LinkedIn has been a platform to curate a fake image in a race for relevance. It is also owned by Microsoft, which is another deterrent. In my eyes, it is slop. Furthermore, most of these social platforms are made to spy and track people to make money rather than connect people. > **Q:** Why do you have no personal projects on GitHub? > diff --git a/frontend/src/content/contact.md b/frontend/src/content/contact.md new file mode 100644 index 0000000..4c56518 --- /dev/null +++ b/frontend/src/content/contact.md @@ -0,0 +1,28 @@ +Anyone is free to contact me for any reason. Below are ways to contact me. + +## XMPP + +You can reach me at **aramjongh@aramjonghu.dev**. + +My preferred way of contacting is via a [XMPP](https://xmpp.org/) client. It is a privacy focused standard and it is decentralized. No one owns XMPP. Look [here](https://xmpp.org/software/?category=clients) to determine which client options there are for your operating system (or browser). But generally: + +| Platform | Client | Offers server for login | +| ------------ | --------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------ | +| Linux | Dino | No | +| Windows | Converse.js (browser based), but I would recommend Movim in a browser. It seems that there is no solid option that supports calls on Windows. | Yes for both | +| Android/AOSP | Conversations (free in fdroid store) or Cheogram | Conversations has, Cheogram is a fork of Conversations | +| iOS | Monal IM or Siskin IM | Siskin does via tigase.im | +| MacOS | Monal IM or Converse.js for browser based | Conversejs does | +| Browser | Movim or Converse.js | Yes for both | + +Note that you can use any client even if they do not offer their own server for account creation. You can create an account on any provider such as conversejs.org. Then log in to your preferred client. + +## Email + +Not preferred, but you can contact me via email at **aramjonghu@tutamail.com**. + +## Other platforms + +### Some _obvious_ platforms e.g. LinkedIn + +For various reasons, I am not on a handful of the larger platforms. Check on the [home](/) page in the **About** section under the **Notable Questions** header if you wish to know why. diff --git a/frontend/src/pages/Contact.tsx b/frontend/src/pages/Contact.tsx new file mode 100644 index 0000000..d32281f --- /dev/null +++ b/frontend/src/pages/Contact.tsx @@ -0,0 +1,17 @@ +import { type ReactElement } from "react"; + +import MdProcessor from "../components/MdProcessor"; +import contact from "../content/contact.md?raw"; + +export default function CurrentActivity(): ReactElement { + return ( +
+
+

+ Contact +

+ +
+
+ ); +}