From cba7ba88fd678928d8a36dda502178fb60c76758 Mon Sep 17 00:00:00 2001
From: Greg Fodor <gfodor@gmail.com>
Date: Tue, 2 Oct 2018 17:41:55 +0000
Subject: [PATCH] Fix up buttons and create dialog
---
src/assets/stylesheets/create-object-dialog.scss | 11 +++++------
src/assets/stylesheets/entry.scss | 1 +
src/assets/stylesheets/index.scss | 2 +-
src/assets/stylesheets/invite-dialog.scss | 2 +-
src/assets/stylesheets/shared.scss | 6 +++---
src/assets/stylesheets/ui-root.scss | 2 --
src/assets/translations.data.json | 2 +-
src/react-components/create-object-dialog.js | 2 +-
8 files changed, 13 insertions(+), 15 deletions(-)
diff --git a/src/assets/stylesheets/create-object-dialog.scss b/src/assets/stylesheets/create-object-dialog.scss
index 4f612a082..497a5f783 100644
--- a/src/assets/stylesheets/create-object-dialog.scss
+++ b/src/assets/stylesheets/create-object-dialog.scss
@@ -35,28 +35,27 @@
}
:local(.cancel-icon) {
- color: white;
+ color: $darkest-grey;
&:hover {
color: #FF3D7F
}
}
:local(.upload-icon) {
- color: white;
+ color: $darkest-grey;
&:hover {
- color: #2F80ED;
+ color: $action-color;
}
}
:local(.input-border) {
display: flex;
- border: 0.25em solid white;
- border-radius: 1em;
+ @extend %rounded-border;
+ @extend %default-font;
margin: 1em;
padding: 0.5em 0.75em;
width: 100%;
box-sizing: border-box;
- @extend %default-font;
}
:local(.left-side-of-input) {
diff --git a/src/assets/stylesheets/entry.scss b/src/assets/stylesheets/entry.scss
index b2b3235b9..5680a01ed 100644
--- a/src/assets/stylesheets/entry.scss
+++ b/src/assets/stylesheets/entry.scss
@@ -42,6 +42,7 @@
border-radius: 12px;
margin: 6px;
padding: 12px 18px;
+ height: auto;
:local(.icon) {
height: 40px;
diff --git a/src/assets/stylesheets/index.scss b/src/assets/stylesheets/index.scss
index 6c0f85eff..904a2075e 100644
--- a/src/assets/stylesheets/index.scss
+++ b/src/assets/stylesheets/index.scss
@@ -182,7 +182,7 @@ body {
justify-content: center;
a {
- margin-top: 12px;
+ margin-top: 8px;
@extend %action-button;
}
}
diff --git a/src/assets/stylesheets/invite-dialog.scss b/src/assets/stylesheets/invite-dialog.scss
index 65f264d52..251c3d8f5 100644
--- a/src/assets/stylesheets/invite-dialog.scss
+++ b/src/assets/stylesheets/invite-dialog.scss
@@ -1,7 +1,7 @@
@import 'shared.scss';
:local(.dialog) {
- background-color: $action-color;
+ background-color: $action-color-transparent;
border-radius: 12px;
box-shadow: 0px 5px 30px 1px #333;
display: flex;
diff --git a/src/assets/stylesheets/shared.scss b/src/assets/stylesheets/shared.scss
index aff946907..72ad6c37e 100644
--- a/src/assets/stylesheets/shared.scss
+++ b/src/assets/stylesheets/shared.scss
@@ -11,6 +11,7 @@ $dark-grey: rgba(128, 128, 128, 1.0);
$darker-grey: rgba(64, 64, 64, 1.0);
$darkest-grey: rgba(32, 32, 32, 1.0);
$action-color: #FF3464;
+$action-color-transparent: rgba(255, 52, 100, 0.9);
%unselectable {
-moz-user-select: none;
@@ -94,7 +95,7 @@ $action-color: #FF3464;
cursor: pointer;
border: 0;
border-radius: 28px;
- padding: 18px 18px;
+ padding: 0px 18px;
background: #FF3464;
font-size: 1em;
@@ -104,7 +105,7 @@ $action-color: #FF3464;
flex-direction: column;
justify-content: center;
min-width: 150px;
- min-height: 54px;
+ height: 48px;
}
%action-button-selected {
@@ -115,7 +116,6 @@ $action-color: #FF3464;
%bottom-action-button {
@extend %bottom-button;
background: #FF3464;
- font-size: 1.3em;
}
%top-title {
diff --git a/src/assets/stylesheets/ui-root.scss b/src/assets/stylesheets/ui-root.scss
index 410fd51bf..e21d8ee1f 100644
--- a/src/assets/stylesheets/ui-root.scss
+++ b/src/assets/stylesheets/ui-root.scss
@@ -78,8 +78,6 @@
button {
@extend %action-button;
pointer-events: auto;
- padding: 16px 28px;
- height: 58px;
}
@media (max-height: 420px) {
diff --git a/src/assets/translations.data.json b/src/assets/translations.data.json
index 420349dd7..27b8371d0 100644
--- a/src/assets/translations.data.json
+++ b/src/assets/translations.data.json
@@ -31,7 +31,7 @@
"entry.invite-team-nag": "Invite a hubs team member",
"entry.enable-screen-sharing": "Share my desktop",
"entry.return-to-vr": "Enter in VR",
- "profile.save": "accept",
+ "profile.save": "Accept",
"profile.display_name.validation_warning": "Alphanumerics and hyphens. At least 3 characters, no more than 32",
"profile.header": "Name & Avatar",
"profile.avatar-selector.loading": "Loading Avatars...",
diff --git a/src/react-components/create-object-dialog.js b/src/react-components/create-object-dialog.js
index 263623032..5ccfe2ce6 100644
--- a/src/react-components/create-object-dialog.js
+++ b/src/react-components/create-object-dialog.js
@@ -126,7 +126,7 @@ export default class CreateObjectDialog extends Component {
</div>
<div className={styles.buttons}>
<button className={styles.actionButton}>
- <span>create</span>
+ <span>Create</span>
</button>
</div>
{this.state.attributionImage ? (
--
GitLab