filecoin-project/slate
1
1
Fork 0
mirror of https://github.com/filecoin-project/slate.git synced 2024-12-24 09:33:04 +03:00
Code Issues Packages Projects Releases Wiki Activity

mobile: updates onClick to onMouseUp and onTouchEnd

Browse Source
This commit is contained in:
@wwwjim 2020-08-26 21:27:50 -07:00
parent ab15d09572
commit 03bd8adda9
4 changed files with 13 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/core/ApplicationLayout.js
View File

@ -157,7 +157,11 @@ export default class ApplicationLayout extends React.Component {
allowedTypes={["sidebar"]} allowedTypes={["sidebar"]}
/> />
<div css={STYLES_SIDEBAR_HEADER}> <div css={STYLES_SIDEBAR_HEADER}>
<div css={STYLES_BLOCK} onClick={this.props.onDismissSidebar}> <div
css={STYLES_BLOCK}
onMouseUp={this.props.onDismissSidebar}
onTouchEnd={this.props.onDismissSidebar}
>
<SVG.Dismiss height="24px" /> <SVG.Dismiss height="24px" />
</div> </div>
</div> </div>

9
components/core/ApplicationNavigation.js
View File

@ -151,7 +151,8 @@ const Item = (props) => {
> >
<span <span
css={STYLES_EXPANDER} css={STYLES_EXPANDER}
onClick={props.onToggleShow ? props.onToggleShow : null} onMouseUp={props.onToggleShow ? props.onToggleShow : null}
onTouchEnd={props.onToggleShow ? props.onToggleShow : null}
> >
<span <span
css={STYLES_ICON_ELEMENT} css={STYLES_ICON_ELEMENT}
@ -169,7 +170,8 @@ const Item = (props) => {
</span> </span>
<span <span
css={STYLES_ICON} css={STYLES_ICON}
onClick={() => props.onNavigateTo({ id: props.id }, props.data)} onMouseUp={() => props.onNavigateTo({ id: props.id }, props.data)}
onTouchEnd={() => props.onNavigateTo({ id: props.id }, props.data)}
> >
<span <span
css={STYLES_ICON_ELEMENT} css={STYLES_ICON_ELEMENT}
@ -182,7 +184,8 @@ const Item = (props) => {
<span <span
css={STYLES_CHILDREN} css={STYLES_CHILDREN}
children={props.children} children={props.children}
onClick={() => props.onNavigateTo({ id: props.id }, props.data)} onMouseUp={() => props.onNavigateTo({ id: props.id }, props.data)}
onTouchEnd={() => props.onNavigateTo({ id: props.id }, props.data)}
style={{ style={{
color: props.activeIds[props.id] ? Constants.system.brand : null, color: props.activeIds[props.id] ? Constants.system.brand : null,
}} }}

2
components/core/CircleButtonGray.js
View File

@ -19,7 +19,7 @@ const STYLES_BUTTON = css`
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
flex-shrink: 0; flex-shrink: 0;
box-shadow: 0 0 1px 4px rgba(0, 0, 0, 0.04); box-shadow: 0 0 1px 4px rgba(0, 0, 0, 0.007);
:hover { :hover {
background-color: ${Constants.system.brand}; background-color: ${Constants.system.brand};

2
scenes/SceneSlate.js
View File

@ -10,7 +10,7 @@ import ScenePage from "~/components/core/ScenePage";
import ScenePageHeader from "~/components/core/ScenePageHeader"; import ScenePageHeader from "~/components/core/ScenePageHeader";
import Slate, { generateLayout } from "~/components/core/Slate"; import Slate, { generateLayout } from "~/components/core/Slate";
import SlateMediaObject from "~/components/core/SlateMediaObject"; import SlateMediaObject from "~/components/core/SlateMediaObject";
import CircleButtonLight from "~/components/core/CircleButtonLight"; import CircleButtonGray from "~/components/core/CircleButtonGray";
const moveIndex = (set, fromIndex, toIndex) => { const moveIndex = (set, fromIndex, toIndex) => {
const element = set[fromIndex]; const element = set[fromIndex];