头部内容居中:限制最大宽度960px,搜索框不撑满全屏
This commit is contained in:
+5
-2
@@ -58,7 +58,8 @@ body {
|
||||
border-bottom: 1px solid var(--border-light);
|
||||
display: flex; align-items: center; justify-content: center; padding: 0 16px; z-index: 100; gap: 16px;
|
||||
}
|
||||
[data-theme="dark"] .header-bar { background: rgba(20,20,20,0.95); }
|
||||
.header-bar-inner { display: flex; align-items: center; gap: 16px; max-width: 960px; width: 100%; }
|
||||
[data-theme="dark"] .header-bar { background: rgba(28,28,30,0.95); }
|
||||
.header-bar .menu-btn {
|
||||
width: 36px; height: 36px; border: none; background: none;
|
||||
cursor: pointer; border-radius: var(--radius-sm);
|
||||
@@ -74,7 +75,7 @@ body {
|
||||
-webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
|
||||
}
|
||||
.header-bar .tagline { font-size: 11px; color: var(--text-tertiary); display: inline; }
|
||||
.search-box { flex: 1; min-width: 80px; position: relative; }
|
||||
.search-box { flex: 0 1 240px; min-width: 100px; position: relative; }
|
||||
.search-box input {
|
||||
width: 100%; padding: 8px 12px 8px 34px;
|
||||
border: 1px solid var(--border); border-radius: var(--radius-sm);
|
||||
@@ -256,6 +257,7 @@ body {
|
||||
<body>
|
||||
|
||||
<header class="header-bar">
|
||||
<div class="header-bar-inner">
|
||||
<button class="menu-btn" id="menuBtn" aria-label="菜单">
|
||||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
|
||||
</button>
|
||||
@@ -267,6 +269,7 @@ body {
|
||||
<span class="search-icon">🔍</span>
|
||||
<input type="text" id="searchInput" placeholder="搜索文档..." autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="chip-bar"><div class="chip-bar-inner" id="chipBar"></div></div>
|
||||
|
||||
Reference in New Issue
Block a user