diff --git a/service/vspo-schedule/web/package.json b/service/vspo-schedule/web/package.json index 22ef14c8..89c8b419 100644 --- a/service/vspo-schedule/web/package.json +++ b/service/vspo-schedule/web/package.json @@ -43,7 +43,6 @@ "react-dom": "^18.3.1", "react-i18next": "^14.1.2", "react-tweet": "^3.2.1", - "sass": "^1.77.6", "sharp": "^0.33.4", "swr": "^2.2.5", "typescript": "^5.5.2" diff --git a/service/vspo-schedule/web/pnpm-lock.yaml b/service/vspo-schedule/web/pnpm-lock.yaml index 8d254e4f..0bb60f75 100644 --- a/service/vspo-schedule/web/pnpm-lock.yaml +++ b/service/vspo-schedule/web/pnpm-lock.yaml @@ -101,9 +101,6 @@ importers: react-tweet: specifier: ^3.2.1 version: 3.2.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - sass: - specifier: ^1.77.6 - version: 1.77.6 sharp: specifier: ^0.33.4 version: 0.33.4 @@ -5696,6 +5693,7 @@ snapshots: dependencies: normalize-path: 3.0.0 picomatch: 2.3.1 + optional: true argparse@2.0.1: {} @@ -5853,7 +5851,8 @@ snapshots: big.js@5.2.2: {} - binary-extensions@2.3.0: {} + binary-extensions@2.3.0: + optional: true brace-expansion@1.1.11: dependencies: @@ -5919,6 +5918,7 @@ snapshots: readdirp: 3.6.0 optionalDependencies: fsevents: 2.3.3 + optional: true chrome-trace-event@1.0.4: {} @@ -6720,7 +6720,8 @@ snapshots: ignore@5.3.1: {} - immutable@4.3.7: {} + immutable@4.3.7: + optional: true import-fresh@3.3.0: dependencies: @@ -6769,6 +6770,7 @@ snapshots: is-binary-path@2.1.0: dependencies: binary-extensions: 2.3.0 + optional: true is-boolean-object@1.1.2: dependencies: @@ -7204,7 +7206,8 @@ snapshots: node-releases@2.0.18: {} - normalize-path@3.0.0: {} + normalize-path@3.0.0: + optional: true object-assign@4.1.1: {} @@ -7438,6 +7441,7 @@ snapshots: readdirp@3.6.0: dependencies: picomatch: 2.3.1 + optional: true reflect.getprototypeof@1.0.6: dependencies: @@ -7549,6 +7553,7 @@ snapshots: chokidar: 3.6.0 immutable: 4.3.7 source-map-js: 1.2.0 + optional: true scheduler@0.23.2: dependencies: diff --git a/service/vspo-schedule/web/src/styles/Terms.module.scss b/service/vspo-schedule/web/src/components/Templates/AgreementDocument.tsx similarity index 82% rename from service/vspo-schedule/web/src/styles/Terms.module.scss rename to service/vspo-schedule/web/src/components/Templates/AgreementDocument.tsx index 7b1ba303..99117901 100644 --- a/service/vspo-schedule/web/src/styles/Terms.module.scss +++ b/service/vspo-schedule/web/src/components/Templates/AgreementDocument.tsx @@ -1,4 +1,6 @@ -.container { +import { styled } from "@mui/material/styles"; + +export const AgreementDocument = styled("div")(` h1 { font-size: 2.5rem; margin-top: 0; @@ -35,4 +37,4 @@ text-decoration: underline; } } -} +`); diff --git a/service/vspo-schedule/web/src/components/Templates/index.ts b/service/vspo-schedule/web/src/components/Templates/index.ts index 5f4c2693..27172dfa 100644 --- a/service/vspo-schedule/web/src/components/Templates/index.ts +++ b/service/vspo-schedule/web/src/components/Templates/index.ts @@ -1,3 +1,4 @@ +export * from "./AgreementDocument"; export * from "./ClipList"; export * from "./ClipTabs"; export * from "./Livestreams"; diff --git a/service/vspo-schedule/web/src/pages/privacy-policy.tsx b/service/vspo-schedule/web/src/pages/privacy-policy.tsx index df46feef..97ac9f30 100644 --- a/service/vspo-schedule/web/src/pages/privacy-policy.tsx +++ b/service/vspo-schedule/web/src/pages/privacy-policy.tsx @@ -1,7 +1,7 @@ import React from "react"; -import styles from "@/styles/Terms.module.scss"; import { NextPageWithLayout } from "./_app"; import { ContentLayout } from "@/components/Layout/ContentLayout"; +import { AgreementDocument } from "@/components/Templates"; import { DEFAULT_LOCALE, QA_LINK } from "@/lib/Const"; import { GetStaticProps } from "next"; import { serverSideTranslations } from "next-i18next/serverSideTranslations"; @@ -36,7 +36,7 @@ export const getStaticProps: GetStaticProps = async ({ const PrivacyPolicy: NextPageWithLayout = () => { return ( -
+

プライバシーポリシー

このプライバシーポリシーは，サービス提供者がこのウェブサイト上で提供するサービス（以下，「本サービス」といいます。）のプライバシーポリシー（以下，「本ポリシー」といいます。）を定めます。 @@ -123,7 +123,7 @@ const PrivacyPolicy: NextPageWithLayout = () => { までお願いいたします。

-
+ ); }; diff --git a/service/vspo-schedule/web/src/pages/terms.tsx b/service/vspo-schedule/web/src/pages/terms.tsx index 06d3fd06..baac290b 100644 --- a/service/vspo-schedule/web/src/pages/terms.tsx +++ b/service/vspo-schedule/web/src/pages/terms.tsx @@ -1,7 +1,7 @@ import React from "react"; -import styles from "@/styles/Terms.module.scss"; import { NextPageWithLayout } from "./_app"; import { ContentLayout } from "@/components/Layout/ContentLayout"; +import { AgreementDocument } from "@/components/Templates"; import { GetStaticProps } from "next"; import { DEFAULT_LOCALE } from "@/lib/Const"; import { serverSideTranslations } from "next-i18next/serverSideTranslations"; @@ -36,7 +36,7 @@ export const getStaticProps: GetStaticProps = async ({ const Terms: NextPageWithLayout = () => { return ( -
+

利用規約

この利用規約（以下，「本規約」といいます。）は，サービス提供者がこのウェブサイト上で提供するサービス（以下，「本サービス」といいます。）の利用条件を定めます。 @@ -202,7 +202,7 @@ const Terms: NextPageWithLayout = () => {

本サービスに関して紛争が生じた場合には，サービス提供者の本店所在地を管轄する裁判所を専属的合意管轄とします。

-
+ ); }; diff --git a/service/vspo-schedule/web/src/styles/Home.module.scss b/service/vspo-schedule/web/src/styles/Home.module.scss deleted file mode 100644 index e654cb2d..00000000 --- a/service/vspo-schedule/web/src/styles/Home.module.scss +++ /dev/null @@ -1,69 +0,0 @@ -// styles/Home.module.scss -.container { - max-width: 960px; - margin: 0 auto; - padding: 2rem; -} - -.title { - text-align: center; - font-size: 2rem; - margin-bottom: 1rem; -} - -.livestreamList { - list-style-type: none; - padding: 0; - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - grid-gap: 1rem; -} - -.livestreamItem { - background-color: white; - box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); - padding: 1rem; - display: flex; - flex-direction: column; - justify-content: space-between; - - img { - width: 100%; - object-fit: cover; - } - - .subtitle { - font-size: 1.5rem; - margin: 1rem 0; - } - - .description { - margin: 0; - } -} - -.timeRangeLabelContainer { - display: flex; - justify-content: center; - align-items: center; - margin-bottom: 1.5em; - .timeRangeLabel { - width: 12rem; - color: rgb(255, 255, 255); - font-size: 1.5rem; - font-weight: 600; - text-align: center; - background: rgb(45, 75, 112); - border-radius: 1.35rem; - @media (max-width: 768px) { - width: 10rem; - font-size: 1.2rem; - } - - /* For mobile devices */ - @media (max-width: 480px) { - width: 8rem; - font-size: 1rem; - } - } -}