butterflyvu/src/components/Sidebar.astro
2025-02-05 17:28:08 -05:00

68 lines
No EOL
2.2 KiB
Text
Executable file

---
// Settings
import { SiteSettings, SidebarItems } from '@config'
// Properties
const { Blog } = Astro.props
---
<div class="sidebar">
<div class="desktop-s">
{SidebarItems.map((item) => (
item.heading ?
<h2>{item.heading}</h2>
:
<a href={
SiteSettings.SiteProtocol + '://' + SiteSettings.SiteDomain + SiteSettings.SiteBase + item.link
}>
{item.text}
{() => {
if (item.badge === undefined) {
return null
} else {
return <span class={'sidebar-badge badge-variant-' + item.badge_variant}>{item.badge}</span>
}
}}
</a>
))}
</div>
<details class="mobile-s">
<summary>Menu</summary>
{SidebarItems.map((item) => (
item.heading ?
<h2>{item.heading}</h2>
:
<a href={
SiteSettings.SiteProtocol + '://' + SiteSettings.SiteDomain + SiteSettings.SiteBase + item.link
}>
{item.text}
{() => {
if (item.badge === undefined) {
return null
} else {
return <span class={'sidebar-badge badge-variant-' + item.badge_variant}>{item.badge}</span>
}
}}
</a>
))}
</details>
</div>
<script is:inline define:vars={{SiteSettings}}>
var CurrentURLPath = window.location.pathname
document.querySelector('.sidebar a[href="' + SiteSettings.SiteProtocol + '://' + SiteSettings.SiteDomain + SiteSettings.SiteBase + CurrentURLPath + '"]').style.background = '#323232'
document.querySelector('.sidebar .mobile-s a[href="' + SiteSettings.SiteProtocol + '://' + SiteSettings.SiteDomain + SiteSettings.SiteBase + CurrentURLPath + '"]').style.background = '#323232'
</script>
<!-- {
()=> {
if (item.badge === "external") {
return <p>Log Out</p>
} else {
return <p>Sign In</p>
}
}
} -->