ob/ob248.com
1
0
Fork 0
mirror of https://github.com/hex248/ob248.com.git synced 2026-02-07 18:23:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

colour fixes

Browse Source
This commit is contained in:
Oliver Bryan
2026-02-05 14:00:14 +00:00
parent bbb0a8a1fb
commit 0b8bf179cd
15 changed files with 42 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/ProjectListItem.tsx
View File

@@ -1,6 +1,6 @@
import { Link } from "react-router-dom";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import type { ProjectMetadata } from "@/projects"; import type { ProjectMetadata } from "@/projects";
import { Link } from "react-router-dom";
export function ProjectListItem({ export function ProjectListItem({
metadata, metadata,
@@ -16,10 +16,8 @@ export function ProjectListItem({
<Link <Link
to={`/projects/${metadata.slug}`} to={`/projects/${metadata.slug}`}
className={cn( className={cn(
"group block flex flex-col justify-between rounded-md transition-colors duration-200 border-2 hover:border-accent", "group block flex flex-col justify-between transition-colors duration-200 border-2 hover:border-accent",
isDevMode && metadata.hidden isDevMode && metadata.hidden && "border-dashed border-accent",
? "border-dashed border-accent"
: "border-gutter-dim",
)} )}
data-tags={tags.join(",")} data-tags={tags.join(",")}
> >
@@ -32,7 +30,7 @@ export function ProjectListItem({
className="w-full h-full object-cover rounded" className="w-full h-full object-cover rounded"
/> />
) : ( ) : (
<div className="w-full h-full border border-gutter rounded" /> <div className="w-full h-full border rounded" />
)} )}
</div> </div>
<div className="flex flex-col gap-2"> <div className="flex flex-col gap-2">
@@ -45,7 +43,7 @@ export function ProjectListItem({
{tags.map((tag) => ( {tags.map((tag) => (
<span <span
key={tag} key={tag}
className="flex items-center text-fg font-500 rounded-md border border-gutter px-1.5 py-0.5" className="flex items-center text-fg font-500 rounded-sm border px-1.5 py-0.5"
> >
{tag} {tag}
</span> </span>
@@ -55,9 +53,7 @@ export function ProjectListItem({
</div> </div>
</div> </div>
<div className="w-full flex justify-end p-2 pt-1"> <div className="w-full flex justify-end p-2 pt-1">
<p className="text-xs text-gutter group-hover:text-accent"> <p className="text-xs group-hover:text-accent">{metadata.date}</p>
{metadata.date}
</p>
</div> </div>
</Link> </Link>
); );

2
src/components/theme-toggle.tsx
View File

@@ -1,6 +1,6 @@
import { Moon, Sun } from "@nsmr/pixelart-react";
import { useTheme } from "@/components/theme-provider"; import { useTheme } from "@/components/theme-provider";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Moon, Sun } from "@nsmr/pixelart-react";
export function ThemeToggle() { export function ThemeToggle() {
const { resolvedTheme, setTheme } = useTheme(); const { resolvedTheme, setTheme } = useTheme();

2
src/index.css
View File

@@ -20,7 +20,7 @@
--primary-foreground: #f6efe3; --primary-foreground: #f6efe3;
--secondary: #e5dccb; --secondary: #e5dccb;
--secondary-foreground: #3a3329; --secondary-foreground: #3a3329;
--muted: #e0d7c7; --muted: #dbd0bd;
--muted-foreground: #6e6457; --muted-foreground: #6e6457;
--accent: #df7126; --accent: #df7126;
--accent-foreground: #5f361b; --accent-foreground: #5f361b;

4
src/projects/factor-e/index.tsx
View File

@@ -42,7 +42,7 @@ export function FactorEProject() {
</p> </p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="bg-highlight p-4 rounded mt-4"> <div className="bg-muted p-4 rounded mt-4">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Key features Key features
</h2> </h2>
@@ -59,7 +59,7 @@ export function FactorEProject() {
</ul> </ul>
</div> </div>
<div className="bg-highlight p-4 rounded mt-4"> <div className="bg-muted p-4 rounded mt-4">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Technologies Technologies
</h2> </h2>

4
src/projects/flackie/index.tsx
View File

@@ -34,7 +34,7 @@ export function FlackieProject() {
</p> </p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="bg-highlight p-4 rounded mt-4"> <div className="bg-muted p-4 rounded mt-4">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Key features Key features
</h2> </h2>
@@ -47,7 +47,7 @@ export function FlackieProject() {
</ul> </ul>
</div> </div>
<div className="bg-highlight p-4 rounded mt-4"> <div className="bg-muted p-4 rounded mt-4">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Technologies Technologies
</h2> </h2>

4
src/projects/glimpse/index.tsx
View File

@@ -34,7 +34,7 @@ export function GlimpseProject() {
enable push notifications for new posts, comments, and friend requests. enable push notifications for new posts, comments, and friend requests.
</p> </p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="bg-highlight p-4 rounded"> <div className="bg-muted p-4 rounded">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Key features Key features
</h2> </h2>
@@ -48,7 +48,7 @@ export function GlimpseProject() {
</ul> </ul>
</div> </div>
<div className="bg-highlight p-4 rounded"> <div className="bg-muted p-4 rounded">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Technologies Technologies
</h2> </h2>

6
src/projects/good-morning/index.tsx
View File

@@ -8,7 +8,7 @@ export const metadata = {
date: "October 2025", date: "October 2025",
slug: "good-morning", slug: "good-morning",
image: "/good-morning-icon.png", image: "/good-morning-icon.png",
url: "https://gm.ob248.com", // url: "https://gm.ob248.com",
github: "https://github.com/hex248/good-morning", github: "https://github.com/hex248/good-morning",
hidden: false, hidden: false,
tags: [ tags: [
@@ -38,7 +38,7 @@ export function GoodMorningProject() {
</p> </p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="bg-highlight p-4 rounded mt-4"> <div className="bg-muted p-4 rounded mt-4">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Key features Key features
</h2> </h2>
@@ -49,7 +49,7 @@ export function GoodMorningProject() {
</ul> </ul>
</div> </div>
<div className="bg-highlight p-4 rounded mt-4"> <div className="bg-muted p-4 rounded mt-4">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Technologies Technologies
</h2> </h2>

2
src/projects/mizu/index.tsx
View File

@@ -34,7 +34,7 @@ export function MizuProject() {
</p> </p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="bg-highlight p-4 rounded mt-4"> <div className="bg-muted p-4 rounded mt-4">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Technologies Technologies
</h2> </h2>

4
src/projects/prayerbud/index.tsx
View File

@@ -33,7 +33,7 @@ export function PrayerbudProject() {
</div> </div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="bg-highlight p-4 rounded"> <div className="bg-muted p-4 rounded">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Key features Key features
</h2> </h2>
@@ -46,7 +46,7 @@ export function PrayerbudProject() {
</ul> </ul>
</div> </div>
<div className="bg-highlight p-4 rounded"> <div className="bg-muted p-4 rounded">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Technologies Technologies
</h2> </h2>

6
src/projects/shared/Demo.tsx
View File

@@ -1,5 +1,5 @@
import { cn } from "@/lib/utils";
import type { ReactNode } from "react"; import type { ReactNode } from "react";
import { cn } from "@/lib/utils";
type DemoProps = { type DemoProps = {
image: string; image: string;
@@ -13,7 +13,7 @@ export function Demo({ image, title, type = "plain", children }: DemoProps) {
<figure <figure
className={cn( className={cn(
"w-full", "w-full",
type === "boxed" && "border border-gutter rounded bg-highlight p-2", type === "boxed" && "border rounded bg-muted p-2",
)} )}
> >
<img <img
@@ -21,7 +21,7 @@ export function Demo({ image, title, type = "plain", children }: DemoProps) {
alt={title} alt={title}
className={cn("w-full", type === "boxed" ? "rounded" : "rounded-md")} className={cn("w-full", type === "boxed" ? "rounded" : "rounded-md")}
/> />
<figcaption className="mt-2 text-sm text-gutter text-pretty"> <figcaption className="mt-2 text-sm text-pretty">
{title} {title}
{children} {children}
</figcaption> </figcaption>

17
src/projects/shared/ProjectPage.tsx
View File

@@ -1,5 +1,6 @@
import type { ProjectMetadata } from "@/projects";
import type { ReactNode } from "react"; import type { ReactNode } from "react";
import { Link } from "react-router-dom";
import type { ProjectMetadata } from "@/projects";
type ProjectPageProps = { type ProjectPageProps = {
metadata: ProjectMetadata; metadata: ProjectMetadata;
@@ -11,6 +12,12 @@ export function ProjectPage({ metadata, children }: ProjectPageProps) {
return ( return (
<div className="mx-auto w-full max-w-4xl px-6 py-10 text-md"> <div className="mx-auto w-full max-w-4xl px-6 py-10 text-md">
<Link
to="/"
className="inline-flex items-center text-sm text-green-500 hover:underline mb-4"
>
Home
</Link>
<div className="flex flex-wrap items-start justify-between gap-6 mb-4"> <div className="flex flex-wrap items-start justify-between gap-6 mb-4">
<div className="flex flex-col gap-2"> <div className="flex flex-col gap-2">
<h1 className="text-2xl text-accent text-balance"> <h1 className="text-2xl text-accent text-balance">
@@ -23,7 +30,7 @@ export function ProjectPage({ metadata, children }: ProjectPageProps) {
className="w-24 h-24 rounded mb-2" className="w-24 h-24 rounded mb-2"
/> />
) : ( ) : (
<div className="w-24 h-24 mb-2 border border-gutter rounded" /> <div className="w-24 h-24 mb-2 border rounded" />
)} )}
</div> </div>
<div className="flex flex-col items-end gap-2"> <div className="flex flex-col items-end gap-2">
@@ -40,7 +47,7 @@ export function ProjectPage({ metadata, children }: ProjectPageProps) {
</div> </div>
</div> </div>
<p className="text-sm text-gutter mb-2"> <p className="text-sm mb-2">
{metadata.date} {metadata.date}
{metadata.github ? ( {metadata.github ? (
<> <>
@@ -63,7 +70,7 @@ export function ProjectPage({ metadata, children }: ProjectPageProps) {
{tags.map((tag: string) => ( {tags.map((tag: string) => (
<span <span
key={tag} key={tag}
className="flex items-center text-gutter font-500 rounded-md border border-gutter px-1.5 py-1" className="flex items-center font-500 rounded-sm border px-1.5 py-1"
> >
{tag} {tag}
</span> </span>
@@ -73,7 +80,7 @@ export function ProjectPage({ metadata, children }: ProjectPageProps) {
<div className="text-pretty">{children}</div> <div className="text-pretty">{children}</div>
<p className="text-center text-md text-gutter mt-8 mb-4"> <p className="text-center text-md mt-8 mb-4">
Oliver Bryan - {metadata.date} Oliver Bryan - {metadata.date}
{metadata.github ? ( {metadata.github ? (
<> <>

2
src/projects/shleep/index.tsx
View File

@@ -22,7 +22,7 @@ export function ShleepProject() {
help aid you and your party to protect a sleeping child from nightmares. help aid you and your party to protect a sleeping child from nightmares.
</p> </p>
<div className="bg-highlight p-4 rounded mt-4"> <div className="bg-muted p-4 rounded mt-4">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Technologies Technologies
</h2> </h2>

4
src/projects/sprint/index.tsx
View File

@@ -36,7 +36,7 @@ export function SprintProject() {
</p> </p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="bg-highlight p-4 rounded"> <div className="bg-muted p-4 rounded">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Key features Key features
</h2> </h2>
@@ -54,7 +54,7 @@ export function SprintProject() {
</ul> </ul>
</div> </div>
<div className="bg-highlight p-4 rounded"> <div className="bg-muted p-4 rounded">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Technologies Technologies
</h2> </h2>

4
src/projects/watercooler/index.tsx
View File

@@ -28,7 +28,7 @@ export function WatercoolerProject() {
<p className="text-pretty">watercooler description here</p> <p className="text-pretty">watercooler description here</p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="bg-highlight p-4 rounded mt-4"> <div className="bg-muted p-4 rounded mt-4">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Key features Key features
</h2> </h2>
@@ -40,7 +40,7 @@ export function WatercoolerProject() {
</ul> </ul>
</div> </div>
<div className="bg-highlight p-4 rounded mt-4"> <div className="bg-muted p-4 rounded mt-4">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Technologies Technologies
</h2> </h2>

4
src/projects/wiskatron/index.tsx
View File

@@ -22,7 +22,7 @@ export function WiskatronProject() {
</p> </p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4"> <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="bg-highlight p-4 rounded"> <div className="bg-muted p-4 rounded">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Key features Key features
</h2> </h2>
@@ -34,7 +34,7 @@ export function WiskatronProject() {
</ul> </ul>
</div> </div>
<div className="bg-highlight p-4 rounded"> <div className="bg-muted p-4 rounded">
<h2 className="text-lg text-green-500 mb-2 text-balance"> <h2 className="text-lg text-green-500 mb-2 text-balance">
Technologies Technologies
</h2> </h2>