Skip to content

Commit

Permalink
static site for github pages...in progress
Browse files Browse the repository at this point in the history
  • Loading branch information
k8port committed Jan 25, 2025
1 parent 84b50e6 commit 020dc6d
Show file tree
Hide file tree
Showing 24 changed files with 477 additions and 396 deletions.
3 changes: 1 addition & 2 deletions app/layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import "./styles/globals.css";
import Header from "./ui/Header";
import Footer from "./ui/Footer";
import Head from "next/head";
import { SpeedInsights } from '@vercel/speed-insights/next';

import {
cormorantGaramond,
robotoMono,
Expand Down Expand Up @@ -56,7 +56,6 @@ export default function RootLayout({
{children}
</main>
<Footer className="footer-dynamic" />
<SpeedInsights />
</div>
</body>
</html>
Expand Down
11 changes: 11 additions & 0 deletions app/lib/getContent.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@

import fs from 'fs';
import path from 'path';
import { ContentJson } from './types';


export async function getContent(): Promise<ContentJson> {
const jsonPath = path.join(process.cwd(), "app", "data", "content.json");
const jsonContent = fs.readFileSync(jsonPath, "utf8");
return JSON.parse(jsonContent) as ContentJson;
}
14 changes: 14 additions & 0 deletions app/lib/imageLoader.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
export default function imageLoader({
src,
width,
quality,
}: {
src: string
width: number
quality?: number
}) {
const params = ['f_auto', 'c_limit', `w_${width}`, `q_${quality || 'auto'}`]
return `https://res.cloudinary.com/demo/image/upload/${params.join(
','
)}${src}`
}
23 changes: 23 additions & 0 deletions app/lib/skillUtills.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
// import { DreyfusLevel, Subtopic, SubtopicBlock } from './types';


// export function isSubtopicBlock(item: Subtopic | SubtopicBlock): item is SubtopicBlock {
// return (item as SubtopicBlock).iconList !== undefined;
// }


// /**
// * Converts string to DreyfusLevel enum
// * If input invalid, returns undefined
// */
// export function drefusLevelFromString(levelStr?: string): DreyfusLevel | undefined {
// if (!levelStr) return undefined;

// const enumKeys = Object.keys(DreyfusLevel).filter(k => isNaN(Number(k)));
// const matchedKey = enumKeys.find(key => key.toLowerCase() === levelStr.toLowerCase());
// if (!matchedKey) return undefined;

// const numericValue = DreyfusLevel[matchedKey as keyof typeof DreyfusLevel];
// return typeof numericValue === 'number' ? numericValue : undefined;
// }

31 changes: 0 additions & 31 deletions app/lib/utils.ts

This file was deleted.

15 changes: 3 additions & 12 deletions app/page.tsx
Original file line number Diff line number Diff line change
@@ -1,31 +1,22 @@
import AboutMe from "./ui/AboutMe";
// import SkillsPanel from "./ui/Skills/SkillsPanel";
import Projects from "./ui/Projects";
import Logo from "./ui/Logo";
import { getContent } from "./lib/utils";
import InterimSkillsPanel from "./ui/skills/InterimSkillsPanel";


export default async function HomePage() {
const content = await getContent();
const branding = content.sections.branding;
// const competencies = content.sections.skillsPanel;
const bio = content.sections.aboutMe;

return (
<>
{/* Logo (Top-left on Desktop, first section on Mobile) */}
<div className="col-span-6 ">
<div className="pt-12">
<Logo logo={branding} className="relative flex flex-col max-w-4xl mx-auto p-6 bg-pistachio/65 rounded-lg shadow-lg subtopic-text items center gap-4 w-full" />
<Logo className="relative flex flex-col max-w-4xl mx-auto p-6 bg-pistachio/65 rounded-lg shadow-lg subtopic-text items center gap-4 w-full" />
</div>
</div>
<div className="col-span-6">
<div className="flex justify-center items-start p-4">
<AboutMe
label={bio.label}
content={bio.content}
className="max-w-[200px] my-8"
/>
<AboutMe className="max-w-[200px] my-8" />
</div>
</div>

Expand Down
40 changes: 20 additions & 20 deletions app/state/hooks.ts
Original file line number Diff line number Diff line change
@@ -1,26 +1,26 @@
'use client';
// 'use client';

import { useState } from 'react';
// import { useState } from 'react';

export function useCarousel(totalSlides: number, initialIndex: number = 0) {
const [currentIndex, setCurrentIndex] = useState(initialIndex);
// export function useCarousel(totalSlides: number, initialIndex: number = 0) {
// const [currentIndex, setCurrentIndex] = useState(initialIndex);

const handlePrev = () => {
setCurrentIndex((prevIndex) =>
prevIndex === 0 ? totalSlides - 1 : prevIndex - 1
);
};
// const handlePrev = () => {
// setCurrentIndex((prevIndex) =>
// prevIndex === 0 ? totalSlides - 1 : prevIndex - 1
// );
// };

const handleNext = () => {
setCurrentIndex((prevIndex) =>
prevIndex === totalSlides - 1 ? 0 : prevIndex + 1
);
};
// const handleNext = () => {
// setCurrentIndex((prevIndex) =>
// prevIndex === totalSlides - 1 ? 0 : prevIndex + 1
// );
// };

return {
currentIndex,
handlePrev,
handleNext,
};
}
// return {
// currentIndex,
// handlePrev,
// handleNext,
// };
// }

2 changes: 1 addition & 1 deletion app/styles/globals.css
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@

body {
@apply text-black font-sans m-0 p-0;
background-image: url("/images/background/typewriter/background-image_plus-terracotta.png");
background-image: url("https://res.cloudinary.com/djorzswta/image/upload/v1737840049/mz3phzb7eexxqbza9j0w.png");
background-size: cover;
background-position: center;
background-repeat: repeat-y;
Expand Down
43 changes: 10 additions & 33 deletions app/ui/AboutMe.tsx
Original file line number Diff line number Diff line change
@@ -1,38 +1,15 @@
// app/ui/PunchCard.tsx
'use client';

import CardCard from "./punchcard/CardCard";
import React from "react";
import content from "@/public/content.json";

interface AboutMeProps {
label: string;
className?: string;
content: {
who: {
text: string;
label: string;
}
what: {
text: string;
label: string;
}
why: {
text: string;
label: string;
}
where: {
text: string;
label: string;
}
when: {
text: string;
label: string;
}
}
};

}

export default function AboutMe({
label,
content,
className,
}: AboutMeProps) {

Expand All @@ -42,15 +19,15 @@ export default function AboutMe({
className="font-lobster text-lg text-left text-palemint text-stroke-header
pb-2 sm:text-xl header-shadow my-1"
>
{label}
{content.sections.aboutMe.label}
</h1>

<div className="font-cormorantGaramond text-sm text-pretty">
<p className="pb-2"><span className="bio-label mr-2">[{content.who.label}]:</span> <br /> {content.who.text}</p>
<p className="pb-2"><span className="bio-label mr-2">[{content.what.label}]:</span> <br /> {content.what.text}</p>
<p className="pb-2"><span className="bio-label mr-2">[{content.why.label}]:</span> <br /> {content.why.text}</p>
<p className="pb-2"><span className="bio-label mr-2">[{content.where.label}]:</span> {content.where.text}</p>
<p className="pb-2"><span className="bio-label mr-2">[{content.when.label}]:</span> {content.when.text}</p>
<p className="pb-2"><span className="bio-label mr-2">[{content.sections.aboutMe.content.who.label}]:</span> <br /> {content.sections.aboutMe.content.who.text}</p>
<p className="pb-2"><span className="bio-label mr-2">[{content.sections.aboutMe.content.what.label}]:</span> <br /> {content.sections.aboutMe.content.what.text}</p>
<p className="pb-2"><span className="bio-label mr-2">[{content.sections.aboutMe.content.why.label}]:</span> <br /> {content.sections.aboutMe.content.why.text}</p>
<p className="pb-2"><span className="bio-label mr-2">[{content.sections.aboutMe.content.where.label}]:</span> {content.sections.aboutMe.content.where.text}</p>
<p className="pb-2"><span className="bio-label mr-2">[{content.sections.aboutMe.content.when.label}]:</span> {content.sections.aboutMe.content.when.text}</p>
</div>
</CardCard>
);
Expand Down
4 changes: 1 addition & 3 deletions app/ui/Header.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
// app/ui/Header.tsx
'use client'
'use client';

import React, { useState } from "react";
import Link from "next/link";
Expand All @@ -15,7 +14,6 @@ export default function Header({ className }: HeaderProps) {
const [isOpen, setIsOpen] = useState(false);

const toggleMenu = () => {
console.log('toggleMenu open?', isOpen);
setIsOpen(!isOpen);
};

Expand Down
17 changes: 7 additions & 10 deletions app/ui/Logo.tsx
Original file line number Diff line number Diff line change
@@ -1,18 +1,16 @@
// app/ui/Logo.tsx
import React from "react";
import Image from "next/legacy/image";
import CustomizableImage from "./CustomizableImage";
import OrnateBorder from "./OrnateBorder";
import { CldImage } from "next-cloudinary";
import content from "@/public/content.json";

interface LogoProps {
className?: string;
logo: {
motto: string;
motto_translation: string;
};
}

export default function Logo({ className, logo }: LogoProps) {
export default function Logo({ className }: LogoProps) {

return (
<div className={`mx-auto ${className}`}>
{/* Latin text section */}
Expand All @@ -25,19 +23,18 @@ export default function Logo({ className, logo }: LogoProps) {
`}
borderColor="border-seashell">
<div className="relative z-10">
<h1 className="font-charm font-semibold text-3xl motto-text-shadow">{logo.motto}</h1>
<h1 className="font-charm font-semibold text-3xl motto-text-shadow">{content.sections.branding.motto}</h1>
</div>
</OrnateBorder>
</div>

<div className="relative w-full flex justify-center">
{/* Portrait section */}
<div className="relative w-[200px] aspect-[333/437] shadow-default border-2">
<Image
src="/images/portrait.png"
<CldImage
src="https://res.cloudinary.com/djorzswta/image/upload/v1737840009/buh6otgqpps4v6eeaum3.png"
alt="Portrait"
className="object-contain"
layout="fill"
sizes="100vw"
priority
/>
Expand Down
55 changes: 27 additions & 28 deletions app/ui/carousel/Carousel.tsx
Original file line number Diff line number Diff line change
@@ -1,34 +1,33 @@
'use client';
// 'use client';

import React, { ReactNode } from 'react';
import CarouselUI from './CarouselUI';
import { useCarousel } from '../../state/hooks';
import Slide from './Slide';
// import React, { ReactNode } from 'react';
// import CarouselUI from './CarouselUI';
// import Slide from './Slide';

interface CarouselProps {
children: ReactNode[];
className?: string;
}
// interface CarouselProps {
// children: ReactNode[];
// className?: string;
// }

interface CarouselComponent extends React.FC<CarouselProps> {
Slide: typeof Slide;
}
// interface CarouselComponent extends React.FC<CarouselProps> {
// Slide: typeof Slide;
// }

const Carousel: CarouselComponent = ({ children, className = '' }) => {
const totalSlides = React.Children.count(children);
const { currentIndex, handlePrev, handleNext } = useCarousel(totalSlides);
// const Carousel: CarouselComponent = ({ children, className = '' }) => {
// const totalSlides = React.Children.count(children);
// const { currentIndex, handlePrev, handleNext } = useCarousel(totalSlides);

return (
<CarouselUI
className={className}
currentIndex={currentIndex}
onPrev={handlePrev}
onNext={handleNext}
>
{children}
</CarouselUI>
)
}
// return (
// <CarouselUI
// className={className}
// currentIndex={currentIndex}
// onPrev={handlePrev}
// onNext={handleNext}
// >
// {children}
// </CarouselUI>
// )
// }

Carousel.Slide = Slide;
export default Carousel;
// Carousel.Slide = Slide;
// export default Carousel;
Loading

0 comments on commit 020dc6d

Please sign in to comment.