aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--app/style.js27
1 files changed, 10 insertions, 17 deletions
diff --git a/app/style.js b/app/style.js
index 5e84f5c..a20510e 100644
--- a/app/style.js
+++ b/app/style.js
@@ -79,21 +79,10 @@ label {
.hexagon {
position: absolute;
- width: ${rem(sizeA)};
- height: ${rem(sizeB)};
-}
-
-.col-major .hexagon {
- width: ${rem(sizeB)};
- height: ${rem(sizeA)};
-}
-
-.hexagon > .inner {
- margin: auto;
width: ${rem(longSize * 1.4)};
height: ${rem(longSize * 1.4)};
- padding: ${rem(longSize * 0.4)};
border-radius: ${rem(longSize)};
+
box-sizing: border-box;
font-size: ${rem(longSize * 0.5)};
text-align: center;
@@ -102,24 +91,28 @@ label {
color: #eeeeee;
cursor: pointer;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
transition: background 300ms, border 300ms;
}
-.hexagon.disabled > .inner {
+.hexagon.disabled {
background: #363636 !important;
border-color: #363636;
color: #848484;
}
-.hexagon.core> .inner {
+.hexagon.core > .inner {
border-color: #eeeeee;
}
-.hexagon > .inner:hover {
+.hexagon:hover {
background: #848484;
border-color: #848484;
}
-.hexagon > .inner:active,
-.hexagon.active > .inner {
+.hexagon:active,
+.hexagon.active {
background: #eeeeee;
border-color: #eeeeee;
color: #696969;