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

StreamsList styles adapted to design changes

Browse source
This commit is contained in:
svetlagasheva 2020-03-17 18:39:51 +02:00
parent 1c9c08104c
commit 6ce25dd493
2 changed files with 13 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/routes/MetaDetails/StreamsList/StreamsList.js
View file

@ -38,9 +38,9 @@ const StreamsList = ({ className, streamsResources }) => {
</React.Fragment>
}
</div>
<Button className={styles['install-addons-container']} title={'Install addons'} href={'#/addons'}>
<Button className={styles['install-addons-container']} title={'Install Addons'} href={'#/addons'}>
<Icon className={styles['icon']} icon={'ic_addons'} />
<div className={styles['label']}>Install addons</div>
<div className={styles['label']}>Install Addons</div>
</Button>
</div>
);

32
src/routes/MetaDetails/StreamsList/styles.less
View file

@ -1,7 +1,8 @@
@import (reference) '~stremio-colors/dist/less/stremio-colors.less';
.streams-list-container {
display: flex;
flex-direction: column;
background: var(--color-backgrounddark80);
.streams-scroll-container {
flex-grow: 0;
@ -14,20 +15,11 @@
padding: 2rem 0;
font-size: 2rem;
text-align: center;
color: var(--color-surfacelighter);
color: @color-surface-light5;
}
.stream {
width: var(--item-size);
margin: 1rem 2rem;
&:first-child {
margin-top: 2rem;
}
&:last-child {
margin-bottom: 0;
}
}
}
@ -38,30 +30,28 @@
flex-direction: row;
align-items: center;
justify-content: center;
width: var(--item-size);
margin: 1rem 2rem 2rem 2rem;
padding: 1rem;
background-color: var(--color-signal5);
padding: 1.3rem;
background-color: @color-accent3;
&:hover, &:focus {
filter: brightness(1.2);
background-color: @color-accent3-light2;
}
.icon {
flex: none;
width: 3rem;
height: 3rem;
width: 2rem;
height: 2rem;
margin-right: 1rem;
fill: var(--color-surfacelighter);
fill: @color-surface-light5;
}
.label {
flex-grow: 0;
flex-shrink: 1;
flex-basis: auto;
font-size: 1.5rem;
font-size: 1.4rem;
max-height: 3.6em;
color: var(--color-surfacelighter);
color: @color-surface-light5;
}
}
}