This commit is contained in:
ntr 2019-05-16 19:25:44 +10:00
parent 0ab3e6589e
commit 0a44f7b950
3 changed files with 27 additions and 16 deletions

View File

@ -14,11 +14,22 @@
"cryps cryps info"; "cryps cryps info";
} }
@media (max-width: 1920px) {
.instance {
grid-template-columns: 2fr 2fr 1fr;
}
.instance .info table td svg {
height: 50%;
}
}
.instance .top { .instance .top {
grid-area: top; grid-area: top;
} }
.instance .info { .instance .info {
font-size: 75%;
margin-left: 1em; margin-left: 1em;
grid-area: info; grid-area: info;
display: flex; display: flex;
@ -61,14 +72,19 @@
.vbox-btn:active, .vbox-btn:hover, .vbox-btn:focus { .vbox-btn:active, .vbox-btn:hover, .vbox-btn:focus {
color: black; color: white;
} }
.vbox-btn.reclaiming, .vbox-btn.reclaiming:hover { .vbox-btn.reclaiming, .vbox-btn.reclaim.reclaiming:hover {
color: #a52a2a; background: #a52a2a;
color: black;
box-shadow: inset 0.5em 0 0 0 #a52a2a; box-shadow: inset 0.5em 0 0 0 #a52a2a;
} }
.vbox-btn.reclaim:hover {
color: #a52a2a;
}
.vbox-hdr { .vbox-hdr {
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;
@ -88,17 +104,12 @@
.vbox button { .vbox button {
width: 100%; width: 100%;
margin: 0; margin: 0;
background-color: #444; background-color: #333;
color: black;
border-width: 0; border-width: 0;
} }
.vbox-btn:hover {
color: black;
}
.vbox-table td { .vbox-table td {
transition-property: all; transition-property: color background border;
transition-duration: 0.5s; transition-duration: 0.5s;
transition-delay: 0; transition-delay: 0;
transition-timing-function: ease; transition-timing-function: ease;
@ -106,8 +117,7 @@
} }
.vbox-table table td:active { .vbox-table table td:active {
background-color: #444; background-color: #333;
color: black;
} }
/* CRYP LIST */ /* CRYP LIST */
@ -143,6 +153,7 @@
.instance-cryp .name { .instance-cryp .name {
grid-area: name; grid-area: name;
margin-bottom: 0.5em;
} }
.instance-cryp .avatar { .instance-cryp .avatar {

View File

@ -212,7 +212,7 @@ function Vbox(args) {
} }
const classes = `vbox ${vboxHidden ? 'hidden' : ''}`; const classes = `vbox ${vboxHidden ? 'hidden' : ''}`;
const reclaimClass = `instance-btn instance-ui-btn vbox-btn ${reclaiming ? 'reclaiming' : ''}`; const reclaimClass = `instance-btn instance-ui-btn vbox-btn reclaim ${reclaiming ? 'reclaiming' : ''}`;
return ( return (
<div className={classes}> <div className={classes}>

View File

@ -58,7 +58,7 @@ figure {
main { main {
padding: 0 2em; padding: 0 2em;
display: grid; display: grid;
grid-template-columns: 200px 1fr; grid-template-columns: 1fr 8fr;
grid-template-rows: min-content 1fr; grid-template-rows: min-content 1fr;
grid-template-areas: grid-template-areas:
"hd hd" "hd hd"
@ -194,8 +194,8 @@ table td svg {
} }
table .highlight { table .highlight {
background: whitesmoke; background: #333;
color: black; color: whitesmoke;
font-weight: bold; font-weight: bold;
} }