Updated some more stylings
This commit is contained in:
parent
d424504547
commit
b0132e4efe
|
@ -8,6 +8,7 @@ import Head from "next/head";
|
||||||
|
|
||||||
export default function BirthdaysPage() {
|
export default function BirthdaysPage() {
|
||||||
const [date, setDate] = useState(new Date());
|
const [date, setDate] = useState(new Date());
|
||||||
|
const [copied, setCopied] = useState("Copy!");
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Head>
|
<Head>
|
||||||
|
@ -19,15 +20,15 @@ export default function BirthdaysPage() {
|
||||||
<Paragraph>You can generate your birthday command here for UtiliBots' birthday bot.</Paragraph>
|
<Paragraph>You can generate your birthday command here for UtiliBots' birthday bot.</Paragraph>
|
||||||
<Heading>I was born on the...</Heading>
|
<Heading>I was born on the...</Heading>
|
||||||
<Paragraph>The format is <strong>DD/MM</strong>.</Paragraph>
|
<Paragraph>The format is <strong>DD/MM</strong>.</Paragraph>
|
||||||
<DatePicker className="mx-4" selected={date} onChange={
|
<DatePicker className="mx-4 dark:text-gray-300 dark:bg-gray-500 bg-white" selected={date} onChange={
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
date => setDate(date)
|
date => {setDate(date); setCopied("Copy!");}
|
||||||
}
|
}
|
||||||
dateFormat="dd/MM" />
|
dateFormat="dd/MM" />
|
||||||
<Heading>Command to set my birthday: </Heading>
|
<Heading>Command to set your birthday: </Heading>
|
||||||
<Paragraph>{`bd!setup ${Intl.DateTimeFormat().resolvedOptions().timeZone} ${moment(date).format("MM/DD")}`}</Paragraph>
|
<Paragraph>{`bd!setup ${Intl.DateTimeFormat().resolvedOptions().timeZone} ${moment(date).format("MM/DD")}`}</Paragraph>
|
||||||
<CopyToClipboard text={`bd!setup ${Intl.DateTimeFormat().resolvedOptions().timeZone} ${date.getMonth()+1}/${date.getDate()}`}>
|
<CopyToClipboard onCopy={() => setCopied("Copied!")} text={`bd!setup ${Intl.DateTimeFormat().resolvedOptions().timeZone} ${date.getMonth()+1}/${date.getDate()}`}>
|
||||||
<button className="mx-4 px-4 dark:text-gray-300 dark:bg-gray-500 bg-white">Copy!</button>
|
<button className="mx-4 px-4 dark:text-gray-300 dark:bg-gray-500 bg-white">{copied}</button>
|
||||||
</CopyToClipboard>
|
</CopyToClipboard>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|
Loading…
Reference in a new issue