feat: add register popup
All checks were successful
Release to Staging / build_and_release (push) Successful in 46s
All checks were successful
Release to Staging / build_and_release (push) Successful in 46s
This commit is contained in:
daniyal
parent
f544d8ab15
commit
75d8839330
@ -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: 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>
|
||||||
|
)}
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user