From 8db73917ce02014918fa3e110b487f3afd2bfc88 Mon Sep 17 00:00:00 2001
From: johnshaughnessy <johnfshaughnessy@gmail.com>
Date: Wed, 5 Sep 2018 11:12:13 -0700
Subject: [PATCH] Fix user-select in firefox, safari (webkit)
---
src/assets/stylesheets/2d-hud.scss | 8 +++++++-
src/react-components/2d-hud.js | 4 ++--
2 files changed, 9 insertions(+), 3 deletions(-)
diff --git a/src/assets/stylesheets/2d-hud.scss b/src/assets/stylesheets/2d-hud.scss
index 67fbc0ada..ca0a87c33 100644
--- a/src/assets/stylesheets/2d-hud.scss
+++ b/src/assets/stylesheets/2d-hud.scss
@@ -1,12 +1,18 @@
@import 'shared';
+:local(.unselectable) {
+ -moz-user-select: none;
+ -webkit-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
:local(.container) {
position: absolute;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
- user-select: none;
&:local(.top) {
top: 10px;
diff --git a/src/react-components/2d-hud.js b/src/react-components/2d-hud.js
index ee5d75df5..c2db55e5f 100644
--- a/src/react-components/2d-hud.js
+++ b/src/react-components/2d-hud.js
@@ -5,7 +5,7 @@ import cx from "classnames";
import styles from "../assets/stylesheets/2d-hud.scss";
const TopHUD = ({ muted, frozen, spacebubble, onToggleMute, onToggleFreeze, onToggleSpaceBubble }) => (
- <div className={cx(styles.container, styles.top)}>
+ <div className={cx(styles.container, styles.top, styles.unselectable)}>
<div className={cx("ui-interactive", styles.panel, styles.left)}>
<div
className={cx(styles.iconButton, styles.mute, { [styles.active]: muted })}
@@ -38,7 +38,7 @@ TopHUD.propTypes = {
};
const BottomHUD = ({ onCreateObject, showPhotoPicker, onMediaPicked }) => (
- <div className={cx(styles.container, styles.column, styles.bottom)}>
+ <div className={cx(styles.container, styles.column, styles.bottom, styles.unselectable)}>
{showPhotoPicker ? (
<div className={cx("ui-interactive", styles.panel, styles.up)}>
<input
--
GitLab