add new ui for tabs

This commit is contained in:
Ashley 2023-10-31 15:49:32 +00:00
parent f832d49d58
commit 26ef02da9e

View file

@ -98,6 +98,42 @@ summary:hover{
}
.tags.rec {
font-weight: 600;
font-stretch: expanded;
overflow:hidden;
width: auto;
max-width: fit-content;
margin-right: auto;
padding-left: 1.5em;
margin-top: 7px;
display: flex;
gap: 3px;
margin-inline: auto;
margin-left: 8em;
}
.tags.rec:hover{
overflow-x:auto;
}
.tags.rec > .tag {
border-radius: 8px;
background:var(--chip-background-hover);
}
.tag {
padding: 5px;
border-radius: 4px;
word-break: break-all;
white-space: nowrap;
font-family: ubuntu, sans-serif;
}
.hide {
display: none;
}
@ -367,11 +403,21 @@ video[counter].classList.add("shake");
</div>
<div class="channel-page" style="background-color: var(--channel-contents-background);">
<div class="tabs tabs-center">
<div class="tags rec">
<a href="/search?query=<%=q%>" class="tab">Videos</a>
<a href="/search?query=<%=q%>" style="color:#fff;text-decoration:none;
" class="tag c">
Videos
</a>
<a style=" background: #111;" class="tag">
Web
</a>
</div>
<a class="tab active">Web</a>
</div>