degmods/degmods.com
5
0
Fork 0
Code Issues 13 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: add register popup
All checks were successful
Release to Staging / build_and_release (push) Successful in 46s
Details

Browse Source
This commit is contained in:
daniyal 2024-08-15 19:31:39 +05:00
parent f544d8ab15
commit 75d8839330
1 changed files with 154 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

165
src/layout/header.tsx
View File

@ -134,17 +134,20 @@ export const Header = () => {
Settings Settings
</Link> </Link>
{!userState.auth && ( {!userState.auth && (
<a <>
id='loginNav' <RegisterButtonWithDialog />
className={navStyles.NMTI_SecInside_Link} <a
onClick={handleLogin} id='loginNav'
> className={navStyles.NMTI_SecInside_Link}
<img onClick={handleLogin}
className={navStyles.NMTI_SecInside_LinkImg} >
src='/assets/img/DEG%20Mods%20Default%20PP.png' <img
/> className={navStyles.NMTI_SecInside_LinkImg}
Login src='/assets/img/DEG%20Mods%20Default%20PP.png'
</a> />
Login
</a>
</>
)} )}
{userState.auth && userState.user && ( {userState.auth && userState.user && (
<div className={navStyles.NMTI_SecInside_Link}> <div className={navStyles.NMTI_SecInside_Link}>
@ -420,3 +423,143 @@ const TipButtonWithDialog = React.memo(() => {
</> </>
) )
}) })
const RegisterButtonWithDialog = () => {
const [showPopUp, setShowPopUp] = useState(false)
return (
<>
<a
id='registerNav'
className={navStyles.NMTI_SecInside_Link}
onClick={() => setShowPopUp(true)}
>
Register
</a>
{showPopUp && (
<div id='PopUpMainRegister' className='popUpMain'>
<div className='ContainerMain'>
<div className='popUpMainCardWrapper'>
<div className='popUpMainCard popUpMainCardQR'>
<div className='popUpMainCardTop'>
<div className='popUpMainCardTopInfo'>
<h3>Create an account via</h3>
</div>
<div
className='popUpMainCardTopClose'
onClick={() => setShowPopUp(false)}
>
<svg
xmlns='http://www.w3.org/2000/svg'
viewBox='-96 0 512 512'
width='1em'
height='1em'
fill='currentColor'
style={{ zIndex: 1 }}
>
<path d='M310.6 361.4c12.5 12.5 12.5 32.75 0 45.25C304.4 412.9 296.2 416 288 416s-16.38-3.125-22.62-9.375L160 301.3L54.63 406.6C48.38 412.9 40.19 416 32 416S15.63 412.9 9.375 406.6c-12.5-12.5-12.5-32.75 0-45.25l105.4-105.4L9.375 150.6c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L160 210.8l105.4-105.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-105.4 105.4L310.6 361.4z'></path>
</svg>
</div>
</div>
<div className='pUMCB_Zaps'>
<div className='pUMCB_ZapsInside'>
<div className='inputLabelWrapperMain'>
<label className='form-label labelMain'>
Browser Extensions (Windows)
</label>
<p className='labelDescriptionMain'>
Once you create your "account" on any of these, come
back and click login, then sign-in with extension.
</p>
</div>
<a
className='btn btnMain btnMainPopup'
role='button'
target='_blank'
href='https://getalby.com/'
>
Alby Browser Extension
</a>
<a
className='btn btnMain btnMainPopup'
role='button'
href='https://keys.band/'
target='_blank'
>
Keys.Band Browser Extension
</a>
</div>
<p
className='labelDescriptionMain'
style={{
padding: '10px',
borderRadius: '10px',
background: 'rgba(0,0,0,0.1)',
border: 'solid 1px rgba(255,255,255,0.1)',
margin: '10px 0 0 0'
}}
>
Q:&nbsp;Why can't I create an account normally?
<br />
A: DEG Mods can't ban you or delete your content (we can
only hide you), and the consequence of that is this kind of
registration/login system.
</p>
<div className='dividerPopup'>
<div className='dividerPopupLine'></div>
<p>or</p>
<div className='dividerPopupLine'></div>
</div>
<div className='pUMCB_ZapsInside'>
<div className='inputLabelWrapperMain'>
<label className='form-label labelMain'>
Browser Extensions (iOS)
</label>
<p className='labelDescriptionMain'>
Once you create your "account" on any of these, come
back and click login, then sign-in with extension.
</p>
</div>
<a
className='btn btnMain btnMainPopup'
role='button'
href='https://apps.apple.com/us/app/nostore/id1666553677'
target='_blank'
>
Nostore Browser Extension
</a>
</div>
<div className='dividerPopup'>
<div className='dividerPopupLine'></div>
<p>or</p>
<div className='dividerPopupLine'></div>
</div>
<div className='pUMCB_ZapsInside'>
<div className='inputLabelWrapperMain'>
<label className='form-label labelMain'>
Android apps
</label>
<p className='labelDescriptionMain'>
Once you create your "account" on any of these, come
back and click login, then Advanced login, then sign-in
with bunker URL.
</p>
</div>
<a
className='btn btnMain btnMainPopup'
role='button'
href='https://github.com/greenart7c3/Amber/releases'
target='_blank'
>
Amber
</a>
</div>
</div>
</div>
</div>
</div>
</div>
)}
</>
)
}