yude/yude.jp
0
0
Fork 0
mirror of https://github.com/yude-jp/yude.jp synced 2024-12-23 04:30:11 +09:00
Code Releases Activity

Compare commits

base: yude:d90e9cf0c44ad539b2fa371e10820ddbf793ca56
Branches Tags
yude:master
yude:dependabot/npm_and_yarn/webpack-5.76.0
yude:dependabot/npm_and_yarn/json5-1.0.2
yude:dependabot/npm_and_yarn/minimist-1.2.8
yude:release
..
compare: yude:1131a1f9dc4453fb7a3d63eeaa06847da0f3e543
Branches Tags
yude:dependabot/npm_and_yarn/webpack-5.76.0
yude:dependabot/npm_and_yarn/json5-1.0.2
yude:dependabot/npm_and_yarn/minimist-1.2.8
yude:master
yude:release

4 Commits
d90e9cf0c4 ... 1131a1f9dc

Author SHA1 Message Date
yude
1131a1f9dc
Add badge 2021-05-21 18:57:55 +09:00
yudejp
fde368d833
Cleanup 2021-05-21 18:50:24 +09:00
yudejp
e76d06ce0a
Add dark-mode switcher 2021-05-21 18:36:19 +09:00
yudejp
bfd432c11d
Update README 2021-05-21 17:19:18 +09:00
12 changed files with 97 additions and 29 deletions
Show Stats Expand all files Collapse all files

13
README.md
View File

@ -1,2 +1,13 @@
# yude.jp # yude.jp
Front page of [yude.jp](https://yude.jp). ![Vercel](https://vercelbadge.vercel.app/api/yudejp/yude.jp?style=for-the-badge)
<img alt="Next JS" src="https://img.shields.io/badge/nextjs-%23000000.svg?style=for-the-badge&logo=next.js&logoColor=white"/>
<img alt="TailwindCSS" src="https://img.shields.io/badge/tailwindcss-%2338B2AC.svg?style=for-the-badge&logo=tailwind-css&logoColor=white"/>\
Front page of [yude.jp](https://yude.jp).\
Built with [Next.js](https://nextjs.org/) and [Tailwind CSS](https://tailwindcss.com/) and deployed on [Vercel](https://vercel.com).
## Development
* To setup your repository, please run `yarn`.
* To view this website in your computer, please run `yarn dev`.
## License
This repository is licensed under the MIT License.

2
package.json
View File

@ -28,7 +28,7 @@
"@zeit/next-css": "^1.0.1", "@zeit/next-css": "^1.0.1",
"autoprefixer": "^10.2.4", "autoprefixer": "^10.2.4",
"next": "^10.0.6", "next": "^10.0.6",
"next-themes": "^0.0.12", "next-themes": "^0.0.14",
"next-translate": "^1.0.2", "next-translate": "^1.0.2",
"nightwind": "^1.1.6", "nightwind": "^1.1.6",
"popper.js": "^1.16.1", "popper.js": "^1.16.1",

12
pages/_app.js Normal file
View File

@ -0,0 +1,12 @@
import 'tailwindcss/tailwind.css';
import { ThemeProvider } from "next-themes";
function MyApp({ Component, pageProps }) {
return (
<ThemeProvider attribute="class">
<Component {...pageProps} />
</ThemeProvider>
);
}
export default MyApp;

18
pages/_document.js Normal file
View File

@ -0,0 +1,18 @@
import React from "react";
import Document, { Html, Head, Main, NextScript } from "next/document";
class MyDocument extends Document {
render() {
return (
<Html>
<Head />
<body className="bg-gray-100 text-black dark:bg-gray-800 dark:text-white">
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;

29
pages/components/DarkmodeSwitcher.js Normal file
View File

@ -0,0 +1,29 @@
import Head from "next/head"
import Link from "next/link"
import "tailwindcss/tailwind.css";
import useTranslation from 'next-translate/useTranslation'
import { useRouter } from 'next/router'
import React, { useEffect, useState } from 'react'
import { useTheme } from "next-themes";
const Layout = (props) => {
const { title, children } = props
const siteTitle = "yude.jp"
const router = useRouter()
const { locale, locales, defaultLocale, pathname } = router
const [isMounted, setIsMounted] = useState(false);
const { theme, setTheme } = useTheme();
useEffect(() => {
setIsMounted(true);
}, []);
const switchTheme = () => {
if (isMounted) {
setTheme(theme === "light" ? "dark" : "light");
}
};
return (
<button className="my-4 mx-3 text-2xl" onClick={switchTheme}>🌙</button>
)
}
export default Layout

4
pages/components/LangSelector.js
View File

@ -28,7 +28,7 @@ const Dropdown = ({ color }) => {
return ( return (
<> <>
<div className="relative inline-block text-left mr-2 float-right z-10"> <div className="text-left mr-2 my-3 float-right">
<button type="button" className="inline-flex justify-center w-full rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-indigo-500" id="options-menu" aria-haspopup="true" aria-expanded="true" <button type="button" className="inline-flex justify-center w-full rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-indigo-500" id="options-menu" aria-haspopup="true" aria-expanded="true"
style={{ transition: "all .15s ease" }} style={{ transition: "all .15s ease" }}
ref={btnDropdownRef} ref={btnDropdownRef}
@ -43,8 +43,6 @@ const Dropdown = ({ color }) => {
<path fillRule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clipRule="evenodd" /> <path fillRule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clipRule="evenodd" />
</svg> </svg>
</button> </button>
<div ref={popoverDropdownRef} className={ <div ref={popoverDropdownRef} className={
(dropdownPopoverShow ? "block " : "hidden ") + "origin-top-right absolute right-0 mt-2 w-40 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"}> (dropdownPopoverShow ? "block " : "hidden ") + "origin-top-right absolute right-0 mt-2 w-40 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"}>
<div className="py-1" role="menu" aria-orientation="vertical" aria-labelledby="options-menu"> <div className="py-1" role="menu" aria-orientation="vertical" aria-labelledby="options-menu">

7
pages/components/Layout.js
View File

@ -4,6 +4,7 @@ import "tailwindcss/tailwind.css";
import useTranslation from 'next-translate/useTranslation' import useTranslation from 'next-translate/useTranslation'
import { useRouter } from 'next/router' import { useRouter } from 'next/router'
import React, { useEffect, useState } from 'react' import React, { useEffect, useState } from 'react'
import { useTheme } from "next-themes";
const Layout = (props) => { const Layout = (props) => {
const { title, children } = props const { title, children } = props
@ -21,7 +22,6 @@ const Layout = (props) => {
<title>{title ? `${title} - ${siteTitle}` : siteTitle}</title> <title>{title ? `${title} - ${siteTitle}` : siteTitle}</title>
<link rel="icon" href="/static/images/favicon.ico" /> <link rel="icon" href="/static/images/favicon.ico" />
</Head> </Head>
<body className="min-h-screen text-black dark:bg-gray-900 dark:text-white subpixel-antialiased">
<main> <main>
<div className="page-main"> <div className="page-main">
{children} {children}
@ -36,17 +36,16 @@ const Layout = (props) => {
<div className="container mx-auto px-6"> <div className="container mx-auto px-6">
<div className="mt-16 flex flex-col items-center"> <div className="mt-16 flex flex-col items-center">
<div className="sm:w-full text-center py-6"> <div className="sm:w-full text-center py-6">
<p className="text-sm font-bold mb-2 text-gray-900 dark:text-gray-400"> <p className="text-sm font-bold mb-2">
{footer} / <Link href="https://github.com/yudejp/yude.jp"><a className="hover:underline">{source}</a></Link> {footer} / <Link href="https://github.com/yudejp/yude.jp"><a className="hover:underline">{source}</a></Link>
</p> </p>
<p className="text-sm font-bold mb-2 text-gray-900 dark:text-gray-400"> <p className="text-sm font-bold mb-2">
<Link href="https://scrapbox.io/yude/yude.jp_%E3%82%B5%E3%83%BC%E3%83%93%E3%82%B9%E5%88%A9%E7%94%A8%E8%A6%8F%E7%B4%84"><a className="hover:underline">{tos}</a></Link> <Link href="https://scrapbox.io/yude/yude.jp_%E3%82%B5%E3%83%BC%E3%83%93%E3%82%B9%E5%88%A9%E7%94%A8%E8%A6%8F%E7%B4%84"><a className="hover:underline">{tos}</a></Link>
</p> </p>
</div> </div>
</div> </div>
</div> </div>
</main> </main>
</body>
</div> </div>
) )
} }

2
pages/components/Navbar.js
View File

@ -2,6 +2,7 @@ import "tailwindcss/tailwind.css";
import Popper from "popper.js"; import Popper from "popper.js";
import Link from 'next/link'; import Link from 'next/link';
import LangSelector from "./LangSelector" import LangSelector from "./LangSelector"
import DarkmodeSwitcher from "./DarkmodeSwitcher"
const Navbar = () => { const Navbar = () => {
return ( return (
@ -15,6 +16,7 @@ const Navbar = () => {
</a> </a>
</Link> </Link>
<div className="origin-top-right absolute right-0"> <div className="origin-top-right absolute right-0">
<DarkmodeSwitcher />
<LangSelector /> <LangSelector />
</div> </div>
</nav> </nav>

18
pages/index.js
View File

@ -31,15 +31,15 @@ export default function Index(props) {
unoptimized = {true} unoptimized = {true}
/> />
</div> </div>
<span><Link href="/profile"><a><FontAwesomeIcon icon={faUser} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span> <span><Link href="/profile"><a><FontAwesomeIcon icon={faUser} className="w-10 h-10 fill-current inline transition duration-200 ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
<span className="ml-4"><Link href="https://blog.yude.jp"><a><FontAwesomeIcon icon={faBlog} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span> <span className="ml-4"><Link href="https://blog.yude.jp"><a><FontAwesomeIcon icon={faBlog} className="w-10 h-10 fill-current inline transition duration-200 ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
<span className="ml-4"><Link href="https://scrapbox.io/yude"><a><FontAwesomeIcon icon={faBook} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span> <span className="ml-4"><Link href="https://scrapbox.io/yude"><a><FontAwesomeIcon icon={faBook} className="w-10 h-10 fill-current inline transition duration-200 ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
<span className="ml-4"><Link href="https://discord.gg/X6srY7X"><a><FontAwesomeIcon icon={faDiscord} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span> <span className="ml-4"><Link href="https://discord.gg/X6srY7X"><a><FontAwesomeIcon icon={faDiscord} className="w-10 h-10 fill-current inline transition duration-200 ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
<span className="ml-4"><Link href="https://github.com/yudejp"><a><FontAwesomeIcon icon={faGithub} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span> <span className="ml-4"><Link href="https://github.com/yudejp"><a><FontAwesomeIcon icon={faGithub} className="w-10 h-10 fill-current inline transition duration-200 ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
<span className="ml-4"><Link href="https://git.yude.jp"><a><FontAwesomeIcon icon={faGit} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span> <span className="ml-4"><Link href="https://git.yude.jp"><a><FontAwesomeIcon icon={faGit} className="w-10 h-10 fill-current inline transition duration-200 ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
<span className="ml-4"><Link href="https://mstdn.yude.jp"><a><FontAwesomeIcon icon={faMastodon} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span> <span className="ml-4"><Link href="https://mstdn.yude.jp"><a><FontAwesomeIcon icon={faMastodon} className="w-10 h-10 fill-current inline transition duration-200 ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
<span className="ml-4"><Link href="/status"><a><FontAwesomeIcon icon={faServer} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span> <span className="ml-4"><Link href="/status"><a><FontAwesomeIcon icon={faServer} className="w-10 h-10 fill-current inline transition duration-200 ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
<span className="ml-4"><Link href="/house"><a><FontAwesomeIcon icon={faHouseUser} className="w-10 h-10 fill-current inline transition duration-200 text-gray-900 dark:text-white ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span> <span className="ml-4"><Link href="/house"><a><FontAwesomeIcon icon={faHouseUser} className="w-10 h-10 fill-current inline transition duration-200 ease-in-out transform hover:-translate-y-1 hover:scale-110" /></a></Link></span>
<p></p> <p></p>
</div> </div>

9
pages/profile.js
View File

@ -61,7 +61,6 @@ export default function About(props) {
{ {
// Description // Description
} }
{/* <div className="2xl:mx-96 xl:mx-40 lg:mx-32 md:mx-8 sm:mx-8"> */}
<div className="container mx-auto max-w-3xl"> <div className="container mx-auto max-w-3xl">
<div className="text-left"> <div className="text-left">
<p className="text-2xl"><FontAwesomeIcon icon={faInfo} className="w-5 h-5 inline"/> {desc}</p> <p className="text-2xl"><FontAwesomeIcon icon={faInfo} className="w-5 h-5 inline"/> {desc}</p>
@ -171,8 +170,8 @@ export default function About(props) {
</a> </a>
</Link> </Link>
<p>{fingerprint}:</p> <p>{fingerprint}:</p>
<div class="w-full overflow-x-auto ..."> <div className="w-full overflow-x-auto ...">
<div class="whitespace-nowrap ..."> <div className="whitespace-nowrap ...">
3745 F270 DB4E 8975 6B07 62BE EB0F E5D9 25C4 A968 3745 F270 DB4E 8975 6B07 62BE EB0F E5D9 25C4 A968
</div> </div>
</div> </div>
@ -186,8 +185,8 @@ export default function About(props) {
</a> </a>
</Link> </Link>
<p>{fingerprint}:</p> <p>{fingerprint}:</p>
<div class="w-full overflow-x-auto ..."> <div className="w-full overflow-x-auto ...">
<div class="whitespace-nowrap ..."> <div className="whitespace-nowrap ...">
2048 SHA256:xwSL4DORWmroWdC6P0GU1m1yZl/cXqjo9rCCWqqO+Dc 2048 SHA256:xwSL4DORWmroWdC6P0GU1m1yZl/cXqjo9rCCWqqO+Dc
</div> </div>
</div> </div>

2
tailwind.config.js
View File

@ -1,6 +1,6 @@
module.exports = { module.exports = {
purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'], purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'],
darkMode: "media", darkMode: "class",
theme: { theme: {
aspectRatio: { aspectRatio: {
none: 0, none: 0,

8
yarn.lock
View File

@ -1833,10 +1833,10 @@ native-url@0.3.4:
dependencies: dependencies:
querystring "^0.2.0" querystring "^0.2.0"
next-themes@^0.0.12: next-themes@^0.0.14:
version "0.0.12" version "0.0.14"
resolved "https://registry.yarnpkg.com/next-themes/-/next-themes-0.0.12.tgz#8021999f314dc08614f4bcd1f8b7b91f1cd5bf00" resolved "https://registry.yarnpkg.com/next-themes/-/next-themes-0.0.14.tgz#2b9861990bc453149e23d8e6ef1a25a119e36675"
integrity sha512-127ZeerlF/GC17TMVkZkarj3f01weI03b+Ne1xHmmaRs9ouYXVkgyAd60GHRzUnCFVo1NKLcZe0Pr8OnTzrxwQ== integrity sha512-x09OaM+wg3SIlEjOv8B21aw/E36jxTtfW3Dm/DPwMsSMluGt7twe1LigA6nc+mXP1u0qu9MxBaIrPPH6UTiKnA==
next-translate@^1.0.2: next-translate@^1.0.2:
version "1.0.2" version "1.0.2"