From 09243a8351016f8b6a9259b0b1ee4a5d41507c87 Mon Sep 17 00:00:00 2001 From: Markus Scully Date: Tue, 29 Jul 2025 18:18:41 +0300 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=E2=99=BB=EF=B8=8F=F0=9F=92=84=20app,?= =?UTF-8?q?=20frontend,=20README:=20Update=20content,=20theme=20handling,?= =?UTF-8?q?=20and=20styles?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Added `Codeberg` link to contact page in `contact.rs` - Removed `Auto` theme option and set `Dark` as default in `theme_switcher` - Updated biography text and link formatting in `HomePage` component - Simplified theme CSS structure and adjusted color variables in `styles.css` - Removed outdated SHA256 warning and added `Cargo.toml` note in `README.md` --- README.md | 3 +- crates/app/src/contact.rs | 4 ++ crates/app/src/lib.rs | 7 +++- crates/app/src/theme_switcher.rs | 20 +++------- crates/frontend/assets/css/styles.css | 57 ++++++++++++++++----------- 5 files changed, 48 insertions(+), 43 deletions(-) diff --git a/README.md b/README.md index f0ee9ea..4432400 100644 --- a/README.md +++ b/README.md @@ -4,8 +4,6 @@ My personal website. Hosted at [mascully.com](https://mascully.com). The current Built using [Leptos](https://leptos.dev/) with [Axum](https://github.com/tokio-rs/axum). -This repo uses the SHA256 object format so it may be incompatible with a lot of tools. See [here](https://github.com/NixOS/nix/issues/11561) for instructions on using this repo with Nix. - ## Running ### Nix @@ -40,6 +38,7 @@ The bind address and port can be modifed in the top-level `Cargo.toml` file unde - `crates/frontend`: Images, fonts, CSS. - `crates/server`: A minimal Axum server for serving pages. - `flake.nix`: This doesn't work; ignore it. +- `Cargo.toml`: Includes metadata for configuring Leptos. ## License diff --git a/crates/app/src/contact.rs b/crates/app/src/contact.rs index d0b1782..841b47a 100644 --- a/crates/app/src/contact.rs +++ b/crates/app/src/contact.rs @@ -17,6 +17,10 @@ pub fn Contact() -> impl IntoView { "GitHub: " "mascully" +
+ "Codeberg: " + "mascully" +
"Matrix: " "@blue_flycatcher:matrix.org" diff --git a/crates/app/src/lib.rs b/crates/app/src/lib.rs index 307a0f9..397ed98 100644 --- a/crates/app/src/lib.rs +++ b/crates/app/src/lib.rs @@ -124,6 +124,7 @@ pub fn App() -> impl IntoView { #[component] fn Root(children: Children) -> impl IntoView { view! {
{children()}
} + // view! { {children()} } } #[component] @@ -134,9 +135,11 @@ fn NotFound() -> impl IntoView { #[component] fn HomePage() -> impl IntoView { view! { -

"Hi. I'm Markus. I mostly do full stack development with Rust and Nix."

+

"Hi. I'm Markus. I'm a software engineer currently doing mostly full stack development with Rust and Nix."

- "You can check out some of my projects ""here"" or on my ""Git forge"", including the " + "You can check out some of my projects ""here"" or on my " + "Git forge" + ", including the " "source code for this website" "." diff --git a/crates/app/src/theme_switcher.rs b/crates/app/src/theme_switcher.rs index 2d4ae53..b1a16ca 100644 --- a/crates/app/src/theme_switcher.rs +++ b/crates/app/src/theme_switcher.rs @@ -15,7 +15,6 @@ use crate::command_line::CommandLine; pub enum Theme { Light, Dark, - Auto, } impl Theme { @@ -23,7 +22,6 @@ impl Theme { match self { Theme::Light => "light", Theme::Dark => "dark", - Theme::Auto => "auto", } } @@ -31,7 +29,7 @@ impl Theme { match s { "light" => Theme::Light, "dark" => Theme::Dark, - _ => Theme::Auto, + _ => unreachable!() } } } @@ -44,12 +42,12 @@ fn get_stored_theme() -> Theme { { return Theme::from_str(&theme_str); } - Theme::Auto + Theme::Dark } #[cfg(not(feature = "hydrate"))] fn get_stored_theme() -> Theme { - Theme::Auto + Theme::Dark } #[cfg(feature = "hydrate")] @@ -81,7 +79,7 @@ fn apply_theme(theme: Theme) { Theme::Dark => { let _ = class_list.add_1("dark"); } - Theme::Auto => {} + Theme::Dark => {} } } } @@ -93,7 +91,7 @@ fn apply_theme(_theme: Theme) { #[component] pub fn ThemeSwitcher() -> impl IntoView { - let (current_theme, set_current_theme) = signal(Theme::Auto); + let (current_theme, set_current_theme) = signal(Theme::Dark); let (dropdown_open, set_dropdown_open) = signal(false); // Load theme from localStorage and apply it on client side only @@ -129,7 +127,6 @@ pub fn ThemeSwitcher() -> impl IntoView { let theme_icon = move || match current_theme.get() { Theme::Light => "☀️", Theme::Dark => "🌙", - Theme::Auto => "🌓", }; view! { @@ -152,13 +149,6 @@ pub fn ThemeSwitcher() -> impl IntoView { > "Dark" - } diff --git a/crates/frontend/assets/css/styles.css b/crates/frontend/assets/css/styles.css index a2ca3d7..6cd5aba 100644 --- a/crates/frontend/assets/css/styles.css +++ b/crates/frontend/assets/css/styles.css @@ -23,14 +23,21 @@ } :root { - --body-bg: oklch(15% 0.02 240); /* darker background */ - --main-bg: oklch(20% 0 0 / 0.7); /* more transparency */ + --navbar-opacity: 0.5; + --navbar-opacity-hover: 1; + --transition-time: 0.3s; +} + +:root, +:root.dark { + --body-bg: oklch(0.26 0.006 286); + --main-bg: oklch(0.26 0.006 286); --text-color: oklch(80% 0 0); - --link-color: oklch(70% 0.15 240); /* lighter blue for links */ - --link-hover-color: oklch(80% 0.15 240); /* blue */ - --border-color: oklch(40% 0 0); + --link-color: oklch(70% 0.15 240); + --link-hover-color: oklch(80% 0.15 240); + --border-color: oklch(25% 0 0); --post-description-color: oklch(60% 0 0); - --header-bg: oklch(15% 0.02 240); /* same as body background */ + --header-bg: oklch(0.24 0.008 285); --input-bg: oklch(25% 0 0); --button-bg: oklch(30% 0 0); --button-hover-bg: oklch(35% 0 0); @@ -39,22 +46,19 @@ } :root.light { - --navbar-opacity: 0.5; - --navbar-opacity-hover: 1; - --transition-time: 0.3s; - --body-bg: oklch(98% 0 0); /* white */ - --main-bg: oklch(100% 0 0 / 0.85); /* white with transparency */ - --text-color: oklch(0% 0 0); /* black */ - --link-color: oklch(50% 0.15 240); /* blue for links */ - --link-hover-color: oklch(60% 0.15 240); /* blue */ - --border-color: oklch(90% 0 0); + --body-bg: oklch(98% 0 0); + --main-bg: oklch(100% 0 0 / 0.85); + --text-color: oklch(0% 0 0); + --link-color: oklch(50% 0.15 240); + --link-hover-color: oklch(60% 0.15 240); + --border-color: oklch(80% 0 0); --post-description-color: oklch(60% 0 0); - --header-bg: oklch(98% 0 0); /* same as body background */ + --header-bg: oklch(98% 0 0); --input-bg: oklch(95% 0 0); --button-bg: oklch(90% 0 0); --button-hover-bg: oklch(85% 0 0); --bg-tile: url("/tile_1_light.png"); - --bg-color: oklch(100% 0 0); /* white background */ + --bg-color: oklch(100% 0 0); } * { @@ -65,7 +69,6 @@ body { background-color: var(--body-bg); - background-image: var(--bg-tile); background-repeat: repeat; color: var(--text-color); display: grid; @@ -151,10 +154,17 @@ a:hover { main { position: relative; z-index: 0; - background-color: var(--main-bg); + /*background-color: var(--main-bg);*/ backdrop-filter: blur(10px); - border: 1px solid var(--border-color); - padding: 2rem; + /*border: 1px solid var(--border-color);*/ + padding: 0rem 2rem; +} + +main { + & > h1, + & > h2 { + padding-bottom: 2rem; + } } h1, @@ -241,7 +251,6 @@ h6 { padding-bottom: 0.5rem; } -/* Header styling */ .site-header { position: relative; z-index: 1; @@ -251,7 +260,7 @@ h6 { padding: 1rem 2rem; background-color: var(--header-bg); backdrop-filter: blur(10px); - border-bottom: 1px solid var(--border-color); + border-bottom: 0.1rem solid var(--border-color); width: 100%; } @@ -268,7 +277,7 @@ h6 { .terminal-input::placeholder { color: var(--post-description-color); -} +} .theme-switcher { position: relative;