diff --git a/src/css/Components/selected.css b/src/css/Components/selected.css index 213d614..6aa7f93 100644 --- a/src/css/Components/selected.css +++ b/src/css/Components/selected.css @@ -16,4 +16,48 @@ #selectedActions{ display: flex; flex-direction:row; -} \ No newline at end of file +} + +#confirmationDelete{ + display: flex; + height:5vh; + flex-direction: column; + justify-content: center; + align-items: center; +} + +#confirmationDeleteTxt{ + color:white; + text-align: center; + font-family: 'Wellfleet',cursive; + font-size : 1.5vw +} + +#choiceDelete{ + margin-top:0.5vh; + display:flex; + justify-content: center; + align-items: center; + font-family: 'Wellfleet', cursive; + font-size:1.3vw; +} + #yesDelete{ + background-color:white; + padding:10% 15% 10% 15%; + border-radius: 1.2vw; + cursor: pointer; + border: 2px solid black; + color:black; + margin-right:1vw; + } + + #noDelete{ + background-color: #0036C1; + padding:10% 15% 10% 15%; + border-radius: 15px; + cursor: pointer; + border: 2px solid black; + color:white; + margin-left:1vw + } + diff --git a/src/js/Components/Selected.js b/src/js/Components/Selected.js index 262fbab..518c947 100644 --- a/src/js/Components/Selected.js +++ b/src/js/Components/Selected.js @@ -10,7 +10,7 @@ class Selected extends Component { constructor(props){ super(props) this.state = { - redirect:false + onDeleteConfirmation:false } } @@ -22,31 +22,49 @@ class Selected extends Component { this.props.updateArticles(1) } + handleDeleteConfirmation = () => { + this.setState({onDeleteConfirmation:true}) + } + + handleNoDelete = () => { + this.setState({onDeleteConfirmation:false}) + } + render() { return (
- {this.props.counter ? - <> -

Vous avez sélectionné {this.props.counter} articles

-
- -
- + {this.props.counter ? + this.state.onDeleteConfirmation ? +
+ {this.props.counter === 1 ? +
Tu veux vraiment supprimer cet article ?
+ :
Tu veux vraiment supprimer ces {this.props.counter} articles ?
} +
+
Oui
+
Non
- - -
- +
+ : <> +

Vous avez sélectionné {this.props.counter} articles

+
+ +
+ +
+
+ +
+ +
+
+ +
+ +
+
-
- -
- -
-
-
- + : null}
); diff --git a/src/js/Views/Stock.js b/src/js/Views/Stock.js index 401d43c..4249def 100644 --- a/src/js/Views/Stock.js +++ b/src/js/Views/Stock.js @@ -73,7 +73,7 @@ export default class Stock extends React.Component { selectArticles = (e,id) => { let currentElement = e.target; - let iconElement; + let iconElement = e.target; if (e.target.tagName === "path"){ currentElement = e.target.parentElement iconElement = currentElement @@ -127,7 +127,7 @@ export default class Stock extends React.Component { element.style.cssText = "background-color:rgba(255, 21, 21, 0.28);" break; case "red&white" : - element.style.cssText = "background-color:rgba(255, 107, 107, 0.28);" + element.style.cssText = "background-color:rgba(255, 139, 139, 0.60);" break; default : break;