1
0
Fork 0
mirror of https://github.com/sussy-code/smov.git synced 2024-12-20 14:37:43 +01:00

Add a support page!

This commit is contained in:
Cooper Ransom 2024-03-06 15:31:52 -05:00
parent 7604d7d724
commit de5f2514ec
5 changed files with 124 additions and 2 deletions

View file

@ -22,7 +22,7 @@
"body": "Well sudo-flix has a twitter account that can be found in the footer of this page as well as a link to the source code on Github.",
"title": "How can I find out more?"
},
"title": "About sudo-flix (^▽^)👍"
"title": "About sudo-flix (^▽^)"
},
"actions": {
"copied": "Copied",
@ -105,6 +105,7 @@
"pages": {
"about": "About",
"dmca": "DMCA",
"support": "Support",
"login": "Login",
"onboarding": "Setup",
"pagetitle": "{{title}} - sudo-flix",
@ -431,6 +432,18 @@
"verifyingHumanity": "Verifying your humanity... (^▽^)👍"
}
},
"support": {
"title": "Support",
"text": "sudo-flix is designed to be as user-friendly as possible. However, people still have questions and issues. This page is here to help resolve these shortcomings",
"q1": {
"body": "Well, you can join the official <0>movie-web discord</0> and ask questions there or you can email the one provided at the bottom of this page.",
"title": "Where can I get help?"
},
"q2": {
"body": "We have a <0>GitHub</0> where you can create a detailed issue in our repository. Additionally, if you wish, you can create a pull request to fix the issue yourself.",
"title": "How can I report a bug or issue?"
}
},
"screens": {
"dmca": {
"text": "Welcome to sudo-flix's DMCA contact page. If you believe your copyrighted work has been improperly used on our platform (😢), please send a detailed DMCA notice to: <bold>sudo-flix@proton.me</bold> below. Please include a description of the copyrighted material, your contact details, and a statement of good faith belief. We're committed to resolving these matters promptly and appreciate your cooperation.",

View file

@ -161,6 +161,7 @@ export function LinksDropdown(props: { children: React.ReactNode }) {
icon={Icons.DISCORD}
/>
<CircleDropdownLink href={conf().GITHUB_LINK} icon={Icons.GITHUB} />
<CircleDropdownLink href="/support" icon={Icons.MAIL} />
<CircleDropdownLink
href={conf().DONATION_LINK}
icon={Icons.DONATION}

View file

@ -18,7 +18,7 @@ export interface UserIconProps {
const iconList: Record<UserIcons, string> = {
cat: `<svg xmlns="http://www.w3.org/2000/svg" height="1.2em" width="1.2em" viewBox="0 0 576 512"><path opacity="1" fill="currentColor" d="M320 192h17.1c22.1 38.3 63.5 64 110.9 64c11 0 21.8-1.4 32-4v4 32V480c0 17.7-14.3 32-32 32s-32-14.3-32-32V339.2L280 448h56c17.7 0 32 14.3 32 32s-14.3 32-32 32H192c-53 0-96-43-96-96V192.5c0-16.1-12-29.8-28-31.8l-7.9-1c-17.5-2.2-30-18.2-27.8-35.7s18.2-30 35.7-27.8l7.9 1c48 6 84.1 46.8 84.1 95.3v85.3c34.4-51.7 93.2-85.8 160-85.8zm160 26.5v0c-10 3.5-20.8 5.5-32 5.5c-28.4 0-54-12.4-71.6-32h0c-3.7-4.1-7-8.5-9.9-13.2C357.3 164 352 146.6 352 128v0V32 12 10.7C352 4.8 356.7 .1 362.6 0h.2c3.3 0 6.4 1.6 8.4 4.2l0 .1L384 21.3l27.2 36.3L416 64h64l4.8-6.4L512 21.3 524.8 4.3l0-.1c2-2.6 5.1-4.2 8.4-4.2h.2C539.3 .1 544 4.8 544 10.7V12 32v96c0 17.3-4.6 33.6-12.6 47.6c-11.3 19.8-29.6 35.2-51.4 42.9zM432 128a16 16 0 1 0 -32 0 16 16 0 1 0 32 0zm48 16a16 16 0 1 0 0-32 16 16 0 1 0 0 32z"/></svg>`,
weed: `<svg xmlns="http://www.w3.org/2000/svg" height="1.3em" width="1.3em" viewBox="0 0 500 512"><path opacity="1" fill="currentColor" d="M256 0c5.3 0 10.3 2.7 13.3 7.1c15.8 23.5 36.7 63.7 49.2 109c7.2 26.4 11.8 55.2 10.4 84c11.5-8.8 23.7-16.7 35.8-23.6c41-23.3 84.4-36.9 112.2-42.5c5.2-1 10.7 .6 14.4 4.4s5.4 9.2 4.4 14.5c-5.6 27.7-19.3 70.9-42.7 111.7c-9.1 15.9-19.9 31.7-32.4 46.3c27.8 6.6 52.4 17.3 67.2 25.5c5.1 2.8 8.2 8.2 8.2 14s-3.2 11.2-8.2 14c-15.2 8.4-40.9 19.5-69.8 26.1c-20.2 4.6-42.9 7.2-65.2 4.6l8.3 33.1c1.5 6.1-.6 12.4-5.5 16.4s-11.6 4.6-17.2 1.9L280 417.2V488c0 13.3-10.7 24-24 24s-24-10.7-24-24V417.2l-58.5 29.1c-5.6 2.8-12.3 2.1-17.2-1.9s-7-10.3-5.5-16.4l8.3-33.1c-22.2 2.6-45 0-65.2-4.6c-28.9-6.6-54.6-17.6-69.8-26.1c-5.1-2.8-8.2-8.2-8.2-14s3.2-11.2 8.2-14c14.8-8.2 39.4-18.8 67.2-25.5C78.9 296.3 68.1 280.5 59 264.6c-23.4-40.8-37.1-84-42.7-111.7c-1.1-5.2 .6-10.7 4.4-14.5s9.2-5.4 14.4-4.4c27.9 5.5 71.2 19.2 112.2 42.5c12.1 6.9 24.3 14.7 35.8 23.6c-1.4-28.7 3.1-57.6 10.4-84c12.5-45.3 33.4-85.5 49.2-109c3-4.4 8-7.1 13.3-7.1z"/></svg>`,
weed: `<svg xmlns="http://www.w3.org/2000/svg" height="1.18em" width="1.18em" viewBox="0 0 500 512"><path opacity="1" fill="currentColor" d="M256 0c5.3 0 10.3 2.7 13.3 7.1c15.8 23.5 36.7 63.7 49.2 109c7.2 26.4 11.8 55.2 10.4 84c11.5-8.8 23.7-16.7 35.8-23.6c41-23.3 84.4-36.9 112.2-42.5c5.2-1 10.7 .6 14.4 4.4s5.4 9.2 4.4 14.5c-5.6 27.7-19.3 70.9-42.7 111.7c-9.1 15.9-19.9 31.7-32.4 46.3c27.8 6.6 52.4 17.3 67.2 25.5c5.1 2.8 8.2 8.2 8.2 14s-3.2 11.2-8.2 14c-15.2 8.4-40.9 19.5-69.8 26.1c-20.2 4.6-42.9 7.2-65.2 4.6l8.3 33.1c1.5 6.1-.6 12.4-5.5 16.4s-11.6 4.6-17.2 1.9L280 417.2V488c0 13.3-10.7 24-24 24s-24-10.7-24-24V417.2l-58.5 29.1c-5.6 2.8-12.3 2.1-17.2-1.9s-7-10.3-5.5-16.4l8.3-33.1c-22.2 2.6-45 0-65.2-4.6c-28.9-6.6-54.6-17.6-69.8-26.1c-5.1-2.8-8.2-8.2-8.2-14s3.2-11.2 8.2-14c14.8-8.2 39.4-18.8 67.2-25.5C78.9 296.3 68.1 280.5 59 264.6c-23.4-40.8-37.1-84-42.7-111.7c-1.1-5.2 .6-10.7 4.4-14.5s9.2-5.4 14.4-4.4c27.9 5.5 71.2 19.2 112.2 42.5c12.1 6.9 24.3 14.7 35.8 23.6c-1.4-28.7 3.1-57.6 10.4-84c12.5-45.3 33.4-85.5 49.2-109c3-4.4 8-7.1 13.3-7.1z"/></svg>`,
userGroup: `<svg xmlns="http://www.w3.org/2000/svg" height="1em" width="1em" viewBox="0 0 640 512"><path opacity="1" fill="currentColor" d="M96 128a128 128 0 1 1 256 0A128 128 0 1 1 96 128zM0 482.3C0 383.8 79.8 304 178.3 304h91.4C368.2 304 448 383.8 448 482.3c0 16.4-13.3 29.7-29.7 29.7H29.7C13.3 512 0 498.7 0 482.3zM609.3 512H471.4c5.4-9.4 8.6-20.3 8.6-32v-8c0-60.7-27.1-115.2-69.8-151.8c2.4-.1 4.7-.2 7.1-.2h61.4C567.8 320 640 392.2 640 481.3c0 17-13.8 30.7-30.7 30.7zM432 256c-31 0-59-12.6-79.3-32.9C372.4 196.5 384 163.6 384 128c0-26.8-6.6-52.1-18.3-74.3C384.3 40.1 407.2 32 432 32c61.9 0 112 50.1 112 112s-50.1 112-112 112z"/></svg>`,
couch: `<svg xmlns="http://www.w3.org/2000/svg" height="1em" width="1em" viewBox="0 0 640 512"><path opacity="1" fill="currentColor" d="M64 160C64 89.3 121.3 32 192 32H448c70.7 0 128 57.3 128 128v33.6c-36.5 7.4-64 39.7-64 78.4v48H128V272c0-38.7-27.5-71-64-78.4V160zM544 272c0-20.9 13.4-38.7 32-45.3c5-1.8 10.4-2.7 16-2.7c26.5 0 48 21.5 48 48V448c0 17.7-14.3 32-32 32H576c-17.7 0-32-14.3-32-32H96c0 17.7-14.3 32-32 32H32c-17.7 0-32-14.3-32-32V272c0-26.5 21.5-48 48-48c5.6 0 11 1 16 2.7c18.6 6.6 32 24.4 32 45.3v48 32h32H512h32V320 272z"/></svg>`,
mobile: `<svg xmlns="http://www.w3.org/2000/svg" height="1em" width="1em" viewBox="0 0 384 512"><path opacity="1" fill="currentColor" d="M16 64C16 28.7 44.7 0 80 0H304c35.3 0 64 28.7 64 64V448c0 35.3-28.7 64-64 64H80c-35.3 0-64-28.7-64-64V64zM144 448c0 8.8 7.2 16 16 16h64c8.8 0 16-7.2 16-16s-7.2-16-16-16H160c-8.8 0-16 7.2-16 16zM304 64H80V384H304V64z"/></svg>`,

105
src/pages/Support.tsx Normal file
View file

@ -0,0 +1,105 @@
import classNames from "classnames";
import React, { useState } from "react";
import { Trans, useTranslation } from "react-i18next";
import { Icon, Icons } from "@/components/Icon";
import { ThinContainer } from "@/components/layout/ThinContainer";
import { MwLink } from "@/components/text/Link";
import { Heading1, Paragraph } from "@/components/utils/Text";
import { PageTitle } from "@/pages/parts/util/PageTitle";
import { conf } from "@/setup/config";
import { SubPageLayout } from "./layouts/SubPageLayout";
// From about just removed the numbers
export function Ol(props: { items: React.ReactNode[] }) {
return (
<ol>
{props.items.map((child, i) => {
return (
<li
className={classNames(
"grid grid-cols-[auto,1fr] gap-6",
i !== props.items.length - 1 ? "pb-12" : undefined,
)}
>
<div className="relative z-0">
<div className="w-6 h-6 rounded-full bg-about-circle text-about-circleText font-medium flex justify-center items-center relative z-10" />
{i !== props.items.length - 1 ? (
<div
className="h-[calc(100%+1.5rem)] w-px absolute top-6 left-1/2 transform -translate-x-1/2"
style={{
backgroundImage:
"linear-gradient(to bottom, transparent 5px, #1F1F29 5px, #1F1F29 10px)",
backgroundSize: "10px 10px",
backgroundRepeat: "Repeat",
}}
/>
) : null}
</div>
<div>{child}</div>
</li>
);
})}
</ol>
);
}
function Item(props: { title: string; children: React.ReactNode }) {
return (
<>
<p className="text-white mb-2 font-medium">{props.title}</p>
<div className="text-type-text">{props.children}</div>
</>
);
}
export function SupportPage() {
const { t } = useTranslation();
const [isHovered, setIsHovered] = useState(false);
return (
<SubPageLayout>
<PageTitle subpage k="global.pages.support" />
<ThinContainer>
<Heading1>{t("support.title")}</Heading1>
<Paragraph>
<Trans
i18nKey="support.text"
components={{
bold: <span className="font-bold" style={{ color: "#cfcfcf" }} />,
}}
/>
</Paragraph>
<Ol
items={[
<Item title={t("support.q1.title")}>
<Trans i18nKey="support.q1.body">
<MwLink to="https://movie-web.github.io/links/discord" />
</Trans>
</Item>,
<Item title={t("support.q2.title")}>
<Trans i18nKey="support.q2.body">
<MwLink to="https://github.com/sudo-flix/sudo-source" />
</Trans>
</Item>,
]}
/>
<Paragraph className="flex space-x-3 items-center">
<Icon icon={Icons.MAIL} />
<a
href={`mailto:${conf().DMCA_EMAIL}`}
style={{
transition: "color 0.3s ease",
color: isHovered ? "#cfcfcf" : "inherit",
}}
onMouseEnter={() => setIsHovered(true)}
onMouseLeave={() => setIsHovered(false)}
>
{conf().DMCA_EMAIL ?? ""}
</a>
</Paragraph>
</ThinContainer>
</SubPageLayout>
);
}

View file

@ -25,6 +25,7 @@ import { OnboardingPage } from "@/pages/onboarding/Onboarding";
import { OnboardingExtensionPage } from "@/pages/onboarding/OnboardingExtension";
import { OnboardingProxyPage } from "@/pages/onboarding/OnboardingProxy";
import { RegisterPage } from "@/pages/Register";
import { SupportPage } from "@/pages/Support";
import { Layout } from "@/setup/Layout";
import { useHistoryListener } from "@/stores/history";
import { LanguageProvider } from "@/stores/language";
@ -147,6 +148,8 @@ function App() {
{shouldHaveDmcaPage() ? (
<Route path="/dmca" element={<DmcaPage />} />
) : null}
{/* Support page */}
<Route path="/support" element={<SupportPage />} />
{/* Settings page */}
<Route
path="/settings"