Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-30 23:18:47 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

nav tabs count ensured regardless of back button

Browse source
This commit is contained in:
NikolaBorislavovHristov 2019-04-22 18:40:38 +03:00
parent 2f287113ac
commit 875f7a925c
2 changed files with 22 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/common/NavBar/NavBar.js
View file

@ -22,15 +22,17 @@ const NavBar = ({ backButton, tabs, title, searchInput, userMenu }) => (
}
{
tabs.length > 0 ?
tabs.map(({ href, icon, label }) => (
<NavBarButton
key={href}
className={styles['nav-bar-button']}
href={href}
icon={icon}
label={label}
/>
))
<div className={styles['tabs-container']}>
{tabs.map(({ href, icon, label }) => (
<NavBarButton
key={href}
className={styles['nav-bar-button']}
href={href}
icon={icon}
label={label}
/>
))}
</div>
:
<h2 className={styles['title']}>{title}</h2>
}

14
src/common/NavBar/styles.less
View file

@ -2,9 +2,11 @@
--nav-bar-height: 44px;
font-size: 16px;
.nav-bar-button {
&:nth-of-type(n+4) {
display: none;
.tabs-container {
.nav-bar-button {
&:nth-child(n+5) {
display: none;
}
}
}
}
@ -17,6 +19,12 @@
background-color: var(--color-secondarydark);
overflow: hidden;
.tabs-container {
flex: none;
display: flex;
flex-direction: row;
}
.nav-bar-button {
max-width: calc(var(--nav-bar-height) * 3.5);
height: var(--nav-bar-height);