fix remaining px borders

This commit is contained in:
ntr 2019-11-24 23:08:35 +11:00
parent 8b7003fb32
commit 4df4f3a785
6 changed files with 102 additions and 105 deletions

View File

@ -44,7 +44,7 @@
}
&[disabled] {
border: 1px solid @yellow;
border: 0.1em solid @yellow;
color: @yellow;
background: black;
}

View File

@ -150,13 +150,13 @@ aside {
&:hover {
color: @red;
border-color: @red;
border: 2px solid @red;
border: 0.1em solid @red;
};
&:active, &.confirming {
background: @red;
color: black;
border: 2px solid @red;
border: 0.1em solid @red;
}
}
@ -164,7 +164,7 @@ aside {
&:active, &.confirming {
background: @gray-hover;
color: black;
border: 2px solid @gray-hover;
border: 0.1em solid @gray-hover;
}
}

View File

@ -40,7 +40,7 @@
"stats ";
/*padding: 0.5em;*/
border: 2px solid #222;
border: 0.1em solid #222;
border-left-width: 0;
&:first-child {
margin-left: 0;

View File

@ -74,7 +74,7 @@
button {
flex: 1;
border-top: 0;
border: 2px solid #222;
border: 0.1em solid #222;
&:not(:last-child) {
border-right: 0;
}

View File

@ -20,99 +20,10 @@
}
}
.info {
display: none;
.combos {
display: none;
}
}
svg {
stroke-width: 1.25em;
}
.vbox {
grid-template-rows: min-content min-content 1fr;
grid-template-columns: min-content 1fr min-content 1fr;
grid-template-areas:
"store-hdr store-hdr stash-hdr stash-hdr"
"store store stash stash"
"store store combiner combiner";
> div {
padding: 0.25em;
}
.info {
display: none;
}
.combos {
display: none;
}
.combiner {
margin: 0;
}
.stash {
border: 0;
border-top: 0.1em solid @gray;
border-right: 0.1em solid @gray;
border-bottom: 0.1em solid @gray;
}
.stash-hdr {
border: 0;
border-left: 0.1em solid @gray;
border-right: 0.1em solid @gray;
display: grid;
grid-template-rows: min-content min-content;
grid-template-columns: 1fr 1fr;
h3 {
margin: 0;
}
}
.store {
border: 0;
border-top: 0.1em solid @gray;
border-bottom: 0.1em solid @gray;
border-right: 0.1em solid @gray;
}
.store-hdr {
display: grid;
grid-template-columns: min-content min-content 1fr;
> * {
margin-right: 1em;
}
grid-template-areas:
"hdr bits btn";
h1 {
grid-area: hdr;
margin-bottom: 0.25em;
}
.bits {
grid-area: bits;
}
button {
grid-area: btn;
}
}
.store-hdr, .stash-hdr {
button {
margin: 0;
}
}
}
}
.game {
@ -286,7 +197,7 @@
grid-template-columns: repeat(2, 1fr);
button:not(:last-child) {
border: 2px solid #222;
border: 0.1em solid #222;
}
button.logo {
@ -324,4 +235,90 @@
grid-template-columns: 1fr;
}
}
}
}
@media (max-width: 600px) {
.vbox {
grid-template-rows: min-content min-content 1fr;
grid-template-columns: min-content 1fr min-content 1fr;
grid-template-areas:
"store-hdr store-hdr stash-hdr stash-hdr"
"store store stash stash"
"store store combiner combiner";
> div {
padding: 0.25em;
}
.info {
display: none;
}
.combos {
display: none;
}
.combiner {
margin: 0;
}
.stash {
border: 0;
border-top: 0.1em solid @gray;
border-right: 0.1em solid @gray;
border-bottom: 0.1em solid @gray;
}
.stash-hdr {
border: 0;
border-left: 0.1em solid @gray;
border-right: 0.1em solid @gray;
display: grid;
grid-template-rows: min-content min-content;
grid-template-columns: 1fr 1fr;
h3 {
margin: 0;
}
}
.store {
border: 0;
border-top: 0.1em solid @gray;
border-bottom: 0.1em solid @gray;
border-right: 0.1em solid @gray;
}
.store-hdr {
display: grid;
grid-template-columns: min-content min-content 1fr;
> * {
margin-right: 1em;
}
grid-template-areas:
"hdr bits btn";
h1 {
grid-area: hdr;
margin-bottom: 0.25em;
}
.bits {
grid-area: bits;
}
button {
grid-area: btn;
}
}
.store-hdr, .stash-hdr {
button {
margin: 0;
}
}
}
}

View File

@ -116,7 +116,7 @@
&, &:hover, &:active {
background: @red;
color: black;
border: 2px solid black;
border: 0.1em solid black;
}
}
svg {
@ -207,9 +207,9 @@
line-height: 1.3;
font-size: 1.25em;
letter-spacing: 0.1em;
border: 2px solid @gray-exists;
border: 0.1em solid @gray-exists;
&:hover {
border: 2px solid @gray-hover;
border: 0.1em solid @gray-hover;
}
}
@ -273,8 +273,8 @@
}
.item {
border-top: 2px solid #222;
border-bottom: 2px solid #222;
border-top: 0.1em solid #222;
border-bottom: 0.1em solid #222;
flex: 1;
grid-area: item;
font-weight: bold;
@ -285,15 +285,15 @@
div {
border-left: 2px solid #222;
border-right: 2px solid #222;
border-left: 0.1em solid #222;
border-right: 0.1em solid #222;
height: 1.75em;
width: 7.5em;
svg {
vertical-align: middle;
}
&:last-child {
border-bottom: 2px solid #222;
border-bottom: 0.1em solid #222;
}
}
}