nav.is-fixed-top.navbar(role='navigation', aria-label='main navigation', style="box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;")
    .container
        .navbar-brand
            a.navbar-item(href='/')
                .title YSir
                //- img(src='https://bulma.io/images/bulma-logo.png', width='112', height='28')
            a.navbar-burger(role='button', aria-label='menu', aria-expanded='false', data-target='navbarBasicExample')
                span(aria-hidden='true')
                span(aria-hidden='true')
                span(aria-hidden='true')
        #navbarBasicExample.navbar-menu
            .navbar-start
                a.navbar-item(hx-get="/?htmx" hx-push-url="/" hx-trigger="click" hx-target="#single-page" hx-swap="innerHTML")
                    | 首页
                a.navbar-item(hx-get="/color?htmx" hx-push-url="/color" hx-trigger="click" hx-target="#single-page" hx-swap="innerHTML")
                    | 颜色
                .navbar-item.has-dropdown.is-hoverable
                    a.navbar-link
                        | 更多
                    .navbar-dropdown
                        a.navbar-item(hx-get="/about?htmx" hx-push-url="/about" hx-trigger="click" hx-target="#single-page" hx-swap="innerHTML")
                            | 关于本站
                        a.navbar-item
                            | 关于作者
                        hr.navbar-divider
                        a.navbar-item
                            | 报告问题
            .navbar-end
                if !isLogin
                    .navbar-item
                        .buttons
                            a.button.is-primary(href="/register")
                                strong 注册
                            a.button.is-light(href="/login")
                                | 登录
                else
                    .navbar-item.has-dropdown.is-hoverable
                        a.navbar-link
                            .image.is-28x28(style="margin-right: 8px;")
                                img.is-rounded(src=user.avatar alt=user.nickname)
                            div #{user.nickname}
                        .navbar-dropdown.is-right
                            a.navbar-item(hx-get="/user?htmx" hx-push-url="/user" hx-trigger="click" hx-target="#single-page" hx-swap="innerHTML")
                                | 用户资料
                            hr.navbar-divider
                            a.navbar-item(href="/user/logout")
                                | 退出
                            form(action="/user/del" method="post")
                                +security
                                a.navbar-item 
                                    button(type="submit") 删除

script.
    // Get all "navbar-burger" elements
    const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll(".navbar-burger"), 0)

    // Add a click event on each of them
    $navbarBurgers.forEach(el => {
        el.addEventListener("click", () => {
            // Get the target from the "data-target" attribute
            const target = el.dataset.target
            const $target = document.getElementById(target)

            // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
            el.classList.toggle("is-active")
            $target.classList.toggle("is-active")
        })
    })