computer-scienceangular-roadmapbackend-roadmapblockchain-roadmapdba-roadmapdeveloper-roadmapdevops-roadmapfrontend-roadmapgo-roadmaphactoberfestjava-roadmapjavascript-roadmapnodejs-roadmappython-roadmapqa-roadmapreact-roadmaproadmapstudy-planvue-roadmapweb3-roadmap
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
40 lines
1.2 KiB
40 lines
1.2 KiB
--- |
|
import Spinner from '../Spinner.astro'; |
|
import AccountDropdown from './AccountDropdown.astro'; |
|
--- |
|
|
|
<div> |
|
<div |
|
class='flex h-8 w-24 items-center justify-center rounded-full bg-gradient-to-r from-blue-500 to-blue-700 py-2 px-4 text-sm text-white hover:from-blue-500 hover:to-blue-600' |
|
id='navigation-spinner' |
|
> |
|
<Spinner class='text-white' /> |
|
</div> |
|
|
|
<AccountDropdown /> |
|
|
|
<a |
|
id='register-button' |
|
class='flex hidden h-8 w-24 cursor-pointer items-center justify-center rounded-full bg-gradient-to-r from-blue-500 to-blue-700 py-2 px-4 text-sm font-medium text-white hover:from-blue-500 hover:to-blue-600' |
|
href='/signup' |
|
> |
|
<span>Register</span> |
|
</a> |
|
</div> |
|
|
|
<script> |
|
import Cookies from 'js-cookie'; |
|
import { TOKEN_COOKIE_NAME } from '../../lib/constants'; |
|
const spinner = document.getElementById('navigation-spinner'); |
|
const registerButton = document.getElementById('register-button'); |
|
const accountDropdown = document.getElementById('account-dropdown'); |
|
spinner?.classList.add('hidden'); |
|
|
|
const token = Cookies.get(TOKEN_COOKIE_NAME); |
|
|
|
if (token) { |
|
accountDropdown?.classList.remove('hidden'); |
|
} else { |
|
registerButton?.classList.remove('hidden'); |
|
} |
|
</script>
|
|
|