From ea0ca94e73140d735bd809ea546e0ebc9c5f929d Mon Sep 17 00:00:00 2001
From: Paul Kaplan <pkaplan@media.mit.edu>
Date: Fri, 11 Aug 2017 11:10:40 -0400
Subject: [PATCH] Update sprite info header sizes
---
src/components/forms/input.css | 3 ++-
src/components/sprite-info/sprite-info.css | 18 +++++++-----------
.../stage-selector/stage-selector.css | 2 +-
src/css/units.css | 4 ++--
4 files changed, 12 insertions(+), 15 deletions(-)
diff --git a/src/components/forms/input.css b/src/components/forms/input.css
index 91b42d4cc..bd6959636 100644
--- a/src/components/forms/input.css
+++ b/src/components/forms/input.css
@@ -2,7 +2,8 @@
@import "../../css/colors.css";
.input-form {
- padding: $space 0.75rem;
+ height: 2rem;
+ padding: 0 0.75rem;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 0.625rem;
diff --git a/src/components/sprite-info/sprite-info.css b/src/components/sprite-info/sprite-info.css
index 16803973b..25e96382f 100644
--- a/src/components/sprite-info/sprite-info.css
+++ b/src/components/sprite-info/sprite-info.css
@@ -3,7 +3,7 @@
.sprite-info {
height: $sprite-info-height;
- padding: $space;
+ padding: 0.75rem;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
background-color: white;
color: #575e75;
@@ -17,7 +17,9 @@
justify-content: space-between;
}
-.row-primary { margin-bottom: $space; }
+.row-primary {
+ margin-bottom: 0.5rem;
+}
.label { opacity: 0.8; }
@@ -29,15 +31,9 @@
.icon-wrapper {
display: inline-block;
-
- /*
- content-box is normally the browser's default.
- We're overriding the global, which we set to border-box
- */
- box-sizing: content-box;
- width: 1.0rem;
- height: 1.0rem;
- padding: 0.25rem;
+ width: 2rem;
+ height: 2rem;
+ padding: 0.5rem;
outline: none;
user-select: none;
}
diff --git a/src/components/stage-selector/stage-selector.css b/src/components/stage-selector/stage-selector.css
index cfe255a4f..ef364139a 100644
--- a/src/components/stage-selector/stage-selector.css
+++ b/src/components/stage-selector/stage-selector.css
@@ -1,7 +1,7 @@
@import "../../css/units.css";
@import "../../css/colors.css";
-$header-height: calc(2rem - 2px); /* @todo: half the SpriteInfo area header? */
+$header-height: calc($stage-menu-height - 2px);
.stage-selector {
position: relative; /* for the child element border */
diff --git a/src/css/units.css b/src/css/units.css
index d951e3e1a..3de6174a2 100644
--- a/src/css/units.css
+++ b/src/css/units.css
@@ -3,8 +3,8 @@ $space: 0.5rem;
$sprites-per-row: 5;
$menu-bar-height: 3rem;
-$sprite-info-height: 5.25rem; /* @todo: SpriteInfo isn't explicitly set to this height yet */
-$stage-menu-height: 3rem;
+$sprite-info-height: 6rem;
+$stage-menu-height: 2.75rem;
$library-header-height: 4.375rem;
--
GitLab