Fixed: Links and already added icons overflowing on add series search results

This commit is contained in:
Mark McDowall 2020-08-16 10:14:37 -07:00
parent e42aad4b2f
commit d222387d01
2 changed files with 61 additions and 30 deletions

View File

@ -34,10 +34,20 @@
.content {
flex: 0 1 100%;
overflow: hidden;
}
.titleRow {
display: flex;
}
.titleContainer {
display: flex;
align-items: flex-end;
flex: 0 1 auto;
}
.title {
display: flex;
font-weight: 300;
font-size: 36px;
}
@ -47,6 +57,14 @@
color: $disabledColor;
}
.icons {
display: flex;
align-items: center;
justify-content: space-between;
flex: 1 0 auto;
height: 55px;
}
.tvdbLink {
composes: link from '~Components/Link/Link.css';
@ -68,3 +86,10 @@
.overview {
margin-top: 20px;
}
@media only screen and (max-width: $breakpointMedium) {
.titleRow {
justify-content: space-between;
overflow: hidden;
}
}

View File

@ -97,6 +97,8 @@ class AddNewSeriesSearchResult extends Component {
}
<div className={styles.content}>
<div className={styles.titleRow}>
<div className={styles.titleContainer}>
<div className={styles.title}>
{title}
@ -107,7 +109,10 @@ class AddNewSeriesSearchResult extends Component {
</span> :
null
}
</div>
</div>
<div className={styles.icons}>
{
isExistingSeries ?
<Icon
@ -131,6 +136,7 @@ class AddNewSeriesSearchResult extends Component {
/>
</Link>
</div>
</div>
<div>
<Label size={sizes.LARGE}>