diff --git a/src/components/modals/main/settings/sections/background/Background.jsx b/src/components/modals/main/settings/sections/background/Background.jsx
index 54753675..69e2186e 100644
--- a/src/components/modals/main/settings/sections/background/Background.jsx
+++ b/src/components/modals/main/settings/sections/background/Background.jsx
@@ -1,6 +1,7 @@
import variables from 'modules/variables';
import { PureComponent, Fragment } from 'react';
import { toast } from 'react-toastify';
+import { Cancel } from '@material-ui/icons';
import Checkbox from '../../Checkbox';
import Dropdown from '../../Dropdown';
@@ -200,8 +201,10 @@ export default class BackgroundSettings extends PureComponent {
{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.custom_background')} {this.getMessage(this.languagecode, 'modals.main.settings.buttons.reset')}
{this.state.customBackground.map((_url, index) => (
- {this.state.customBackground.length > 1 ? : null}
this.customBackground(e, true, index)}>
+ {this.state.customBackground.length > 1 ? : null}
this.uploadCustombackground(index)}>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.ypload')}
{this.videoCustomSettings(index)}
diff --git a/src/scss/modules/_buttons.scss b/src/scss/modules/_buttons.scss
index b6ab171f..2b34f974 100644
--- a/src/scss/modules/_buttons.scss
+++ b/src/scss/modules/_buttons.scss
@@ -87,3 +87,26 @@
font-size: 2em;
}
}
+
+.cleanButton {
+ background: none;
+ border: none;
+ vertical-align: middle;
+
+ svg {
+ fill: #ff4757;
+ border-radius: 100%;
+ background-color: var(--background);
+ height: 1.2em;
+ width: 1.2em;
+ cursor: pointer;
+ transition: ease 0.5s;
+
+ &:hover {
+ border-radius: 100%;
+ background: #ff4757;
+ fill: var(--background);
+ transition: ease 0.5s;
+ }
+ }
+}
\ No newline at end of file