diff --git a/src/app/globals.css b/src/app/globals.css index 875c01e..5d9d819 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -2,32 +2,13 @@ @tailwind components; @tailwind utilities; -:root { - --foreground-rgb: 0, 0, 0; - --background-start-rgb: 214, 219, 220; - --background-end-rgb: 255, 255, 255; -} +/* @import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap"); +@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap"); */ -@media (prefers-color-scheme: dark) { - :root { - --foreground-rgb: 255, 255, 255; - --background-start-rgb: 0, 0, 0; - --background-end-rgb: 0, 0, 0; - } -} body { - color: rgb(var(--foreground-rgb)); - background: linear-gradient( - to bottom, - transparent, - rgb(var(--background-end-rgb)) - ) - rgb(var(--background-start-rgb)); + font-family: var(--font-inter), var(--font-notojp); } -@layer utilities { - .text-balance { - text-wrap: balance; - } -} +/* https://zenn.dev/var/articles/3cd463f2388a35 +https://tailwindcss.com/docs/adding-custom-styles#using-css-and-layer*/ diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 3314e47..27f33fc 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,8 +1,17 @@ import type { Metadata } from "next"; -import { Inter } from "next/font/google"; +import { Inter, Noto_Sans_JP } from "next/font/google"; import "./globals.css"; -const inter = Inter({ subsets: ["latin"] }); +const inter = Inter({ + subsets: ["latin"], + variable: "--font-inter", +}); + +const notojp = Noto_Sans_JP({ + weight: ["400", "500"], + subsets: ["latin"], + variable: "--font-notojp", +}) export const metadata: Metadata = { title: "Create Next App", @@ -15,8 +24,8 @@ export default function RootLayout({ children: React.ReactNode; }>) { return ( - - {children} + + {children} ); } diff --git a/src/app/page.tsx b/src/app/page.tsx index ea0da52..91a59df 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,116 +1,17 @@ -import Image from "next/image"; - -import { basePath } from "../../next.config"; -const BASE_PATH = basePath ? basePath : ""; - export default function Home() { return ( -
-
-

- Get started by editing  - src/app/page.tsx -

-
- - By{" "} - Vercel Logo - -
+ <> + {/*
ようこそ
+
ようこそ
*/} +
+ Englishようこそ
- -
- Next.js Logo -
- -
- -

- Docs{" "} - - -> - -

-

- Find in-depth information about Next.js features and API. -

-
- - -

- Learn{" "} - - -> - -

-

- Learn about Next.js in an interactive course with quizzes! -

-
- - -

- Templates{" "} - - -> - -

-

- Explore starter templates for Next.js. -

-
- - -

- Deploy{" "} - - -> - -

-

- Instantly deploy your Next.js site to a shareable URL with Vercel. -

-
-
-
+ + English + + + ようこそ + + ); } diff --git a/tailwind.config.ts b/tailwind.config.ts index e9a0944..ad777ff 100644 --- a/tailwind.config.ts +++ b/tailwind.config.ts @@ -8,11 +8,6 @@ const config: Config = { ], theme: { extend: { - backgroundImage: { - "gradient-radial": "radial-gradient(var(--tw-gradient-stops))", - "gradient-conic": - "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))", - }, }, }, plugins: [],