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

show more styles updated

Browse source
This commit is contained in:
NikolaBorislavovHristov 2019-07-23 13:57:00 +03:00
parent 5b87507a6e
commit b5bc61b408
2 changed files with 13 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/routes/Board/Board.js
View file

@ -2,7 +2,7 @@ const React = require('react');
const classnames = require('classnames');
const Icon = require('stremio-icons/dom');
const { Input } = require('stremio-navigation')
const { MetaItem, MainNavBar } = require('stremio-common');
const { MetaItem, MainNavBar } = require('stremio/common');
const useCatalogs = require('./useCatalogs');
const styles = require('./styles');
@ -33,9 +33,9 @@ const BoardRow = ({ className, items }) => {
/>
))}
</div>
<Input className={classnames(styles['show-more-container'], 'focusable-with-border')} type={'button'}>
<div className={styles['label']}>SEE ALL</div>
<Icon className={styles['icon']} icon={'ic_back_ios'} />
<Input className={classnames(styles['show-more-container'], 'focusable-with-border')} type={'button'} title={'SHOW MORE'}>
<div className={styles['label']}>SHOW MORE</div>
<Icon className={styles['icon']} icon={'ic_arrow_thin_right'} />
</Input>
</div>
);

30
src/routes/Board/styles.less
View file

@ -20,7 +20,7 @@
&.addon-catalog-row {
.meta-item {
&:nth-child(n+8) {
&:nth-child(n+7) {
display: none;
}
}
@ -48,21 +48,14 @@
.board-row {
width: 100%;
margin: 2em 0;
padding: 0 1em;
display: flex;
flex-direction: row;
align-items: stretch;
&:first-child {
padding-top: 1em;
}
&:last-child {
padding-bottom: 1em;
}
.meta-items-container {
flex: 1;
flex: 8;
display: flex;
flex-direction: row;
align-items: stretch;
@ -86,14 +79,13 @@
}
.show-more-container {
flex: none;
flex: 1;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
width: 10em;
margin: 1em;
padding: 0 0.5em;
padding: 0.5em;
background-color: var(--color-backgroundlight);
cursor: pointer;
@ -110,13 +102,11 @@
}
.label {
font-size: 1.1em;
line-height: 1.3em;
max-height: 2.6em;
font-size: 1.2em;
line-height: 1.2em;
max-height: 3.6em;
color: var(--color-surfacelight);
word-break: break-all;
word-break: break-word;
overflow: hidden;
text-align: center;
}
.icon {
@ -124,9 +114,7 @@
width: 1.3em;
height: 1.3em;
margin-left: 0.3em;
transform: rotateY(180deg);
fill: var(--color-surfacelight);
overflow: visible;
}
}
}