rizaldy/ig.rizaldy.club
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: DARK MODE!!1!

Browse Source
This commit is contained in:
rizaldy 2024-02-02 11:49:25 +07:00
parent 27886a45b7
commit 431156a318
7 changed files with 14 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/Feed.js
View File

@ -23,7 +23,7 @@ const Feed = ({
});
}}
>
<img alt={url} loading="lazy" src={previewPath} className={`aspect-${type} bg-neutral-100`} />
<img alt={url} loading="lazy" src={previewPath} className={`aspect-${type} bg-neutral-100 dark:bg-neutral-900`} />
</a>
))}
</main>

4
components/Footer.js
View File

@ -24,7 +24,7 @@ const Footer = ({ license, links, repo, commitID }) => (
<p>
&copy; {YEAR_TO_BUMP}{" "}
<Link
className="text-neutral-600"
className="text-neutral-600 dark:text-neutral-200"
target="_blank"
rel="noopener noreferer"
href="https://github.com/faultables"
@ -37,7 +37,7 @@ const Footer = ({ license, links, repo, commitID }) => (
</Link>{" "}
unless stated otherwise •{" "}
<Link
className="text-neutral-600"
className="text-neutral-600 dark:text-neutral-200"
target="_blank"
rel="noopener noreferer"
href={`${repo}/commit/${commitID}`}

2
components/Navbar.js
View File

@ -1,7 +1,7 @@
import Link from "next/link";
const Navbar = ({ name, logo }) => (
<nav className="flex py-2 border-b">
<nav className="flex py-2 border-b dark:border-neutral-800">
<div className="w-3/12 md:w-7/12 md:mx-auto">
<div className="md:w-2/12">
<Link href="/">

8
components/Profile.js
View File

@ -5,7 +5,7 @@ const Profile = ({ profile, totalPosts }) => (
loading="lazy"
alt={profile.display_name}
src={profile.avatar}
className="w-100 rounded-full mx-auto border bg-neutral-100 border-gray-200 p-1"
className="w-full rounded-full mx-auto border bg-neutral-100 border-gray-200 p-1 dark:border-neutral-800 dark:bg-black"
/>
</div>
<div className="lg:w-9/12 md:w-10/12 mb-5 md:p-5 ml-5">
@ -13,13 +13,13 @@ const Profile = ({ profile, totalPosts }) => (
<h2 className="text-2xl font-semibold">{profile.username}</h2>
<div className="md:ml-4 my-4">
<a
className="rounded-md bg-gray-100 px-5 font-semibold py-2 md:ml-2 text-sm leading-relaxed"
className="rounded-md bg-gray-100 px-5 font-semibold py-2 md:ml-2 text-sm leading-relaxed dark:bg-neutral-800"
href={profile.follow_url}
>
Follow
</a>
<a
className="rounded-md bg-gray-100 px-5 font-semibold py-2 ml-2 text-sm leading-relaxed"
className="rounded-md bg-gray-100 px-5 font-semibold py-2 ml-2 text-sm leading-relaxed dark:bg-neutral-800"
href={profile.message_url}
>
Message
@ -31,7 +31,7 @@ const Profile = ({ profile, totalPosts }) => (
</div>
<p className="font-bold mb-1">{profile.display_name}</p>
<p>{profile.about}</p>
<p className="leading-loose font-semibold text-blue-900">
<p className="leading-loose font-semibold text-blue-900 dark:text-blue-200">
<a
target="_blank"
rel="noopener noreferer"

4
components/Tab.js
View File

@ -1,8 +1,8 @@
const isActiveTab = (currentTab, activeTab) =>
currentTab === activeTab ? "border-t" : "";
currentTab === activeTab ? "border-t dark:border-neutral-400" : "";
const Tab = ({ activeTab, setActiveTab }) => (
<div className="flex items-center justify-center text-center gap-5 border-t mb-4">
<div className="flex items-center justify-center text-center gap-5 border-t mb-4 dark:border-neutral-800">
<button
onClick={() => setActiveTab("photos")}
className={`uppercase tracking-tight font-semibold text-sm border-black pt-3 px-3 ${isActiveTab(

6
pages/_app.js
View File

@ -2,8 +2,6 @@ import "../styles/globals.css";
import Script from "next/script";
import { Fragment } from "react";
import Navbar from "../components/Navbar";
import Footer from "../components/Footer";
@ -16,7 +14,7 @@ const Content = ({ children }) => (
);
const App = ({ Component, pageProps }) => (
<Fragment>
<div className='bg-white dark:bg-black dark:text-neutral-200'>
<Navbar name={config.navbar.logotype} logo={config.navbar.logo} />
<Content>
<Component {...pageProps} />
@ -34,7 +32,7 @@ const App = ({ Component, pageProps }) => (
data-website-id={process.env.UMAMI_WEBSITE_ID}
/>
) : null}
</Fragment>
</div>
);
export default App;

4
pages/static/about.js
View File

@ -1,7 +1,7 @@
const About = () => (
<div className="p-2">
<div className="md:border p-5 md:w-8/12 md:shadow md:rotate-[-0.5deg] mx-auto text-neutral-600">
<h2 className="font-bold text-3xl leading-loose mb-2 text-black">
<div className="md:border p-5 md:w-8/12 md:shadow md:rotate-[-0.5deg] mx-auto text-neutral-600 dark:text-neutral-200 dark:border-neutral-800">
<h2 className="font-bold text-3xl leading-loose mb-2 text-black dark:text-neutral-200">
Notes from @faultables
</h2>
<p className="mb-6">