fix: overflow of custom images + visual

This commit is contained in:
alexsparkes 2022-07-12 22:18:41 +01:00
parent 710ad50ab2
commit 4e68a2c881
3 changed files with 19 additions and 9 deletions

View File

@ -47,23 +47,31 @@
.images-row {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
height: 250px;
padding: 20px;
grid-gap: 20px;
@include themed() {
div {
background: t($modal-sidebar);
padding: 10px;
box-shadow: 0 0 0 4px t($modal-sidebarActive);
border-radius: t($borderRadius);
gap: 10px;
border: 5px t($modal-sidebar) solid;
display: flex;
align-items: center;
justify-content: center;
flex-flow: column;
gap: 5px;
img {
width: auto;
height: 100px;
width: 100%;
height: 200px;
object-fit: cover;
border-radius: t($borderRadius);
}
button {
padding: 0 30px 0 30px;
background: t($modal-background);
border: none !important;
&:hover {
background: t($modal-sidebarActive);
}
}
}
.iconButton {
width: calc(100% - 22px);

View File

@ -84,6 +84,8 @@ export default class Stats extends PureComponent {
<div className="statsGrid">
<div className="statSection leftPanel">
<span className="title">{getMessage('modals.main.settings.sections.stats.achievements')}</span>
<br />
<span className='subtitle'>1/5 Unlocked</span>
<div className="achievements">
{this.state.stats['tabs-opened'] >= 10 && achievement('10/10 IGN', 'Opened 10 tabs')}
{this.state.stats['tabs-opened'] >= 39 && achievement('Thank you', 'Opened 39 tabs')}

View File

@ -253,11 +253,11 @@ export default class CustomSettings extends PureComponent {
{this.videoCheck(url) ? <MdPersonalVideo className="customvideoicon" /> : null}
{this.state.customBackground.length > 0 ? (
<button
className="iconButton"
onClick={() => this.modifyCustomBackground('remove', index)}
>
Remove Image
<MdCancel />
</button>
</button>
) : null}
</div>
))}