M-Labs/web2019
5
0
Fork 2
Code Issues 20 Pull Requests 3 Releases Wiki Activity

fix(mobile/shop): Removes btn delete card from crate

Browse Source 
because no mouseover on mobile
This commit is contained in:
sovanna 2020-01-20 17:43:33 +01:00
parent 14ec597b85
commit e96c0dc524
2 changed files with 21 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
static/css/order-hardware.css
View File

@ -174,9 +174,9 @@
.dropdown-item {
font-size: .75em;
}
.sticky-top {
/*.sticky-top {
position: fixed;
}
}*/
.logo > img {
height: 20px;
}
@ -301,16 +301,16 @@
z-index: 0;
}
/*#root-shop .layout>aside.aside.menu-opened + section.main:after {
#root-shop .layout>aside.aside.menu-opened + section.main:after {
content: '';
position: absolute;
height: 100%;
width: 100%;
background-color: rgba(0, 0, 0, .8);
background-color: rgba(0, 0, 0, 0);
top: 0;
bottom: 0;
z-index: 10;
}*/
}
#root-shop .layout>aside.aside {
/*transform: translate3d(-310px, 0px, 0px);*/
@ -358,9 +358,9 @@
.dropdown-item {
font-size: .75em;
}
.sticky-top {
/*.sticky-top {
position: fixed;
}
}*/
.logo > img {
height: 20px;
}
@ -404,15 +404,15 @@
z-index: 0;
}
/*#root-shop .layout>aside.aside.menu-opened + section.main:after {
#root-shop .layout>aside.aside.menu-opened + section.main:after {
content: '';
position: absolute;
height: 100%;
width: 100%;
background-color: rgba(0, 0, 0, .8);
background-color: rgba(0, 0, 0, 0);
top: 0;
bottom: 0;
}*/
}
#root-shop .layout>aside.aside {
/*transform: translate3d(-310px, 0px, 0px);*/

15
static/js/shop.jsx
View File

@ -277,6 +277,7 @@ class ProductCartItem extends React.PureComponent {
static get propTypes() {
return {
isMobile: PropTypes.bool,
hovered: PropTypes.bool,
index: PropTypes.number.isRequired,
model: PropTypes.object.isRequired,
@ -340,14 +341,14 @@ class ProductCartItem extends React.PureComponent {
}
handleOnMouseEnterRemoveItem(index, e) {
if (this.props.onToggleOverlayRemove) {
if (this.props.onToggleOverlayRemove && !this.props.isMobile) {
this.props.onToggleOverlayRemove(index, true);
}
e.preventDefault();
}
handleOnMouseLeaveRemoveItem(index, e) {
if (this.props.onToggleOverlayRemove) {
if (this.props.onToggleOverlayRemove && !this.props.isMobile) {
this.props.onToggleOverlayRemove(index, false);
}
e.preventDefault();
@ -557,6 +558,7 @@ class Cart extends React.PureComponent {
static get propTypes() {
return {
isMobile: PropTypes.bool,
nbrSlots: PropTypes.number,
itemHovered: PropTypes.string,
data: PropTypes.object.isRequired,
@ -569,6 +571,7 @@ class Cart extends React.PureComponent {
render() {
const {
isMobile,
nbrSlots,
itemHovered,
data,
@ -585,6 +588,7 @@ class Cart extends React.PureComponent {
}
return (
<ProductCartItem
isMobile={isMobile}
hovered={item.id === itemHovered}
key={item.id}
index={index}
@ -1733,6 +1737,8 @@ class Shop extends React.PureComponent {
mobileSideMenuShouldOpen,
} = this.state;
const isMobile = window.deviceIsMobile();
return (
<DragDropContext onDragEnd={this.handleOnDragEnd}>
@ -1747,13 +1753,13 @@ class Shop extends React.PureComponent {
data={columns['backlog']}
onClickAddItem={this.handleClickAddItem}
onClickToggleMobileSideMenu={this.handleClickToggleMobileSideMenu}
isMobile={window.deviceIsMobile()}>
isMobile={isMobile}>
</Backlog>
}
main={(
<OrderPanel
onClickToggleMobileSideMenu={this.handleClickToggleMobileSideMenu}
isMobile={window.deviceIsMobile()}
isMobile={isMobile}
title="Order hardware"
description="
Drag and drop the cards you want into the crate below to see how the combination would look like. If you have any issues with this ordering system, or if you need other configurations, email us directly anytime at sales@m-****.hk. The price is estimated and must be confirmed by a quote."
@ -1769,6 +1775,7 @@ class Shop extends React.PureComponent {
<Cart
nbrSlots={crateModeSlots[currentMode]}
data={columns['cart']}
isMobile={isMobile}
itemHovered={currentItemHovered}
onToggleProgress={this.handleToggleItemProgress}
onToggleWarning={this.handleToggleItemWarning}