diff --git a/components/gacha.tsx b/components/gacha.tsx index ba217b0..e05de42 100644 --- a/components/gacha.tsx +++ b/components/gacha.tsx @@ -5,6 +5,9 @@ import Loading from "./loading" import styles from "../styles/gacha.module.css" +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome" +import { faCircleLeft } from "@fortawesome/free-solid-svg-icons" + const Gacha = () => { const [form, setForm] = useState(null) const [isLoading, setIsLoading] = useState(false) @@ -12,7 +15,7 @@ const Gacha = () => { const handleClick = () => { new Promise((resolve) => { setIsLoading(true) - setForm(Math.ceil(Math.random() * 5)) + setForm(Math.ceil(Math.random() * 6)) setTimeout(() => { resolve("") @@ -53,7 +56,10 @@ const Gacha = () => { ) : ( -

ガチャを回してね

+

+ {/* @ts-ignore */} + + ガチャを回してね

)} )} diff --git a/pages/index.tsx b/pages/index.tsx index 41a85bc..ccb1ef0 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -54,7 +54,7 @@ const Home: NextPage = () => (
-

フォームガチャ(実装中👷‍♂️)

+

フォームガチャ

diff --git a/styles/gacha.module.css b/styles/gacha.module.css index 6872d59..b5a945d 100644 --- a/styles/gacha.module.css +++ b/styles/gacha.module.css @@ -13,10 +13,12 @@ } .button { - padding: 15px 30px; + padding: 12px 25px; border: 1px solid var(--border-color); border-radius: 3px; background-color: transparent; + font-size: 1.01rem; + font-family: inherit; cursor: pointer; } @@ -59,9 +61,15 @@ } } +.message svg { + margin-right: 5px; + font-size: 1.05rem; + color: #555; +} + .link { padding: 8px 20px; border: 1px solid var(--border-color); color: #444; font-size: clamp(0.9rem, 1.35vw, 1.05rem); -} \ No newline at end of file +}