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

Extend shop description to 80% and fix notification on mobiles when sidemenu is open 

Signed-off-by: Egor Savkin <es@m-labs.hk>
This commit is contained in:
Egor Savkin 2024-01-15 15:51:04 +08:00
parent 4f702e9064
commit 7ceba1d461
5 changed files with 12 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
sass/css/_shop.scss
View File

@ -213,7 +213,7 @@ button {
font-size: .8rem;
> .description {
width: 50%;
width: 80%;
padding-right: 30px;
}
}

2
static/js/shop.bundle.js
View File

File diff suppressed because one or more lines are too long

7
static/js/shop/OptionsWrapper.jsx
View File

@ -8,7 +8,9 @@ export function OptionsDialogWrapper({crate_index, card_index, first, last}) {
const options = useShopStore((state) => state.crates[crate_index].items[card_index].options);
const options_data = useShopStore((state) => state.crates[crate_index].items[card_index].options_data);
const card_size = useShopStore((state) => state.crates[crate_index].items[card_index].size);
const card_id = useShopStore((state) => state.crates[crate_index].items[card_index].id);
const options_class = useShopStore((state) => state.crates[crate_index].items[card_index].options_class);
const sideMenuIsOpen = useShopStore((state) => state.sideMenuIsOpen);
const onOptionsUpdate = useShopStore((state) => state.updateOptions);
@ -17,11 +19,12 @@ export function OptionsDialogWrapper({crate_index, card_index, first, last}) {
options={options}
data={options_data}
options_class={options_class}
key={"popover" + crate_id +card_index}
id={"popover"+ crate_id + card_index}
key={"popover" + crate_id +card_id}
id={"popover"+ crate_id + card_id}
big={card_size === "big"}
first={first}
last={last}
sideMenuIsOpen={sideMenuIsOpen}
target={{
construct: ((outvar, value) => {
// #!options_log

3
static/js/shop/options/DialogPopup.jsx
View File

@ -3,7 +3,7 @@ import {useClickAway} from "./useClickAway";
import {ProcessOptions} from "./Options";
import {Notification} from "./Notification";
export function DialogPopup({options, data, target, id, big, first, last, options_class}) {
export function DialogPopup({options, data, target, id, big, first, last, options_class, sideMenuIsOpen}) {
const [show, setShow] = useState(false);
const ref = useClickAway((e) => {
if (e.type === "mousedown") // ignore touchstart
@ -21,6 +21,7 @@ export function DialogPopup({options, data, target, id, big, first, last, option
<Notification
id={"processed_options_notification" + id}
tip="Customization options available"
sideMenuIsOpen={sideMenuIsOpen}
content={
<img className="alert-info" src={show ? "/images/shop/icon-close.svg" : "/images/shop/icon-customize.svg"}
onClick={handleClick}/>

7
static/js/shop/options/Notification.jsx
View File

@ -1,8 +1,7 @@
import {OverlayTrigger, Tooltip} from "react-bootstrap";
import React, {useEffect, useState, useRef} from "react";
import {useClickAway} from "./useClickAway";
import React, {useEffect, useState} from "react";
export function Notification({id, tip, content}) {
export function Notification({id, tip, content, sideMenuIsOpen}) {
const [show, setShow] = useState(false);
useEffect(() => {
@ -23,7 +22,7 @@ export function Notification({id, tip, content}) {
show={show}
onToggle={() => setShow(false)}
overlay={<Tooltip id={id}>{tip}</Tooltip>}
rootClose
rootClose={!sideMenuIsOpen}
>
{content}
</OverlayTrigger>