Skip to content

Commit

Permalink
changed
Browse files Browse the repository at this point in the history
  • Loading branch information
Andcool-Systems committed Jan 5, 2025
1 parent e009b9b commit 1aeb34e
Show file tree
Hide file tree
Showing 6 changed files with 143 additions and 57 deletions.
28 changes: 4 additions & 24 deletions src/app/me/page.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
"use client";

import React, { CSSProperties, JSX } from 'react';
import { useEffect, useState, useRef } from 'react';
import { useEffect, useState } from 'react';
import { useRouter, useSearchParams } from "next/navigation";
import styles from "@/app/styles/me/me.module.css";
import { Tooltip } from '@/app/modules/components/Tooltip';
Expand All @@ -19,6 +19,7 @@ import { httpStatusCodes } from '../modules/utils/StatusCodes';
import { renderSkin } from '../modules/utils/SkinCardRender';
import ApiManager from '../modules/utils/apiManager';
import MinecraftConnect from '../modules/components/MinecraftConnect';
import RolesDialog from '../modules/components/RolesDialog';

const Main = () => {
const router = useRouter();
Expand Down Expand Up @@ -97,21 +98,6 @@ const Loading = ({ loadingStatus }: { loadingStatus: string }) => {
}

const Login = () => {
const [roles, setRoles] = useState<Role[]>([]);
const dat = roles.map((role) => {
return (
<div key={role.id} className={styles.role_container}>
<span style={{ backgroundColor: "#" + role.color.toString(16) }} className={styles.role_dot}>
</span>
<span className={styles.role_title}>{role.title}</span>
</div>
)
})

useEffect(() => {
ApiManager.getRoles().then(setRoles).catch(console.error);
}, [])

const loginMinecraft = async (code: string): Promise<void> => {
return new Promise((resolve, reject) => {
ApiManager.loginMinecraft(code)
Expand Down Expand Up @@ -153,14 +139,8 @@ const Login = () => {
</MinecraftConnect>
</div>

<span className={styles.p} id="about_logging">Для регистрации вам нужно быть участником Discord сервера <a href='https://baad.pw/ds' className={styles.a}>Pwgood</a> и иметь одну из этих <Tooltip
parent_id="about_logging"
body={
<div className={styles.roles_container}>
{dat.length > 0 ? dat : <IconSvg width={86} height={86} className={style_workshop.loading} style={{ width: 'auto' }} />}
</div>} timeout={0} className={styles.roles_text_container}>
<span className={styles.roles_text}> ролей</span>
</Tooltip>
<span className={styles.p} id="about_logging">Для регистрации вам нужно быть участником Discord сервера <a href='https://baad.pw/ds' className={styles.a}>Pwgood</a> и иметь одну из этих&nbsp;
<RolesDialog><span style={{ cursor: 'pointer', textDecoration: 'underline' }}>ролей</span></RolesDialog>.
</span>
<p style={{ color: "gray", marginBottom: 0 }}>Регистрируясь на сайте вы соглашаетесь с настоящими <a className={styles.a} href="/tos" style={{ color: "gray" }}>условиями пользования</a></p>
</div>
Expand Down
103 changes: 103 additions & 0 deletions src/app/modules/components/RolesDialog.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
import { CSSProperties, JSX, useEffect, useState } from "react";
import style_base from '@/app/styles/minecraftConnect.module.css';
import { IconBrandDiscord, IconBrandTwitch, IconFlag, IconX } from "@tabler/icons-react";
import styles from "@/app/styles/me/me.module.css";
import style_main from "@/app/styles/RolesDialog.module.css";
import ReactCSSTransition from "./CSSTransition";
import { Role } from "@/app/interfaces";
import ApiManager from "../utils/apiManager";
import IconBoosty from '@/app/resources/boosty.svg';


const RolesDialog = ({ children }: { children: JSX.Element }) => {
const [expanded, setExpanded] = useState<boolean>(false);
const [roles, setRoles] = useState<Role[]>([]);

useEffect(() => {
ApiManager.getRoles()
.then(setRoles)
.catch(console.error);
}, [])

const roles_el = roles.map((role) => {
return (
<div key={role.id} className={styles.role_container}>
<span style={{ backgroundColor: "#" + role.color.toString(16) }} className={styles.role_dot}>
</span>
<span className={styles.role_title}>{role.title}</span>
</div>
)
})

return (
<>
<span onClick={() => setExpanded(true)}>
{children}
</span>
<ReactCSSTransition
state={expanded}
timeout={150}
classNames={{
enter: style_base['background-enter'],
exitActive: style_base['background-exit-active'],
}}
>
<div className={style_base.background} />
</ReactCSSTransition>

<ReactCSSTransition
state={expanded}
timeout={150}
classNames={{
enter: style_base['menu-enter'],
exitActive: style_base['menu-exit-active'],
}}>
<div className={style_base.base}>
<div className={style_base.container}>
<div className={style_base.header}>
<h3 style={{ margin: 0, display: 'flex', gap: '.5rem', alignItems: 'center' }}><IconFlag />Роли для регистрации</h3>
<IconX className={style_base.close} onClick={() => setExpanded(false)} />
</div>
<p style={{ margin: 0, fontSize: '.9rem', opacity: .6 }}>Для регистрации Вы должны иметь одну из этих ролей на Discord сервере PWGood.</p>
<div
style={{
display: 'flex',
flexWrap: 'wrap'
}}>
{roles_el}
</div>

<h4 style={{ margin: 0, marginTop: '.5rem' }}>Ссылки на соцсети Пугода:</h4>
<div className={style_main.container}>
<a
className={style_main.link}
href='https://baad.pw/twitch'
style={{ '--accent': '#772ce8' } as CSSProperties}
>
<IconBrandTwitch />Twitch
</a>
<a
className={style_main.link}
href='https://baad.pw/ds'
style={{ '--accent': '#4752c4' } as CSSProperties}
>
<IconBrandDiscord />Discord
</a>
<a
className={style_main.link}
href='https://baad.pw/boosty'
style={{
'--accent': '#f15f2c'
} as CSSProperties}
>
<IconBoosty />Boosty
</a>
</div>
</div>
</div>
</ReactCSSTransition>
</>
);
}

export default RolesDialog;
6 changes: 6 additions & 0 deletions src/app/resources/boosty.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
24 changes: 24 additions & 0 deletions src/app/styles/RolesDialog.module.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
.link {
display: flex;
justify-content: center;
border: 2px solid rgb(38, 38, 38);
border-radius: 10px;
height: 2.3rem;
align-items: center;
box-sizing: border-box;
text-decoration: none;
transition-timing-function: cubic-bezier(.4, 0, .2, 1);
transition-duration: .15s;
gap: .2rem;
}

.link:hover {
background-color: var(--accent);
}

.container {
display: flex;
flex-direction: column;
align-items: stretch;
gap: .4rem;
}
1 change: 0 additions & 1 deletion src/app/styles/me/me.module.css
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
.p {
margin-top: .5rem;
color: var(--main-text-color);
transform: translateY(0);
transition: color 250ms;
display: block;
}
Expand Down
38 changes: 6 additions & 32 deletions src/app/tutorials/page.tsx
Original file line number Diff line number Diff line change
@@ -1,37 +1,18 @@
"use client";

import React, { useEffect, useState } from "react";
import React from "react";
import style from '@/app/styles/tutorials/common.module.css';
import ASide from "./header";
import InfoCard from "@/app/modules/components/InfoCard";
import { CategoryEl } from "@/app/modules/components/Card";
import { CustomLink } from "@/app/modules/components/Search";
import styles from "@/app/styles/me/me.module.css";
import { Tooltip } from "@/app/modules/components/Tooltip";
import { Role } from "@/app/interfaces";
import style_workshop from "@/app/styles/workshop/page.module.css";

import { IconInfoCircle, IconAlertTriangle, IconBulb } from '@tabler/icons-react';
import IconSvg from '@/app/resources/icon.svg';
import Link from "next/link";
import ApiManager from "../modules/utils/apiManager";
import RolesDialog from "../modules/components/RolesDialog";

export default function Home() {
const [roles, setRoles] = useState<Role[]>([]);

useEffect(() => {
ApiManager.getRoles().then(setRoles).catch(console.error);
}, [])

const roles_data = roles.map((role) => {
return (
<div key={role.id} className={styles.role_container}>
<span style={{ backgroundColor: "#" + role.color.toString(16) }} className={styles.role_dot}>
</span>
<span className={styles.role_title}>{role.title}</span>
</div>
)
})
return (
<main className={style.main}>
<div className={style.main_container}>
Expand All @@ -46,17 +27,10 @@ export default function Home() {

<h2>Регистрация на сайте</h2>
<span style={{ display: 'block', marginBottom: '1rem' }}>Регистрация разрешена только пользователям, являющимися членами Discord сервера PWGood,
а так же имеющие определенные <Tooltip
body={
<div className={styles.roles_container}>
{roles_data.length > 0 ? roles_data : <IconSvg width={86} height={86} className={style_workshop.loading} />}
</div>
}
opacity="1"
timeout={0}
className={styles.roles_text_container}>
<span className={styles.roles_text}> роли</span>
</Tooltip>.
а так же имеющие определенные&nbsp;
<RolesDialog>
<span className={styles.roles_text}>роли</span>
</RolesDialog>.
При регистрации сайт сохраняет ваш никнейм с учётной записи Discord.
Дальнейшее его изменение возможно только через администрацию сайта.</span>
<InfoCard color="#4493F8" title={
Expand Down

0 comments on commit 1aeb34e

Please sign in to comment.