ysc/thebet365
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: separate header back-bar and tabs in InboxHubView on main

Browse Source
This commit is contained in:
Mars
2026-06-18 17:37:46 +08:00
parent 3f441477b8
commit 7288ef3f57
1 changed files with 2 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
apps/player/src/views/InboxHubView.vue
View File

@@ -107,13 +107,12 @@ onActivated(() => {
<template> <template>
<div class="inbox-hub" :class="{ 'inbox-hub--tabs': inboxEnabled }"> <div class="inbox-hub" :class="{ 'inbox-hub--tabs': inboxEnabled }">
<header v-if="!inboxEnabled" class="page-header"> <header class="page-header">
<button type="button" class="back-btn" :aria-label="t('messages.back')" @click="goBack">‹</button> <button type="button" class="back-btn" :aria-label="t('messages.back')" @click="goBack">‹</button>
<h1>{{ t(hubTitleKey) }}</h1> <h1>{{ t(hubTitleKey) }}</h1>
</header> </header>
<div v-if="inboxEnabled" class="hub-top-bar"> <div v-if="inboxEnabled" class="hub-top-bar">
<button type="button" class="hub-back-btn" :aria-label="t('messages.back')" @click="goBack">‹</button>
<nav class="hub-tabs" role="tablist"> <nav class="hub-tabs" role="tablist">
<button <button
type="button" type="button"
@@ -217,26 +216,11 @@ onActivated(() => {
} }
.hub-top-bar { .hub-top-bar {
display: flex;
align-items: stretch;
gap: 6px;
margin: 0; margin: 0;
border-bottom: 1px solid var(--border); border-bottom: 1px solid var(--border);
} }
.hub-back-btn {
flex-shrink: 0;
align-self: center;
width: 32px;
height: 32px;
border: 1px solid var(--border);
border-radius: 8px;
background: #141414;
color: var(--gold);
font-size: 20px;
line-height: 1;
cursor: pointer;
}
.hub-tabs { .hub-tabs {
flex: 1; flex: 1;