diff --git a/components/Account.module.css b/components/Account.module.css deleted file mode 100644 index dd29ed4..0000000 --- a/components/Account.module.css +++ /dev/null @@ -1,5 +0,0 @@ -.Account { - white-space: nowrap; - width: 50%; - flex-basis: calc(50% - 8px) !important; -} \ No newline at end of file diff --git a/components/Account.tsx b/components/Account.tsx deleted file mode 100644 index 04b1766..0000000 --- a/components/Account.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import * as React from "react" -import {IconDefinition} from "@fortawesome/free-regular-svg-icons"; -import {Panel, Anchor} from "@steffo/bluelib-react"; -import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"; -import Style from "./Account.module.css" - - -interface AccountProps { - icon: IconDefinition, - url: string, - name: string, -} - - -export function Account({icon, url, name}: AccountProps): JSX.Element { - let contents: JSX.Element - if(url) { - contents =  {name} - } - else { - contents = <> {name} - } - - return ( - - {contents} - - ) -} diff --git a/components/LinkPanel.tsx b/components/LinkPanel.tsx new file mode 100644 index 0000000..8ac820d --- /dev/null +++ b/components/LinkPanel.tsx @@ -0,0 +1,38 @@ +import {IconProp} from "@fortawesome/fontawesome-svg-core" +import {FontAwesomeIcon} from "@fortawesome/react-fontawesome" +import {default as Link} from "next/link" +import {default as cn} from "classnames" +import React from "react" + + +export type LinkPanelProps = { + href?: string, + icon: IconProp, + text: string, + me?: boolean, + fade?: boolean, +} + + +export const LinkPanel = ({href, icon, text, me, fade}: LinkPanelProps) => { + const panel = ( +
+ +  {text} + +
+ ) + + if(href) { + return ( + + + {panel} + + + ) + } + else { + return panel + } +} diff --git a/components/MoreProjects.jsx b/components/MoreProjects.jsx deleted file mode 100644 index 738495f..0000000 --- a/components/MoreProjects.jsx +++ /dev/null @@ -1,41 +0,0 @@ -import * as React from "react" -import {Anchor} from "@steffo/bluelib-react" -import Style from "./MoreProjects.module.css" - - -export function MoreProjects({user, minus}) { - const [data, setData] = React.useState(null) - const [error, setError] = React.useState(null) - - const fetchData = React.useCallback( - () => { - fetch(`https://api.github.com/users/${user}`) - .then(r => r.json()) - .then(d => setData(d)) - .catch(e => setError(e)) - }, - [user, setData, setError] - ) - - React.useEffect( - () => { - fetchData() - }, - [fetchData] - ) - - const contents = React.useMemo( - () => { - if(data === null) return "Loading..." - else if(error !== null) return "Error: {error}" - return `...and ${data["public_repos"] - minus} more!` - }, - [data, error, minus] - ) - - return ( -
- {contents} -
- ) -} diff --git a/components/MoreProjects.module.css b/components/MoreProjects.module.css deleted file mode 100644 index 6544739..0000000 --- a/components/MoreProjects.module.css +++ /dev/null @@ -1,4 +0,0 @@ -.More { - font-size: small; - text-align: center; -} \ No newline at end of file diff --git a/components/Project.jsx b/components/Project.jsx deleted file mode 100644 index 488aba6..0000000 --- a/components/Project.jsx +++ /dev/null @@ -1,77 +0,0 @@ -import * as React from "react" -import {Panel, Anchor} from "@steffo/bluelib-react"; -import {FontAwesomeIcon} from "@fortawesome/react-fontawesome" -import Style from "./Project.module.css" -import { faStar } from "@fortawesome/free-solid-svg-icons" - - -export function Project({user, repo, lang}) { - const [data, setData] = React.useState(null) - const [error, setError] = React.useState(null) - - const fetchData = React.useCallback( - () => { - fetch(`https://api.github.com/repos/${user}/${repo}`) - .then(r => r.json()) - .then(d => setData(d)) - .catch(e => setError(e)) - }, - [user, repo, setData, setError] - ) - - React.useEffect( - () => { - fetchData() - }, - [fetchData] - ) - - const color = React.useMemo( - () => { - if(data === null) { - return "color-yellow" - } - else if(error !== null) { - return "color-red" - } - else { - return "" - } - }, - [data, error] - ) - - const info = React.useMemo( - () => { - if(data === null) return ( -
Loading...
- ) - else if(error !== null) return ( -
Error: {error}
- ) - - return <> -
- {data["description"]} -
-
- - {data["stargazers_count"]} - -
- - }, - [user, repo, data, error] - ) - - return ( - -
- - {repo} - -
- {info} -
- ) -} diff --git a/components/Project.module.css b/components/Project.module.css deleted file mode 100644 index ea4db43..0000000 --- a/components/Project.module.css +++ /dev/null @@ -1,29 +0,0 @@ -.Project { - display: grid; - - grid-template-areas: - "title description stars" - ; - grid-template-columns: 1fr 4fr auto; - grid-column-gap: 12px; - - align-items: center; -} - -.Title { - font-size: larger; - - grid-area: title; -} - -.Description { - justify-self: start; - - grid-area: description; -} - -.Stars { - justify-self: end; - - grid-area: stars; -} diff --git a/components/ThemeContext.ts b/components/ThemeContext.ts deleted file mode 100644 index 7df7e8f..0000000 --- a/components/ThemeContext.ts +++ /dev/null @@ -1,5 +0,0 @@ -import * as React from "react" -import { BluelibTheme } from "@steffo/bluelib-react/dist/types" - - -export const ThemeContext = React.createContext<[BluelibTheme, React.Dispatch>]>(["royalblue", undefined]); diff --git a/package.json b/package.json index 398200b..5ea220b 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,7 @@ "@fortawesome/free-solid-svg-icons": "^6.2.0", "@fortawesome/react-fontawesome": "^0.2.0", "@steffo/bluelib": "^6.0.0", + "classnames": "^2.3.2", "next": "^12.3.1", "react": "^18.2.0", "react-dom": "^18.2.0", diff --git a/pages/_app.css b/pages/_app.css index 793c294..b3c7c06 100644 --- a/pages/_app.css +++ b/pages/_app.css @@ -1,16 +1,23 @@ body { - margin: 0; - min-height: 100vh; - background-color: #0d193b; background-image: url("/space_default.jpg"); + background-attachment: fixed; background-size: cover; - color: #a0ccff; } -body > * { +#__next { + margin: 0 auto; min-height: 100vh; + max-width: 1000px; } -body > * > * { - min-height: 100vh; +#panel-internet a { + text-decoration: none; +} + +#panel-internet a:hover, #panel-internet a:focus { + --bhsl-current-lightness: calc(var(--bhsl-link-lightness) + 20%); +} + +#panel-internet a:active { + --bhsl-current-lightness: calc(var(--bhsl-link-lightness) + 40%); } \ No newline at end of file diff --git a/pages/_app.tsx b/pages/_app.tsx index bbe3342..f2dcdef 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -1,38 +1,28 @@ +import Link from "next/link" import React from 'react' -import type {AppProps} from "next/app" + +import "@steffo/bluelib/dist/base.root.css" +import "@steffo/bluelib/dist/colors-royalblue.root.css" +import "@steffo/bluelib/dist/fonts-fira-ghpages.root.css" +import "@steffo/bluelib/dist/classic.root.css" +import "@steffo/bluelib/dist/glass.root.css" +import "@steffo/bluelib/dist/fun.root.css" import "./_app.css" -import {LayoutThreeCol, Heading, BringAttention as B, Footer, Anchor as A, useBluelibInBody } from "@steffo/bluelib-react" -import {BluelibTheme} from "@steffo/bluelib-react/dist/types" -import { ThemeContext } from '../components/ThemeContext' + +import type {AppProps} from "next/app" -function App({Component, pageProps}: AppProps) { - const [theme, setTheme] = React.useState("royalblue") - useBluelibInBody(theme) - - return ( - - - - - Steffo's website - - -
-

- © {new Date().getFullYear()} Stefano Pigozzi -

-

- Open source website based on Bluelib and Bluelib React -

-

- Please do not use the source code of this website to impersonate me! -

-
-
-
-
- ); +const App = ({Component, pageProps}: AppProps) => { + return <> +

+ Steffo's website +

+ +
+ © {new Date().getFullYear()} Stefano Pigozzi | Source code +
+ } +// noinspection JSUnusedGlobalSymbols export default App; diff --git a/pages/index.tsx b/pages/index.tsx index ddbef43..14fe924 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -1,83 +1,121 @@ +import {FontAwesomeIcon} from "@fortawesome/react-fontawesome" import React from 'react' import type {NextPage} from "next" -import {Heading, Chapter, Box, BringAttention as B, Anchor, Form} from "@steffo/bluelib-react"; -import {BluelibTheme} from "@steffo/bluelib-react/dist/types" -import {faEnvelope} from "@fortawesome/free-solid-svg-icons" -import {faDiscord, faGithub, faReddit, faTelegram} from "@fortawesome/free-brands-svg-icons" -import {Project} from "../components/Project" -import {MoreProjects} from "../components/MoreProjects" -import {Account} from "../components/Account" -import {ThemeContext} from '../components/ThemeContext'; - - -type ThemeMap = { - [fullname: string]: BluelibTheme; -}; -const FULL_THEME_NAMES: ThemeMap = { - "Royal Blue": "royalblue", - "The Sophonity": "sophon", - "Sheet of Paper": "paper", - "Hacker Terminal": "hacker", - "Gestione Amber": "amber", -} +import {default as Link} from "next/link" +import {faReddit, faMastodon, faGithub, faDiscord, faTelegram, faSteam, faItchIo, faTwitter} from "@fortawesome/free-brands-svg-icons" +import {faBorderAll, faEnvelope, faPizzaSlice, faGamepad, faBook, faBox, faFilm, faMusic} from "@fortawesome/free-solid-svg-icons" +import {LinkPanel} from "../components/LinkPanel" const Index: NextPage = () => { - const [_theme, setTheme] = React.useContext(ThemeContext); - return <> - - - +
+
+

+ Under construction +

+

+ This website is currently being recreated from scratch, therefore much of its content is missing! +

+
+
+
+
+

About me - +

- I'm Stefano Pigozzi, a Computer Science graduate at Unimore! + I'm Stefano Pigozzi, a Computer Science graduate and Master's student at Unimore!

+
+
+
+
+

+ My projects +

- I develop and maintain many open source software projects, such as websites, chat bots, libraries, videogames and mods. + One of the things I enjoy doing in my free time is developing software to solve problems I encounter in my life, and then publishing the result on the Internet, allowing others to benefit from my solutions and contributing to the open source community.

- - - - - - My software projects - - - - - - - - - - - - - - - - Me on the web - - - - - - - - - - - - - Other stuff - -
- setTheme(FULL_THEME_NAMES[event.target.value])} options={FULL_THEME_NAMES}/> - -
-
+
+
+
+
+

+ My posts +

+

+ Very rarely, I write something interesting and put it here. +

+
+

+ Guess what? Nothing has been posted here yet. +

+
+
+
+

+ My ratings +

+

+ I have fun rating and comparing things based on my personal tastes! +

+
+ + + + + + +
+

+ I am by no means a critic, so don't pay this too much attention unless you're interested in what I like... +

+
+
+
+
+

+ Me on the Internet +

+

+ You can find me in many places on the web, but these are the ones I'm most active on: +

+
+ + + + + + +
+

+ You can send me messages on the following ways: +

+
+ + + + +
+

+ Please do not send me chat messages about Greed, open an issue or you'll end up in my Hall of Shame! +

+
+
+

+ Friends with a website +

+

+ You can check out my friends' websites here: +

+
+

+ This section was just created: if you know me, please tell me your website so I can add it here! :D +

+
+
+
} diff --git a/yarn.lock b/yarn.lock index 242c680..bf7592d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -169,6 +169,11 @@ caniuse-lite@^1.0.30001406: resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001420.tgz#f62f35f051e0b6d25532cf376776d41e45b47ef6" integrity sha512-OnyeJ9ascFA9roEj72ok2Ikp7PHJTKubtEJIQ/VK3fdsS50q4KWy+Z5X0A1/GswEItKX0ctAp8n4SYDE7wTu6A== +classnames@^2.3.2: + version "2.3.2" + resolved "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz#351d813bf0137fcc6a76a16b88208d2560a0d924" + integrity sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw== + csstype@^3.0.2: version "3.0.10" resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.10.tgz#2ad3a7bed70f35b965707c092e5f30b327c290e5"