fix(browse): tabs and search on one row #99
@@ -9,7 +9,14 @@
|
||||
under it (matches SettingsView's sticky tabs). -->
|
||||
<div class="fc-browse__head">
|
||||
<v-container fluid class="py-0">
|
||||
<v-tabs v-model="tab" density="compact" color="accent">
|
||||
<!-- Tabs and search share one row: the axis switcher on the left, the
|
||||
search field + active-scope chips on the right (operator-asked
|
||||
2026-06-12). Wraps to two rows only on narrow viewports. -->
|
||||
<div class="fc-browse__bar">
|
||||
<v-tabs
|
||||
v-model="tab" density="compact" color="accent"
|
||||
class="fc-browse__tabs"
|
||||
>
|
||||
<v-tab value="posts">Posts</v-tab>
|
||||
<v-tab value="artists">Artists</v-tab>
|
||||
<v-tab value="tags">Tags</v-tab>
|
||||
@@ -41,6 +48,7 @@
|
||||
>{{ platform }}</v-chip>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</v-container>
|
||||
</div>
|
||||
|
||||
@@ -150,12 +158,23 @@ function clearFilter(key) {
|
||||
z-index: 4;
|
||||
background: rgb(var(--v-theme-surface));
|
||||
}
|
||||
.fc-browse__bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
flex-wrap: wrap;
|
||||
padding: 8px 0;
|
||||
}
|
||||
.fc-browse__tabs {
|
||||
flex: 0 0 auto;
|
||||
width: auto;
|
||||
}
|
||||
.fc-browse__search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
flex-wrap: wrap;
|
||||
padding: 10px 0 12px;
|
||||
flex: 1 1 320px;
|
||||
}
|
||||
.fc-browse__search-field {
|
||||
max-width: 360px;
|
||||
|
||||
Reference in New Issue
Block a user