redesign
diff --git a/pages/403.js b/pages/403.js
index aa6fa85..51da470 100644
--- a/pages/403.js
+++ b/pages/403.js
@@ -10,15 +10,15 @@
render() {
return (
<>
- <Header
- name="403"
- subtext="Forbidden - You do not have the correct permissions to view this page"
- gradient={["F27878", "D96B6B"]}
- wave="web/waves/header/rsm"
- buttons={[{color: "F27878", buttonText: "ffffff", text: "Go Home", link: "/#"}]}
- hideArrow={true}
- fullscreen={true}
- />
+ <Header
+ name="403"
+ subtext="Forbidden - You do not have the correct permissions to view this page"
+ gradient={["F27878", "D96B6B"]}
+ wave="web/waves/header/rsm"
+ buttons={[{color: "F27878", buttonText: "ffffff", text: "Go Home", link: "/#"}]}
+ hideArrow={true}
+ fullscreen={true}
+ />
</>
)
}
diff --git a/pages/404.js b/pages/404.js
index 5df568a..996d01c 100644
--- a/pages/404.js
+++ b/pages/404.js
@@ -10,20 +10,20 @@
render() {
return (
<>
- <Header
- name="404"
- subtext="Not Found"
- gradient={["F27878", "D96B6B"]}
- wave="web/waves/header/rsm"
- buttons={[
- {color: "F27878", buttonText: "ffffff", text: "Go Home", link: "/#"},
- {color: "F27878", buttonText: "ffffff", text: "Send Error",
- link: `mailto:staff@clicksminuteper.net?subject=Website%20Error%20Report&body=I%20got%20a%20404%20on%20the%20page%20%5BPlease%20Copy%20Website%20Link%20Here%5D`,
- target: true
- }]}
- hideArrow={true}
- fullscreen={true}
- />
+ <Header
+ name="404"
+ subtext="Not Found"
+ gradient={["F27878", "D96B6B"]}
+ wave="web/waves/header/rsm"
+ buttons={[
+ {color: "F27878", buttonText: "ffffff", text: "Go Home", link: "/#"},
+ {color: "F27878", buttonText: "ffffff", text: "Send Error",
+ link: `mailto:staff@clicksminuteper.net?subject=Website%20Error%20Report&body=I%20got%20a%20404%20on%20the%20page%20%5BPlease%20Copy%20Website%20Link%20Here%5D`,
+ target: true
+ }]}
+ hideArrow={true}
+ fullscreen={true}
+ />
</>
)
}
diff --git a/pages/418.js b/pages/418.js
index b8def20..dd3b042 100644
--- a/pages/418.js
+++ b/pages/418.js
@@ -10,15 +10,15 @@
render() {
return (
<>
- <Header
- name="418"
- subtext={<>I'm a teapot<br /><br />The request body was short and stout.<br />Tip me over and pour me out</>}
- gradient={["F27878", "D96B6B"]}
- wave="web/waves/header/rsm"
- buttons={[{color: "F27878", buttonText: "ffffff", text: "Go Home", link: "/#"}]}
- hideArrow={true}
- fullscreen={true}
- />
+ <Header
+ name="418"
+ subtext={<>I'm a teapot<br /><br />The request body was short and stout.<br />Tip me over and pour me out</>}
+ gradient={["F27878", "D96B6B"]}
+ wave="web/waves/header/rsm"
+ buttons={[{color: "F27878", buttonText: "ffffff", text: "Go Home", link: "/#"}]}
+ hideArrow={true}
+ fullscreen={true}
+ />
</>
)
}
diff --git a/pages/500.js b/pages/500.js
index faa5a54..a39f019 100644
--- a/pages/500.js
+++ b/pages/500.js
@@ -10,20 +10,20 @@
render() {
return (
<>
- <Header
- name="500"
- subtext="Internal Server Error"
- gradient={["F27878", "D96B6B"]}
- wave="web/waves/header/rsm"
- buttons={[
- {color: "F27878", buttonText: "ffffff", text: "Go Home", link: "/#"},
- {color: "F27878", buttonText: "ffffff", text: "Send Error",
- link: `mailto:staff@clicksminuteper.net?subject=Website%20Error%20Report&body=I%20got%20a%20500%20on%20the%20page%20%5BPlease%20Copy%20Website%20Link%20Here%5D`,
- target: true
- }]}
- hideArrow={true}
- fullscreen={true}
- />
+ <Header
+ name="500"
+ subtext="Internal Server Error"
+ gradient={["F27878", "D96B6B"]}
+ wave="web/waves/header/rsm"
+ buttons={[
+ {color: "F27878", buttonText: "ffffff", text: "Go Home", link: "/#"},
+ {color: "F27878", buttonText: "ffffff", text: "Send Error",
+ link: `mailto:staff@clicksminuteper.net?subject=Website%20Error%20Report&body=I%20got%20a%20500%20on%20the%20page%20%5BPlease%20Copy%20Website%20Link%20Here%5D`,
+ target: true
+ }]}
+ hideArrow={true}
+ fullscreen={true}
+ />
</>
)
}
diff --git a/pages/_app.js b/pages/_app.js
index d48ae06..59c30fc 100644
--- a/pages/_app.js
+++ b/pages/_app.js
@@ -16,7 +16,8 @@
cardBorder: '#C4C4C4',
cardFilter: 'rgba(0, 0, 0, 0)',
cardOverlay: '#00000080',
- hint: '#f1f1f1',
+ hint: '#E4E4E4',
+ panelColor: "#F0F0F0",
modes: {
dark: {
@@ -28,7 +29,8 @@
cardBorder: '#424242',
cardFilter: 'brightness(0.5)',
cardOverlay: '#42424280',
- hint: '#101010',
+ hint: '#242424',
+ panelColor: "rgba(255, 255, 255, 0.05)"
}
}
},
diff --git a/pages/castaway.js b/pages/castaway.js
index 0df3063..ad1535b 100644
--- a/pages/castaway.js
+++ b/pages/castaway.js
@@ -1,12 +1,5 @@
-import Head from 'next/head'
-import Image from 'next/image'
-import styles from '../styles/Home.module.css'
-import Card from '../Components/Card'
-import CardRow from '../Components/CardRow'
import Header from '../Components/Header'
-import AutoSpacing from '../Components/AutoSpacing'
-import SectionHeading from '../Components/SectionHeading'
-import Paragraph from '../Components/Paragraph'
+import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
export default function Home() {
return (
@@ -21,10 +14,13 @@
]}
hideArrow={true}
/>
- <AutoSpacing>
- <SectionHeading id="timeline">Development Timeline</SectionHeading>
- <Paragraph>Under construction</Paragraph>
- </AutoSpacing>
+ <AutoLayout>
+ <Panel halfSize={false} id="timeline">
+ <Divider />
+ <Title>Under Development</Title>
+ <Text>This bot is still in development, please check back later</Text>
+ </Panel>
+ </AutoLayout>
</>
)
}
diff --git a/pages/clicksforms.js b/pages/clicksforms.js
index f124d71..45b63df 100644
--- a/pages/clicksforms.js
+++ b/pages/clicksforms.js
@@ -1,10 +1,9 @@
import Card from '../Components/Card'
-import TileRow from '../Components/TileRow'
+import CardRow from '../Components/CardRow';
import Header from '../Components/Header'
-import AutoSpacing from '../Components/AutoSpacing'
-import SectionHeading from '../Components/SectionHeading'
-import Paragraph from '../Components/Paragraph'
-import CardRow from '../Components/CardRow'
+import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
+import { List, ListItem, Code } from '../Components/Texttools';
+import Link from 'next/link';
export default function Home() {
return (
@@ -15,39 +14,38 @@
gradient={["71AFE5", "6576CC"]}
wave="web/waves/header/clicksforms"
buttons={[
- {color: "6576CC", buttonText: "FFFFFF", link: "#features", text: "Features"},
+ // {color: "6576CC", buttonText: "FFFFFF", link: "#features", text: "Features"},
{color: "6576CC", buttonText: "FFFFFF", link: "#commands", text: "Commands"},
{color: "6576CC", buttonText: "FFFFFF", link: "#services", text: "Services"},
{color: "775EBF", buttonText: "FFFFFF", link: "#invite", text: "Invite"}
]}
hideArrow={true}
/>
- <AutoSpacing>
- <SectionHeading id="features">Features</SectionHeading>
- <TileRow divless={true}>
- <img alt="Anonymous forms" src="https://assets.clicksminuteper.net/web/features/clicksforms/Anonymous.svg" />
- <img alt="Discord buttons" src="https://assets.clicksminuteper.net/web/features/clicksforms/Buttons.svg" />
- <img alt="Export formats" src="https://assets.clicksminuteper.net/web/features/clicksforms/Export.svg" />
- <img alt="Up to 25 Forms" src="https://assets.clicksminuteper.net/web/features/clicksforms/Forms.svg" />
- <img alt="Multiple Choice" src="https://assets.clicksminuteper.net/web/features/clicksforms/Multichoice.svg" />
- <img alt="Up to 25 questions" src="https://assets.clicksminuteper.net/web/features/clicksforms/Questions.svg" />
- <img alt="Many question types" src="https://assets.clicksminuteper.net/web/features/clicksforms/Types.svg" />
- <img alt="Easily view responses" src="https://assets.clicksminuteper.net/web/features/clicksforms/Responses.svg" />
- </TileRow>
- <SectionHeading id="commands">Commands</SectionHeading>
- <Paragraph><code>/accept</code>: Completes a form you are asked to fill in</Paragraph>
- <Paragraph><code>/apply</code>: Apply to a form</Paragraph>
- <Paragraph><code>/create</code>: Creates a new form</Paragraph>
- <Paragraph><code>/download</code>: Downloads a form from a service e.g. Google Forms</Paragraph>
- <Paragraph><code>/help</code>: Lists all commands</Paragraph>
- <Paragraph><code>/responses</code>: Lets you view responses to your servers form</Paragraph>
- <Paragraph><code>/manage</code>: Lets you manage your servers forms</Paragraph>
- <SectionHeading id="services">Services</SectionHeading>
- <Paragraph>ClicksForms support services like <a href="https://forms.google.com">Google Forms</a> through our Add-on</Paragraph>
- <Paragraph>Our API is public. You can view it on <a href="https://clicksminuteper.github.io/docs/clicksforms">GitHub</a></Paragraph>
- <SectionHeading id="invite">Invite</SectionHeading>
- <CardRow>
- <Card
+ <AutoLayout>
+ <Panel halfSize={true} id="commands">
+ <Title>Commands</Title>
+ <Divider />
+ <Text>Standard commands to use ClicksForms</Text>
+ <List colour="6576CC">
+ <ListItem><Code colour="6576CC">/accept</Code> Completes a form you are asked to fill in.</ListItem>
+ <ListItem><Code colour="6576CC">/apply</Code> Apply to a form.</ListItem>
+ <ListItem><Code colour="6576CC">/create</Code> Creates a new form.</ListItem>
+ <ListItem><Code colour="6576CC">/download</Code> Downloads a form from a service e.g. Google Forms.</ListItem>
+ <ListItem><Code colour="6576CC">/help</Code> Lists all commands.</ListItem>
+ <ListItem><Code colour="6576CC">/responses</Code> Lets you view responses to your servers form.</ListItem>
+ <ListItem><Code colour="6576CC">/manage</Code> Lets you manage your servers forms.</ListItem>
+ </List>
+ </Panel>
+ <Panel halfSize={true} id="services">
+ <Title>Services</Title>
+ <Divider />
+ <Text>ClicksForms supports services such as <a href="https://docs.google.com/forms">Google Forms</a> through our Add-on.</Text>
+ <Text>Our API is public. You can view it <Link href="/clicksforms/privacy">GitHub</Link>.</Text>
+ </Panel>
+ <Panel halfSize={true} id="invite">
+ <Title>Invite</Title>
+ <Divider />
+ <CardRow><Card
wave="clicksforms"
icon="bots/clicksforms/circle"
buttonText={"FFFFFF"} gradient={["71AFE5", "6576CC"]}
@@ -56,11 +54,9 @@
buttons={[
{color: "775EBF", link: "https://discord.com/api/oauth2/authorize?client_id=805392054678192169&permissions=2416307200&scope=bot%20applications.commands", text: "Invite"}
]}
- />
- </CardRow>
- <SectionHeading>Legal</SectionHeading>
- <Paragraph>Our privacy policy can be viewed on <a href="https://clicksminuteper.net/clicksforms/privacy">GitHub</a></Paragraph>
- </AutoSpacing>
+ /></CardRow>
+ </Panel>
+ </AutoLayout>
</>
)
}
diff --git a/pages/clicksforms/docs.js b/pages/clicksforms/docs.js
index 9c36ef9..cc2d584 100644
--- a/pages/clicksforms/docs.js
+++ b/pages/clicksforms/docs.js
@@ -1,3 +1,32 @@
export default function policy() {
return (<iframe style={{height:"100vh",width:"100vw"}} src="https://clicksminuteper.github.io/docs/clicksforms" />)
-}
\ No newline at end of file
+}
+
+// import Header from '../Components/Header'
+// import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
+
+// export default function Home() {
+// return (
+// <>
+// <Header
+// name="ClicksForms"
+// subtext="Custom forms on Discord"
+// gradient={["71AFE5", "6576CC"]}
+// wave="web/waves/header/clicksforms"
+// buttons={[
+// {color: "6576CC", buttonText: "FFFFFF", link: "#endpoints", text: "Endpoints"},
+// {color: "6576CC", buttonText: "FFFFFF", link: "#structures", text: "Structures"},
+// {color: "775EBF", buttonText: "FFFFFF", link: "#invite", text: "Invite"}
+// ]}
+// hideArrow={true}
+// />
+// <AutoLayout>
+// <Panel halfSize={false} id="timeline">
+// <Divider />
+// <Title>Under Development</Title>
+// <Text>This bot is still in development, please check back later</Text>
+// </Panel>
+// </AutoLayout>
+// </>
+// )
+// }
diff --git a/pages/clicksforms/form.js b/pages/clicksforms/form.js
index 661fccc..47b2275 100644
--- a/pages/clicksforms/form.js
+++ b/pages/clicksforms/form.js
@@ -1,7 +1,6 @@
import Header from '../../Components/Header'
import { Component } from 'react'
import Styles from '../../styles/clicksforms/form.module.css';
-import Paragraph from '../../Components/Paragraph';
import Question from '../../Components/ClicksForms/Question';
export default class Form extends Component {
diff --git a/pages/cpm.js b/pages/cpm.js
index ada66b9..22b3a68 100644
--- a/pages/cpm.js
+++ b/pages/cpm.js
@@ -1,112 +1,118 @@
-import Card from '../Components/Card'
-import CardRow from '../Components/CardRow'
-import Header from '../Components/Header'
-import AutoSpacing from '../Components/AutoSpacing'
-import SectionHeading from '../Components/SectionHeading'
-import Paragraph from '../Components/Paragraph'
-import Link from 'next/link'
+import Card from '../Components/Card';
+import CardRow from '../Components/CardRow';
+import Header from '../Components/Header';
+import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
export default function Home() {
return (
<>
<Header
name="Clicks Per Minute"
- subtext="Crappy projects mate!"
+ subtext="Crappy Projects Mate"
gradient={["6576CC", "4B5899"]}
wave="web/waves/header/cmp"
buttons={[]}
/>
<p id="start" />
- <AutoSpacing>
- <SectionHeading>This page is a joke</SectionHeading>
- <Paragraph>This website is a joke. Our main homepage is <Link href="/">here</Link></Paragraph>
- <SectionHeading>OUr stuff</SectionHeading>
- <CardRow>
+ <AutoLayout>
+ <Panel halfSize={false}>
+ <Title>Projects</Title>
+ <Divider />
+ <CardRow>
+ <Card
+ wave="gps" title="GPS" subtext="Satelite navigation on Discord - Get tracked easily"
+ icon="bots/gps/circle"
+ buttons={[
+ {color: "6576CC", link: "https://discordapp.com/oauth2/authorize?client_id=679361555732627476&scope=bot&permissions=130048", text: "Invite"},
+ {color: "6576CC", link: "/gps", text: "Abot"}
+ ]}
+ buttonText={"FFFFFF"} gradient={["78ECF2", "71AFE5"]}
+ />
+ <Card
+ wave="rsm" title="RSM" subtext="Moderation, it's about average"
+ icon="bots/rsm/circle"
+ buttons={[
+ {color: "424242", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands",text:"Invite"},
+ {color: "424242", link: "/rsm", text:"About"}
+ ]}
+ buttonText={"FFFFFF"} gradient={["F27878", "D96B6B"]}
+ />
+ <Card
+ wave="clicksforms" title="ClocksForms" subtext="Submit your data directly to us!"
+ icon="bots/clicksforms/circle"
+ buttons={[
+ {color: "775EBF", link: "https://clicksminuteper.github.io/docs/clicksforms", text:"APi", newTab: true},
+ {color: "775EBF", link: "https://discord.com/api/oauth2/authorize?client_id=805392054678192169&permissions=2416307200&scope=bot%20applications.commands",text:"Invite"},
+ {color: "775EBF", link: "/clicksforms", text: "About"}
+ ]}
+ buttonText={"FFFFFF"} gradient={["71AFE5", "6576CC"]}
+ />
+ <Card
+ wave="castaway" title="Castway" subtext="Idk its not made yet, im just the web developer"
+ icon="bots/castaway/circle"
+ buttons={[
+ {color: "F2D478", link: "/castaway", text: "About"}
+ ]}
+ buttonText={"000000"} gradient={["71AFE5", "78ECF2"]}
+ />
+ <Card
+ wave="hooky" title="Hooky" subtext="No, its not what you think from that name"
+ icon="bots/hooky/circle"
+ buttons={[
+ {color: "EDC575", link: "https://discord.com/oauth2/authorize?client_id=752188923505279037&scope=bot&permissions=536882176", text: "Invit"},
+ {color: "EDC575", link: "/hooky", text: "e About"}
+ ]}
+ buttonText={"000000"} gradient={["424242", "8D8D8D"]}
+ />
+ <Card
+ wave="clcks" title="Clcks" subtext="(This one genuinely isn't a typo)"
+ icon="web/icons/clcks"
+ buttons={[
+ {color: "78ECF2", link: "https://clcks.dev", text: "View Apps"
+ }]}
+ buttonText={"000000"} gradient={["C4C4C4", "8D8D8D"]}
+ />
+ </CardRow>
+ </Panel>
+ <Panel halfSize={true}>
+ <Title>Steal our code</Title>
+ <Divider />
+ <Text>I dare you.</Text>
+ <CardRow>
+ <Card
+ wave="github" title="GitHub" subtext="Git clone someone's repo, and push to your own"
+ icon="web/icons/github"
+ buttons={[
+ {color: "424242", link: "https://github.com/clicksminuteper", text: "Sacrifice your soul"}
+ ]}
+ buttonText={"FFFFFF"} gradient={["FFFFFF", "C4C4C4"]}
+ />
+ <Card
+ wave="pypi" title="PyPi" subtext="pypipypipypipypipypipi"
+ icon="web/icons/pypi"
+ buttons={[
+ {color: "FFC91E", link: "https://pypi.org/user/ClicksMinutePer/", text: "Visit"}
+ ]}
+ buttonText={"000000"} gradient={["2F6490", "3775A8"]}
+ />
+ </CardRow>
+ </Panel>
+ <Panel halfSize={true}>
+ <Title>Stranger Danger</Title>
+ <Divider />
+ <Text>Your parents were right, this place is terrifying</Text>
+ <CardRow>
<Card
- wave="gps" title="GPS" subtext="Satelite navigation on Discord - Get tracked easily"
- icon="bots/gps/circle"
- buttons={[
- {color: "6576CC", link: "https://discordapp.com/oauth2/authorize?client_id=679361555732627476&scope=bot&permissions=130048", text: "Invite"},
- {color: "6576CC", link: "/gps", text: "Abot"}
- ]}
- buttonText={"FFFFFF"} gradient={["78ECF2", "71AFE5"]}
- />
- <Card
- wave="rsm" title="RSM" subtext="Moderation, it's about average"
- icon="bots/rsm/circle"
- buttons={[
- {color: "424242", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands",text:"Invite"},
- {color: "424242", link: "/rsm", text:"About"}
- ]}
- buttonText={"FFFFFF"} gradient={["F27878", "D96B6B"]}
- />
- <Card
- wave="clicksforms" title="ClocksForms" subtext="Submit your data directly to us!"
- icon="bots/clicksforms/circle"
- buttons={[
- {color: "775EBF", link: "https://clicksminuteper.github.io/docs/clicksforms", text:"APi", newTab: true},
- {color: "775EBF", link: "https://discord.com/api/oauth2/authorize?client_id=805392054678192169&permissions=2416307200&scope=bot%20applications.commands",text:"Invite"},
- {color: "775EBF", link: "/clicksforms", text: "About"}
- ]}
- buttonText={"FFFFFF"} gradient={["71AFE5", "6576CC"]}
- />
- <Card
- wave="castaway" title="Castway" subtext="Idk its not made yet, im just the web developer"
- icon="bots/castaway/circle"
- buttons={[
- {color: "F2D478", link: "/castaway", text: "About"}
- ]}
- buttonText={"000000"} gradient={["71AFE5", "78ECF2"]}
- />
- <Card
- wave="hooky" title="Hooky" subtext="No, its not what you think from that name"
- icon="bots/hooky/circle"
- buttons={[
- {color: "EDC575", link: "https://discord.com/oauth2/authorize?client_id=752188923505279037&scope=bot&permissions=536882176", text: "Invit"},
- {color: "EDC575", link: "/hooky", text: "e About"}
- ]}
- buttonText={"000000"} gradient={["424242", "8D8D8D"]}
- />
- <Card
- wave="clcks" title="Clcks" subtext="(This one genuinely isn't a typo)"
- icon="web/icons/clcks"
- buttons={[
- {color: "78ECF2", link: "https://clcks.dev", text: "View Apps"
- }]}
- buttonText={"000000"} gradient={["C4C4C4", "8D8D8D"]}
- />
- </CardRow>
- <SectionHeading>Steal our code</SectionHeading>
- <CardRow>
- <Card
- wave="github" title="GitHub" subtext="Git clone someone's repo, and push to your own"
- icon="web/icons/github"
- buttons={[
- {color: "424242", link: "https://github.com/clicksminuteper", text: "Visit"}
- ]}
- buttonText={"FFFFFF"} gradient={["FFFFFF", "C4C4C4"]}
- />
- <Card
- wave="pypi" title="PyPi" subtext="Pypi"
- icon="web/icons/pypi"
- buttons={[
- {color: "FFC91E", link: "https://pypi.org/user/ClicksMinutePer/", text: "Visit"}
- ]}
- buttonText={"000000"} gradient={["2F6490", "3775A8"]}
- />
- </CardRow>
- <SectionHeading>Social media (stranger danger)</SectionHeading>
- <CardRow>
- <Card
- wave="discord" title="Discord" subtext="We don't even need to insult discord, its bad."
+ wave="discord" title="Discord" subtext="No, dat cord sorry for the confusion"
icon="web/icons/discord"
buttons={[
{color: "404EED", link: "https://discord.gg/bPaNnxe", text: "Join"}
]}
buttonText={"FFFFFF"} gradient={["404EED", "404EED"]}
/>
- </CardRow>
- </AutoSpacing>
+ </CardRow>
+ </Panel>
+ </AutoLayout>
</>
)
}
diff --git a/pages/gps.js b/pages/gps.js
index 1354ee8..aeb9dd8 100644
--- a/pages/gps.js
+++ b/pages/gps.js
@@ -1,9 +1,8 @@
import Card from '../Components/Card'
+import CardRow from '../Components/CardRow';
import Header from '../Components/Header'
-import AutoSpacing from '../Components/AutoSpacing'
-import SectionHeading from '../Components/SectionHeading'
-import Paragraph from '../Components/Paragraph'
-import CardRow from '../Components/CardRow'
+import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
+import { List, ListItem, Code } from '../Components/Texttools';
export default function Home() {
return (
@@ -20,74 +19,85 @@
]}
hideArrow={true}
/>
- <AutoSpacing>
- <SectionHeading id="features">Features</SectionHeading>
- <CardRow>
- <Card
- icon="web/icons/gps/players"
- title="Lots of friends?"
- subtext="You probably don't have 50 friends - But if you did, you can play with every one of them at the same time"
- wave="gps"
- gradient={["78ECF2", "71AFE5"]}
- />
- <Card
- icon="web/icons/gps/cards"
- title="2000+ cards"
- subtext="Enjoy games with over 2000 cards, written for you to insult others"
- wave="clicksforms"
- gradient={["71AFE5", "6576CC"]}
- />
- <Card
- icon="web/icons/gps/customisation"
- title="Customisation."
- subtext="Customise every setting of your game and be as pedantic as you wish"
- wave="hooky"
- gradient={["424242", "8D8D8D"]}
- />
- <Card
- icon="web/icons/gps/time"
- title="Patience is a virtue"
- subtext="But you don't have a lot of it - Your friends may be slow at picking cards, but you don't have to live with it"
- wave="rsm"
- gradient={["F27878", "D96B6B"]}
- />
- <Card
- icon="web/icons/gps/shuffles"
- title="Shuffles"
- subtext={`Replace your worst cards with new ones because \"The bot is unfair
- and always gives me the worst cards and everyone else is better at the game than me\"`}
- wave="clcks"
- gradient={["C4C4C4", "8D8D8D"]}
- />
- </CardRow>
- <SectionHeading id="commands">Commands</SectionHeading>
- <Paragraph><code>$getprefix</code>: Shows the bots prefix in the current guild.</Paragraph>
- <Paragraph><code>$info</code>: View some information about the bot's owners.</Paragraph>
- <Paragraph><code>$stats</code>: Shows the bot's current statistics.</Paragraph>
- <Paragraph><code>$ping</code>: Gets the current response time of the bot.</Paragraph>
- <Paragraph><code>$terms</code>: List all the terms and conditions for the bot.</Paragraph>
- <Paragraph><code>$setlanguage</code>: Set what language you want to use for your packs.</Paragraph>
- <Paragraph><code>$packs</code>: Shows a list of packs available in your language.</Paragraph>
- <Paragraph><code>$play</code>: Starts the game.</Paragraph>
- <Paragraph><code>$join</code>: Joins an active game in the channel. This can be during the 1m period when starting a game, or midway through.</Paragraph>
- <Paragraph><code>$leave</code>: Removes the player who ran it from the current game in that channel.</Paragraph>
- <Paragraph><code>$shuffle</code>: Reshuffles your cards.</Paragraph>
- <Paragraph><code>$end</code>: Ends the current game in that channel.</Paragraph>
- <Paragraph><code>$help</code>: Shows all commands</Paragraph>
- <SectionHeading id="invite">Invite</SectionHeading>
- <CardRow>
- <Card
- wave="gps"
- icon="bots/gps/circle"
- buttonText={"FFFFFF"} gradient={["78ECF2", "71AFE5"]}
- title="Invite"
- subtext="Invite GPS to your server"
- buttons={[
- {color: "6576CC", link: "https://discordapp.com/oauth2/authorize?client_id=679361555732627476&scope=bot&permissions=130048", text: "Invite"}
- ]}
- />
- </CardRow>
- </AutoSpacing>
+ <AutoLayout>
+ <Panel halfSize={false} id="features">
+ <Title>Features</Title>
+ <Divider />
+ <CardRow>
+ <Card
+ icon="web/icons/gps/players"
+ title="Lots of friends?"
+ subtext="You probably don't have 50 friends - But if you did, you can play with every one of them at the same time"
+ wave="gps"
+ gradient={["78ECF2", "71AFE5"]}
+ />
+ <Card
+ icon="web/icons/gps/cards"
+ title="2000+ cards"
+ subtext="Enjoy games with over 2000 cards, written for you to insult others"
+ wave="clicksforms"
+ gradient={["71AFE5", "6576CC"]}
+ />
+ <Card
+ icon="web/icons/gps/customisation"
+ title="Customisation."
+ subtext="Customise every setting of your game and be as pedantic as you wish"
+ wave="hooky"
+ gradient={["424242", "8D8D8D"]}
+ />
+ <Card
+ icon="web/icons/gps/time"
+ title="Patience is a virtue"
+ subtext="But you don't have a lot of it - Your friends may be slow at picking cards, but you don't have to live with it"
+ wave="rsm"
+ gradient={["F27878", "D96B6B"]}
+ />
+ <Card
+ icon="web/icons/gps/shuffles"
+ title="Shuffles"
+ subtext={`Replace your worst cards with new ones because \"The bot is unfair
+ and always gives me the worst cards and everyone else is better at the game than me\"`}
+ wave="clcks"
+ gradient={["C4C4C4", "8D8D8D"]}
+ />
+ </CardRow>
+ </Panel>
+ <Panel halfSize={true} id="commands">
+ <Title>Commands</Title>
+ <Divider />
+ <List colour="71AFE5">
+ <ListItem><Code colour="71AEF5">$getprefix</Code> Shows the bots prefix in the current server.</ListItem>
+ <ListItem><Code colour="71AEF5">$info</Code> View some information about the bot's owners.</ListItem>
+ <ListItem><Code colour="71AEF5">$stats</Code> Shows the bot's current statistics.</ListItem>
+ <ListItem><Code colour="71AEF5">$ping</Code> Gets the current response time of the bot.</ListItem>
+ <ListItem><Code colour="71AEF5">$terms</Code> List all the terms and conditions for the bot.</ListItem>
+ <ListItem><Code colour="71AEF5">$setlanguage</Code> Set what language you want to use for your packs.</ListItem>
+ <ListItem><Code colour="71AEF5">$packs</Code> Shows a list of packs available in your language.</ListItem>
+ <ListItem><Code colour="71AEF5">$play</Code> Starts the game.</ListItem>
+ <ListItem><Code colour="71AEF5">$join</Code> Joins an active game in the channel. This can be during the 1m period when starting a game, during the game.</ListItem>
+ <ListItem><Code colour="71AEF5">$leave</Code> Removes the player who ran it from the current game in that channel.</ListItem>
+ <ListItem><Code colour="71AEF5">$shuffle</Code> Reshuffles your cards.</ListItem>
+ <ListItem><Code colour="71AEF5">$end</Code> Ends the current game in that channel.</ListItem>
+ <ListItem><Code colour="71AEF5">$help</Code> Shows all commands.</ListItem>
+ </List>
+ </Panel>
+ <Panel halfSize={true} id="invite">
+ <Title>Invite</Title>
+ <Divider />
+ <CardRow>
+ <Card
+ wave="gps"
+ icon="bots/gps/circle"
+ buttonText={"FFFFFF"} gradient={["78ECF2", "71AFE5"]}
+ title="Invite"
+ subtext="Invite GPS to your server"
+ buttons={[
+ {color: "6576CC", link: "https://discordapp.com/oauth2/authorize?client_id=679361555732627476&scope=bot&permissions=130048", text: "Invite"}
+ ]}
+ />
+ </CardRow>
+ </Panel>
+ </AutoLayout>
</>
)
}
diff --git a/pages/hooky.js b/pages/hooky.js
index 4402c12..50573c9 100644
--- a/pages/hooky.js
+++ b/pages/hooky.js
@@ -1,12 +1,7 @@
-import Head from 'next/head'
-import Image from 'next/image'
-import styles from '../styles/Home.module.css'
import Card from '../Components/Card'
-import CardRow from '../Components/CardRow'
+import CardRow from '../Components/CardRow';
import Header from '../Components/Header'
-import AutoSpacing from '../Components/AutoSpacing'
-import SectionHeading from '../Components/SectionHeading'
-import Paragraph from '../Components/Paragraph'
+import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
export default function Home() {
return (
@@ -21,21 +16,24 @@
]}
hideArrow={true}
/>
- <AutoSpacing>
- <SectionHeading id="invite">Invite</SectionHeading>
- <CardRow>
- <Card
- wave="hooky"
- icon="bots/hooky/circle"
- buttonText={"000000"} gradient={["424242", "8D8D8D"]}
- title="Invite"
- subtext="Invite Hooky to your server"
- buttons={[
- {color: "EDC575", link: "https://discord.com/oauth2/authorize?client_id=752188923505279037&scope=bot&permissions=536882176", text: "Invite"}
- ]}
- />
- </CardRow>
- </AutoSpacing>
+ <AutoLayout>
+ <Panel halfSize={false} id="invite">
+ <Title>Invite</Title>
+ <Divider />
+ <CardRow>
+ <Card
+ wave="hooky"
+ icon="bots/hooky/circle"
+ buttonText={"000000"} gradient={["424242", "8D8D8D"]}
+ title="Invite"
+ subtext="Invite Hooky to your server"
+ buttons={[
+ {color: "EDC575", link: "https://discord.com/oauth2/authorize?client_id=752188923505279037&scope=bot&permissions=536882176", text: "Invite"}
+ ]}
+ />
+ </CardRow>
+ </Panel>
+ </AutoLayout>
</>
)
}
diff --git a/pages/index.js b/pages/index.js
index 0ab4087..80ee8a0 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -1,11 +1,7 @@
-import Head from 'next/head'
-import Image from 'next/image'
-import styles from '../styles/Home.module.css'
-import Card from '../Components/Card'
-import CardRow from '../Components/CardRow'
-import Header from '../Components/Header'
-import AutoSpacing from '../Components/AutoSpacing'
-import SectionHeading from '../Components/SectionHeading'
+import Card from '../Components/Card';
+import CardRow from '../Components/CardRow';
+import Header from '../Components/Header';
+import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
export default function Home() {
return (
@@ -18,84 +14,94 @@
buttons={[]}
/>
<p id="start" />
- <AutoSpacing>
- <SectionHeading>Projects</SectionHeading>
- <CardRow>
- <Card
- wave="gps" title="GPS" subtext="Cards Against Humanity on Discord"
- icon="bots/gps/circle"
- buttons={[
- {color: "6576CC", link: "https://discordapp.com/oauth2/authorize?client_id=679361555732627476&scope=bot&permissions=130048", text: "Invite"},
- {color: "6576CC", link: "/gps", text: "About"}
- ]}
- buttonText={"FFFFFF"} gradient={["78ECF2", "71AFE5"]}
- />
- <Card
- wave="rsm" title="RSM" subtext="Moderation Redefined"
- icon="bots/rsm/circle"
- buttons={[
- {color: "424242", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands",text:"Invite"},
- {color: "424242", link: "/rsm", text:"About"}
- ]}
- buttonText={"FFFFFF"} gradient={["F27878", "D96B6B"]}
- />
- <Card
- wave="clicksforms" title="ClicksForms" subtext="Create custom forms for Discord"
- icon="bots/clicksforms/circle"
- buttons={[
- {color: "775EBF", link: "https://clicksminuteper.github.io/docs/clicksforms", text:"API", newTab: true},
- {color: "775EBF", link: "https://discord.com/api/oauth2/authorize?client_id=805392054678192169&permissions=2416307200&scope=bot%20applications.commands",text:"Invite"},
- {color: "775EBF", link: "/clicksforms", text: "About"}
- ]}
- buttonText={"FFFFFF"} gradient={["71AFE5", "6576CC"]}
- />
- <Card
- wave="castaway" title="Castaway" subtext="Stranded on Discord"
- icon="bots/castaway/circle"
- buttons={[
- {color: "F2D478", link: "/castaway", text: "About"}
- ]}
- buttonText={"000000"} gradient={["71AFE5", "78ECF2"]}
- />
- <Card
- wave="hooky" title="Hooky" subtext="Webhook protection for Discord"
- icon="bots/hooky/circle"
- buttons={[
- {color: "EDC575", link: "https://discord.com/oauth2/authorize?client_id=752188923505279037&scope=bot&permissions=536882176", text: "Invite"},
- {color: "EDC575", link: "/hooky", text: "About"}
- ]}
- buttonText={"000000"} gradient={["424242", "8D8D8D"]}
- />
- <Card
- wave="clcks" title="Clcks" subtext="Clicks Minute Per web apps"
- icon="web/icons/clcks"
- buttons={[
- {color: "78ECF2", link: "https://clcks.dev", text: "View Apps"
- }]}
- buttonText={"000000"} gradient={["C4C4C4", "8D8D8D"]}
- />
- </CardRow>
- <SectionHeading>Code Bases</SectionHeading>
- <CardRow>
- <Card
- wave="github" title="GitHub" subtext="View our open source projects"
- icon="web/icons/github"
- buttons={[
- {color: "424242", link: "https://github.com/clicksminuteper", text: "Visit"}
- ]}
- buttonText={"FFFFFF"} gradient={["FFFFFF", "C4C4C4"]}
- />
- <Card
- wave="pypi" title="PyPi" subtext="View our modules for python"
- icon="web/icons/pypi"
- buttons={[
- {color: "FFC91E", link: "https://pypi.org/user/ClicksMinutePer/", text: "Visit"}
- ]}
- buttonText={"000000"} gradient={["2F6490", "3775A8"]}
- />
- </CardRow>
- <SectionHeading>Socials</SectionHeading>
- <CardRow>
+ <AutoLayout>
+ <Panel halfSize={false}>
+ <Title>Projects</Title>
+ <Divider />
+ <CardRow>
+ <Card
+ wave="gps" title="GPS" subtext="Cards Against Humanity on Discord"
+ icon="bots/gps/circle"
+ buttons={[
+ {color: "6576CC", link: "https://discordapp.com/oauth2/authorize?client_id=679361555732627476&scope=bot&permissions=130048", text: "Invite"},
+ {color: "6576CC", link: "/gps", text: "About"}
+ ]}
+ buttonText={"FFFFFF"} gradient={["78ECF2", "71AFE5"]}
+ />
+ <Card
+ wave="rsm" title="RSM" subtext="Moderation Redefined"
+ icon="bots/rsm/circle"
+ buttons={[
+ {color: "424242", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands",text:"Invite"},
+ {color: "424242", link: "/rsm", text:"About"}
+ ]}
+ buttonText={"FFFFFF"} gradient={["F27878", "D96B6B"]}
+ />
+ <Card
+ wave="clicksforms" title="ClicksForms" subtext="Create custom forms for Discord"
+ icon="bots/clicksforms/circle"
+ buttons={[
+ {color: "775EBF", link: "https://clicksminuteper.github.io/docs/clicksforms", text:"API", newTab: true},
+ {color: "775EBF", link: "https://discord.com/api/oauth2/authorize?client_id=805392054678192169&permissions=2416307200&scope=bot%20applications.commands",text:"Invite"},
+ {color: "775EBF", link: "/clicksforms", text: "About"}
+ ]}
+ buttonText={"FFFFFF"} gradient={["71AFE5", "6576CC"]}
+ />
+ <Card
+ wave="castaway" title="Castaway" subtext="Stranded on Discord"
+ icon="bots/castaway/circle"
+ buttons={[
+ {color: "F2D478", link: "/castaway", text: "About"}
+ ]}
+ buttonText={"000000"} gradient={["71AFE5", "78ECF2"]}
+ />
+ <Card
+ wave="hooky" title="Hooky" subtext="Webhook protection for Discord"
+ icon="bots/hooky/circle"
+ buttons={[
+ {color: "EDC575", link: "https://discord.com/oauth2/authorize?client_id=752188923505279037&scope=bot&permissions=536882176", text: "Invite"},
+ {color: "EDC575", link: "/hooky", text: "About"}
+ ]}
+ buttonText={"000000"} gradient={["424242", "8D8D8D"]}
+ />
+ <Card
+ wave="clcks" title="Clcks" subtext="Clicks Minute Per web apps"
+ icon="web/icons/clcks"
+ buttons={[
+ {color: "78ECF2", link: "https://clcks.dev", text: "View Apps"
+ }]}
+ buttonText={"000000"} gradient={["C4C4C4", "8D8D8D"]}
+ />
+ </CardRow>
+ </Panel>
+ <Panel halfSize={true}>
+ <Title>Code Bases</Title>
+ <Divider />
+ <Text>View any open source projects by Clicks on the following sites:</Text>
+ <CardRow>
+ <Card
+ wave="github" title="GitHub" subtext="View our open source projects"
+ icon="web/icons/github"
+ buttons={[
+ {color: "424242", link: "https://github.com/clicksminuteper", text: "Visit"}
+ ]}
+ buttonText={"FFFFFF"} gradient={["FFFFFF", "C4C4C4"]}
+ />
+ <Card
+ wave="pypi" title="PyPi" subtext="View our modules for python"
+ icon="web/icons/pypi"
+ buttons={[
+ {color: "FFC91E", link: "https://pypi.org/user/ClicksMinutePer/", text: "Visit"}
+ ]}
+ buttonText={"000000"} gradient={["2F6490", "3775A8"]}
+ />
+ </CardRow>
+ </Panel>
+ <Panel halfSize={true}>
+ <Title>Socials</Title>
+ <Divider />
+ <Text>Talk to us and ask us anything!</Text>
+ <CardRow>
<Card
wave="discord" title="Discord" subtext="Join our Discord server to talk with the community"
icon="web/icons/discord"
@@ -104,8 +110,9 @@
]}
buttonText={"FFFFFF"} gradient={["404EED", "404EED"]}
/>
- </CardRow>
- </AutoSpacing>
+ </CardRow>
+ </Panel>
+ </AutoLayout>
</>
)
}
diff --git a/pages/rsm.js b/pages/rsm.js
index 7ea5071..fba630c 100644
--- a/pages/rsm.js
+++ b/pages/rsm.js
@@ -1,10 +1,7 @@
import Card from '../Components/Card'
-import TileRow from '../Components/TileRow'
import Header from '../Components/Header'
-import AutoSpacing from '../Components/AutoSpacing'
-import SectionHeading from '../Components/SectionHeading'
-import Subheading from '../Components/Subheading'
-import Paragraph from '../Components/Paragraph'
+import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
+import { List, ListItem, Code } from '../Components/Texttools';
import CardRow from '../Components/CardRow'
// import FeatureImages from '../public/Features/RSM/Images.svg';
@@ -27,79 +24,86 @@
gradient={["F27878", "D96B6B"]}
wave="web/waves/header/rsm"
buttons={[
- {color: "424242", buttonText: "FFFFFF", link: "#features", text: "Features"},
+ // {color: "424242", buttonText: "FFFFFF", link: "#features", text: "Features"},
{color: "424242", buttonText: "FFFFFF", link: "#commands", text: "Commands"},
{color: "F27878", buttonText: "FFFFFF", link: "#invite", text: "Invite"}
]}
hideArrow={true}
/>
- <AutoSpacing>
- <SectionHeading id="features">Features</SectionHeading>
- <Paragraph>For a full list of features, check our commands</Paragraph>
- {/* <TileRow divless={false}>
- <FeatureImages />
- <FeatureAutomate />
- <FeatureCAPTCHA />
- <FeatureDeveloped />
- <FeatureLogging />
- <FeatureNSFW />
- <FeaturePunish />
- <FeatureRaids />
- <FeatureStatistics />
- <FeatureTags />
- </TileRow> */}
- <SectionHeading id="commands">Commands</SectionHeading>
- <Paragraph><code>m!info</code>: Shows all commands and info.</Paragraph>
- <Paragraph><code>m!stats</code>: Shows the bot statistics</Paragraph>
- <Paragraph><code>m!settings</code>: Shows your servers log settings.</Paragraph>
- <Paragraph><code>m!user</code>: Shows information about a user.</Paragraph>
- <Paragraph><code>m!avatar</code>: Shows a users avatar.</Paragraph>
- <Paragraph><code>m!roleall</code>: Role all humans or bots in the server.</Paragraph>
- <Paragraph><code>m!suggest</code>: Sends a suggestion to add to the bot for voting.</Paragraph>
- <Paragraph><code>m!ping</code>: Checks the bots ping time.</Paragraph>
- <Paragraph><code>m!server</code>: Shows all information about your server.</Paragraph>
- <Paragraph><code>m!tag</code>: m!tag create/delete title text, or m!tag title</Paragraph>
- <Paragraph><code>m!role</code>: With Role: Shows information about a role.</Paragraph>
- <Paragraph><code>m!role</code>: With Mention: Lets you edit or view a users roles.</Paragraph>
- <Paragraph><code>m!viewas</code>: Shows the channels that a member can see.</Paragraph>
- <Paragraph><code>m!verify</code>: Lets users verify in your server.</Paragraph>
- <Paragraph><code>m!setverify</code>: Sets the role given when you m!verify. Name or ID.</Paragraph>
- <Paragraph><code>m!mail</code>: Creates a modmail ticket if set up.</Paragraph>
- <Paragraph><code>m!prefix</code>: Shows the bots prefix. Use @ if unknown.</Paragraph>
- <Paragraph><code>m!setprefix</code>: Sets the bots prefix. You can always @ the bot.</Paragraph>
- <Subheading>Moderation</Subheading>
- <Paragraph><code>m!warn</code>: Warns a member.</Paragraph>
- <Paragraph><code>m!clear</code>: Clears messages from a channel</Paragraph>
- <Paragraph><code>m!kick</code>: Kicks a member.</Paragraph>
- <Paragraph><code>m!softban</code>: Soft bans a member.</Paragraph>
- <Paragraph><code>m!ban</code>: Bans a member.</Paragraph>
- <Paragraph><code>m!unban</code>: Unbans a member.</Paragraph>
- <Paragraph><code>m!purge</code>: Deletes messages in the channel.</Paragraph>
- <Paragraph><code>m!punish</code>: Punishes a user.</Paragraph>
- <Paragraph><code>m!setlog</code>: Sets the servers log channel.</Paragraph>
- <Paragraph><code>m!ignore</code>: Stops logging users, roles and channels provided.</Paragraph>
- <Paragraph><code>m!ignored</code>: Shows the ignored users, roles and channels.</Paragraph>
- <Paragraph><code>m!stafflog</code>: Sets the staff log channel for reports and messages.</Paragraph>
- <Paragraph><code>m!auto</code>: Lets you edit your server automations.</Paragraph>
- <Paragraph><code>m!modmail</code>: Shows the setup for the mail command.</Paragraph>
- <Subheading>Emergency</Subheading>
- <Paragraph><code>m!slowmode</code>: Sets the channel slowmode.</Paragraph>
- <Paragraph><code>m!lock</code>: Locks the channel. Applies slowmode and stops messages being sent.</Paragraph>
- <Paragraph><code>m!unlock</code>: Unlocks the channel. Slowmode is removed and messages can be sent.</Paragraph>
- <SectionHeading id="invite">Invite</SectionHeading>
- <CardRow>
- <Card
- wave="rsm"
- icon="bots/rsm/circle"
- buttonText={"FFFFFF"} gradient={["F27878", "D96B6B"]}
- title="Invite"
- subtext="Invite RSM to your server"
- buttons={[
- {color: "424242", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands", text: "Invite"}
- ]}
- />
- </CardRow>
- </AutoSpacing>
+ <AutoLayout>
+ <Panel halfSize={true} id="commands">
+ <Title>Commands</Title>
+ <Divider />
+ <Text>Standard commands to use RSM</Text>
+ <List colour="F27878">
+ <ListItem><Code colour="F27878">m!info</Code> Shows all commands and info.</ListItem>
+ <ListItem><Code colour="F27878">m!stats</Code> Shows the bot statistics</ListItem>
+ <ListItem><Code colour="F27878">m!settings</Code> Shows your servers log settings.</ListItem>
+ <ListItem><Code colour="F27878">m!user</Code> Shows information about a user.</ListItem>
+ <ListItem><Code colour="F27878">m!avatar</Code> Shows a users avatar.</ListItem>
+ <ListItem><Code colour="F27878">m!roleall</Code> Role all humans or bots in the server.</ListItem>
+ <ListItem><Code colour="F27878">m!suggest</Code> Sends a suggestion to add to the bot for voting.</ListItem>
+ <ListItem><Code colour="F27878">m!ping</Code> Checks the bots ping time.</ListItem>
+ <ListItem><Code colour="F27878">m!server</Code> Shows all information about your server.</ListItem>
+ <ListItem><Code colour="F27878">m!tag</Code> m!tag create/delete title text, or m!tag title</ListItem>
+ <ListItem><Code colour="F27878">m!role</Code> With Role: Shows information about a role.</ListItem>
+ <ListItem><Code colour="F27878">m!role</Code> With Mention: Lets you edit or view a users roles.</ListItem>
+ <ListItem><Code colour="F27878">m!viewas</Code> Shows the channels that a member can see.</ListItem>
+ <ListItem><Code colour="F27878">m!verify</Code> Lets users verify in your server.</ListItem>
+ <ListItem><Code colour="F27878">m!setverify</Code> Sets the role given when you m!verify. Name or ID.</ListItem>
+ <ListItem><Code colour="F27878">m!mail</Code> Creates a modmail ticket if set up.</ListItem>
+ <ListItem><Code colour="F27878">m!prefix</Code> Shows the bots prefix. Use @ if unknown.</ListItem>
+ <ListItem><Code colour="F27878">m!setprefix</Code> Sets the bots prefix. You can always @ the bot.</ListItem>
+ </List>
+ </Panel>
+ <Panel halfSize={true}>
+ <Title>Moderation Commands</Title>
+ <Divider />
+ <Text>Moderation commands to set up systems and moderate users</Text>
+ <List colour="F27878">
+ <ListItem><Code colour="F27878">m!warn</Code> Warns a member.</ListItem>
+ <ListItem><Code colour="F27878">m!clear</Code> Clears messages from a channel</ListItem>
+ <ListItem><Code colour="F27878">m!kick</Code> Kicks a member.</ListItem>
+ <ListItem><Code colour="F27878">m!softban</Code> Soft bans a member.</ListItem>
+ <ListItem><Code colour="F27878">m!ban</Code> Bans a member.</ListItem>
+ <ListItem><Code colour="F27878">m!unban</Code> Unbans a member.</ListItem>
+ <ListItem><Code colour="F27878">m!purge</Code> Deletes messages in the channel.</ListItem>
+ <ListItem><Code colour="F27878">m!punish</Code> Punishes a user.</ListItem>
+ <ListItem><Code colour="F27878">m!setlog</Code> Sets the servers log channel.</ListItem>
+ <ListItem><Code colour="F27878">m!ignore</Code> Stops logging users, roles and channels provided.</ListItem>
+ <ListItem><Code colour="F27878">m!ignored</Code> Shows the ignored users, roles and channels.</ListItem>
+ <ListItem><Code colour="F27878">m!stafflog</Code> Sets the staff log channel for reports and messages.</ListItem>
+ <ListItem><Code colour="F27878">m!auto</Code> Lets you edit your server automations.</ListItem>
+ <ListItem><Code colour="F27878">m!modmail</Code> Shows the setup for the mail command.</ListItem>
+ </List>
+ </Panel>
+ <Panel halfSize={true}>
+ <Title>Emergency Commands</Title>
+ <Divider />
+ <Text>Moderation commands to set up systems and moderate users</Text>
+ <List colour="F27878">
+ <ListItem><Code colour="F27878">m!slowmode</Code> Sets the channel slowmode.</ListItem>
+ <ListItem><Code colour="F27878">m!lock</Code> Locks the channel. Applies slowmode and stops messages being sent.</ListItem>
+ <ListItem><Code colour="F27878">m!unlock</Code> Unlocks the channel. Slowmode is removed and messages can be sent.</ListItem>
+ </List>
+ </Panel>
+ <Panel halfSize={true} id="invite">
+ <Title>Invite</Title>
+ <Divider />
+ <CardRow>
+ <Card
+ wave="rsm"
+ icon="bots/rsm/circle"
+ buttonText={"FFFFFF"} gradient={["F27878", "D96B6B"]}
+ title="Invite"
+ subtext="Invite RSM to your server"
+ buttons={[
+ {color: "424242", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands", text: "Invite"}
+ ]}
+ />
+ </CardRow>
+ </Panel>
+ </AutoLayout>
</>
)
}
diff --git a/pages/rsmv/index.js b/pages/rsmv/index.js
index aa47ddf..63eecd5 100644
--- a/pages/rsmv/index.js
+++ b/pages/rsmv/index.js
@@ -6,6 +6,8 @@
import React from 'react';
import Header from '../../Components/Header'
+import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../../Components/Panels';
+import { List, ListItem, Code } from '../../Components/Texttools';
class RSMV extends Component {
constructor(props) {
@@ -76,9 +78,10 @@
wave="web/waves/header/rsm"
buttons={[]}
/>
- <div id="start">
- <div className={Styles.center}>
- <p className={Styles.text}>Complete the check below to join {this.props.guild_name}</p>
+ <p id="start" />
+ <AutoLayout>
+ <Panel>
+ <Text>Complete the check below to join {this.props.guild_name}</Text>
<HCaptcha
id="Captchas mitigate problems"
sitekey="85074411-fa13-4d9b-b901-53095c6d1fc6"
@@ -86,14 +89,14 @@
theme={this.theme ? "light" : "dark"}
/>
<button type="button" className={Styles.button + " " + (this.state.captchaComplete ? Styles.buttonComplete : null)} onClick={(success) => this.submitForm(this)}>Proceed</button>
- <p className={Styles.text}>
- This is an automatic check performed by RSM.
- By clicking Proceed, you will be given the <code>{this.props.role_name}</code> role in <code>{this.props.guild_name}</code>.
- </p>
- <br />
- <p>You can add RSM to your server by inviting it <a href="https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands">here</a>.</p>
- </div>
- </div>
+ <List>
+ <ListItem>This is an automatic check performed by RSM.</ListItem>
+ <ListItem>By clicking Proceed, you will be given the <code>{this.props.role_name}</code> role in <code>{this.props.guild_name}</code>.</ListItem>
+ <ListItem>For the full list of data stored by RSM, please check <a href="https://clicksminuteper.github.io/policies/rsm#verification">Here</a></ListItem>
+ </List>
+ <Text>You can add RSM to your server by inviting it <a href="https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands">here</a>.</Text>
+ </Panel>
+ </AutoLayout>
</>
}
}
diff --git a/pages/rsmv/success.js b/pages/rsmv/success.js
index df6c449..484c0bf 100644
--- a/pages/rsmv/success.js
+++ b/pages/rsmv/success.js
@@ -1,5 +1,4 @@
import { Component } from 'react'
-import Styles from '../../styles/rsmv/rsmv.module.css'
import Header from '../../Components/Header'
class Success extends Component {
diff --git a/pages/support.js b/pages/support.js
index 9cf5814..b89df34 100644
--- a/pages/support.js
+++ b/pages/support.js
@@ -1,9 +1,6 @@
-import Card from '../Components/Card'
-import TileRow from '../Components/TileRow'
import Header from '../Components/Header'
-import AutoSpacing from '../Components/AutoSpacing'
-import Paragraph from '../Components/Paragraph'
-import SectionHeading from '../Components/SectionHeading'
+import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
+import { List, ListItem, Code } from '../Components/Texttools';
export default function Home() {
return (
@@ -15,13 +12,19 @@
wave="web/waves/header/clicksforms"
buttons={[]}
/>
- <AutoSpacing>
- <SectionHeading id="start">Email</SectionHeading>
- <Paragraph>Send us an email at <a href="mailto:support@clicksminuteper.net">support@clicksminuteper.net</a> and we will get back to you as quick as possible.</Paragraph>
- <SectionHeading id="start">Discord</SectionHeading>
- <Paragraph>For a faster response, you can join our <a href="https://discord.gg/bPaNnxe">Discord server</a> where our staff members can help you with any questions.</Paragraph>
- <Paragraph>Type <code>m!mail</code> in <code>#ticketmaster</code> to create a support ticket.</Paragraph>
- </AutoSpacing>
+ <AutoLayout>
+ <Panel halfSize={true}>
+ <Title>Email</Title>
+ <Divider />
+ <Text>Send us an email at <a href="mailto:support@clicksminuteper.net">support@clicksminuteper.net</a> and we will get back to you as quick as possible.</Text>
+ </Panel>
+ <Panel halfSize={true}>
+ <Title>Discord</Title>
+ <Divider />
+ <Text>For a faster response, you can join our <a href="https://discord.gg/bPaNnxe">Discord server</a> where our staff members can help you with any questions.</Text>
+ <Text>Type <Code colour="71AFE5">m!mail</Code> in <Code colour="71AFE5">#ticketmaster</Code> to create a support ticket.</Text>
+ </Panel>
+ </AutoLayout>
</>
)
}