fix remaining px borders
This commit is contained in:
parent
8b7003fb32
commit
4df4f3a785
@ -44,7 +44,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
&[disabled] {
|
&[disabled] {
|
||||||
border: 1px solid @yellow;
|
border: 0.1em solid @yellow;
|
||||||
color: @yellow;
|
color: @yellow;
|
||||||
background: black;
|
background: black;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -150,13 +150,13 @@ aside {
|
|||||||
&:hover {
|
&:hover {
|
||||||
color: @red;
|
color: @red;
|
||||||
border-color: @red;
|
border-color: @red;
|
||||||
border: 2px solid @red;
|
border: 0.1em solid @red;
|
||||||
};
|
};
|
||||||
|
|
||||||
&:active, &.confirming {
|
&:active, &.confirming {
|
||||||
background: @red;
|
background: @red;
|
||||||
color: black;
|
color: black;
|
||||||
border: 2px solid @red;
|
border: 0.1em solid @red;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -164,7 +164,7 @@ aside {
|
|||||||
&:active, &.confirming {
|
&:active, &.confirming {
|
||||||
background: @gray-hover;
|
background: @gray-hover;
|
||||||
color: black;
|
color: black;
|
||||||
border: 2px solid @gray-hover;
|
border: 0.1em solid @gray-hover;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -40,7 +40,7 @@
|
|||||||
"stats ";
|
"stats ";
|
||||||
|
|
||||||
/*padding: 0.5em;*/
|
/*padding: 0.5em;*/
|
||||||
border: 2px solid #222;
|
border: 0.1em solid #222;
|
||||||
border-left-width: 0;
|
border-left-width: 0;
|
||||||
&:first-child {
|
&:first-child {
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
|
|||||||
@ -74,7 +74,7 @@
|
|||||||
button {
|
button {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
border-top: 0;
|
border-top: 0;
|
||||||
border: 2px solid #222;
|
border: 0.1em solid #222;
|
||||||
&:not(:last-child) {
|
&:not(:last-child) {
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -20,99 +20,10 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.info {
|
|
||||||
display: none;
|
|
||||||
.combos {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
svg {
|
svg {
|
||||||
stroke-width: 1.25em;
|
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 {
|
.game {
|
||||||
@ -286,7 +197,7 @@
|
|||||||
grid-template-columns: repeat(2, 1fr);
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
|
||||||
button:not(:last-child) {
|
button:not(:last-child) {
|
||||||
border: 2px solid #222;
|
border: 0.1em solid #222;
|
||||||
}
|
}
|
||||||
|
|
||||||
button.logo {
|
button.logo {
|
||||||
@ -324,4 +235,90 @@
|
|||||||
grid-template-columns: 1fr;
|
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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@ -116,7 +116,7 @@
|
|||||||
&, &:hover, &:active {
|
&, &:hover, &:active {
|
||||||
background: @red;
|
background: @red;
|
||||||
color: black;
|
color: black;
|
||||||
border: 2px solid black;
|
border: 0.1em solid black;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
svg {
|
svg {
|
||||||
@ -207,9 +207,9 @@
|
|||||||
line-height: 1.3;
|
line-height: 1.3;
|
||||||
font-size: 1.25em;
|
font-size: 1.25em;
|
||||||
letter-spacing: 0.1em;
|
letter-spacing: 0.1em;
|
||||||
border: 2px solid @gray-exists;
|
border: 0.1em solid @gray-exists;
|
||||||
&:hover {
|
&:hover {
|
||||||
border: 2px solid @gray-hover;
|
border: 0.1em solid @gray-hover;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -273,8 +273,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.item {
|
.item {
|
||||||
border-top: 2px solid #222;
|
border-top: 0.1em solid #222;
|
||||||
border-bottom: 2px solid #222;
|
border-bottom: 0.1em solid #222;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
grid-area: item;
|
grid-area: item;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
@ -285,15 +285,15 @@
|
|||||||
|
|
||||||
|
|
||||||
div {
|
div {
|
||||||
border-left: 2px solid #222;
|
border-left: 0.1em solid #222;
|
||||||
border-right: 2px solid #222;
|
border-right: 0.1em solid #222;
|
||||||
height: 1.75em;
|
height: 1.75em;
|
||||||
width: 7.5em;
|
width: 7.5em;
|
||||||
svg {
|
svg {
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
&:last-child {
|
&:last-child {
|
||||||
border-bottom: 2px solid #222;
|
border-bottom: 0.1em solid #222;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user