[UX] #577 stack VPD primary navigation above submenus

This commit is contained in:
devmrko
2026-07-01 09:41:01 +09:00
parent c52890e721
commit 670918f56f
3 changed files with 32 additions and 8 deletions

View File

@@ -94,23 +94,43 @@ body {
box-shadow: 0 1px 0 rgba(32, 30, 28, .03);
}
.rw-nav {
display: block;
padding: 0;
}
.navbar-brand {
color: var(--rw-text);
font-weight: 700;
}
.rw-nav .container {
.rw-nav-top,
.rw-primary-menu-bar .container {
align-items: center;
display: flex;
flex-wrap: wrap;
gap: .75rem;
}
.rw-nav-top {
justify-content: space-between;
min-height: 3.5rem;
}
.rw-primary-menu-bar {
border-top: 1px solid var(--rw-border);
}
.rw-primary-menu-bar .container {
min-height: 3.1rem;
}
.rw-menu {
align-items: center;
display: flex;
flex-wrap: wrap;
gap: .35rem;
width: 100%;
}
.rw-menu-trigger {

View File

@@ -12,18 +12,22 @@
</head>
<body>
<nav th:fragment="nav" class="navbar rw-nav navbar-expand-lg" data-product-nav>
<div class="container">
<div class="container rw-nav-top">
<a class="navbar-brand" href="/">VPD 권한 운영</a>
<div class="rw-menu" aria-label="주요 메뉴">
<form method="post" action="/logout">
<input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}">
<button class="btn btn-sm btn-outline-secondary" type="submit">로그아웃</button>
</form>
</div>
<div class="rw-primary-menu-bar">
<div class="container">
<div class="rw-menu" aria-label="주요 메뉴">
<button class="rw-menu-trigger" type="button" data-submenu-trigger="access" aria-controls="submenu-access" aria-expanded="false">권한 관리</button>
<button class="rw-menu-trigger" type="button" data-submenu-trigger="protection" aria-controls="submenu-protection" aria-expanded="false">보호 정책 관리</button>
<button class="rw-menu-trigger" type="button" data-submenu-trigger="knowledge" aria-controls="submenu-knowledge" aria-expanded="false">지식자료 관리</button>
<button class="rw-menu-trigger" type="button" data-submenu-trigger="verification" aria-controls="submenu-verification" aria-expanded="false">접근 검증</button>
</div>
</div>
<form method="post" action="/logout" class="ms-auto">
<input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}">
<button class="btn btn-sm btn-outline-secondary" type="submit">로그아웃</button>
</form>
</div>
<div class="rw-submenu-bar" data-submenu-bar hidden>
<div class="container">