|
import React from "react"
|
|
import { Flex } from "@chakra-ui/react"
|
|
import { useLocation } from "@remix-run/react"
|
|
|
|
import { Splash } from "~/components/Splash/Splash"
|
|
import { useThingtime } from "~/components/Thingtime/useThingtime"
|
|
|
|
export default function Index() {
|
|
const location = useLocation()
|
|
const { pathname } = location
|
|
|
|
const strippedPathname = React.useMemo(() => {
|
|
// modify /rainbow/* to just *
|
|
|
|
const ret = pathname.split("/")[2]
|
|
|
|
if (ret) {
|
|
return decodeURI(ret)
|
|
}
|
|
|
|
return "rainbow"
|
|
}, [pathname])
|
|
|
|
const texts = React.useMemo(() => {
|
|
const ret = [strippedPathname]
|
|
|
|
return ret
|
|
}, [strippedPathname])
|
|
|
|
return (
|
|
<Flex
|
|
sx={{
|
|
"::selection": {
|
|
background: "transparent",
|
|
},
|
|
"::-moz-selection": {
|
|
background: "transparent",
|
|
},
|
|
"*": {
|
|
"::selection": {
|
|
background: "transparent",
|
|
},
|
|
"::-moz-selection": {
|
|
background: "transparent",
|
|
},
|
|
},
|
|
"* grammarly-extension": {
|
|
display: "none !important",
|
|
},
|
|
}}
|
|
alignItems="center"
|
|
justifyContent="center"
|
|
flexDirection="column"
|
|
maxWidth="100%"
|
|
>
|
|
<Splash texts={texts} ce={true}></Splash>
|
|
</Flex>
|
|
)
|
|
}
|