Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-21 11:42:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

basic search bar placeholder implemented

Browse source
This commit is contained in:
NikolaBorislavovHristov 2019-09-18 22:59:23 +03:00
parent c3adb07bc4
commit 195046d244
2 changed files with 22 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/routes/Addons/Addons.js
View file

@ -19,6 +19,7 @@ const Addons = ({ urlParams }) => {
{dropdowns.map((dropdown) => ( {dropdowns.map((dropdown) => (
<Dropdown {...dropdown} key={dropdown.name} className={styles['dropdown']} /> <Dropdown {...dropdown} key={dropdown.name} className={styles['dropdown']} />
))} ))}
<div className={styles['search-bar-container']} />
</div> </div>
<div className={styles['addons-list-container']} > <div className={styles['addons-list-container']} >
{addons.map((addon) => ( {addons.map((addon) => (

37
src/routes/Addons/styles.less
View file

@ -19,26 +19,14 @@
flex-direction: row; flex-direction: row;
margin: 2rem; margin: 2rem;
.dropdown, .add-button-container {
flex-grow: 0;
flex-shrink: 1;
height: 3rem;
&:not(:last-child) {
margin-right: 1rem;
}
}
.dropdown {
flex-basis: 15rem;
}
.add-button-container { .add-button-container {
flex-basis: auto; flex: none;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
height: 3rem;
max-width: 15rem; max-width: 15rem;
margin-right: 1rem;
padding: 0 1rem; padding: 0 1rem;
background-color: var(--color-signal5); background-color: var(--color-signal5);
@ -55,12 +43,29 @@
} }
.add-button-label { .add-button-label {
flex: 1; flex-grow: 0;
flex-shrink: 1;
flex-basis: auto;
max-height: 2.4em; max-height: 2.4em;
font-size: 1.1rem; font-size: 1.1rem;
color: var(--color-surfacelighter); color: var(--color-surfacelighter);
} }
} }
.dropdown {
flex-grow: 0;
flex-shrink: 1;
flex-basis: 15rem;
height: 3rem;
margin-right: 1rem;
}
.search-bar-container {
flex-grow: 0;
flex-shrink: 1;
flex-basis: 19rem;
height: 3rem;
}
} }
.addons-list-container { .addons-list-container {