ice-frontend-react-mobx
Version:
ICE Frontend REACT+MobX
73 lines (70 loc) • 1.45 kB
CSS
[data-react-toolbox='tabs'] section:focus {
outline: none;
}
.rackCard {
background: var(--color-background);
color: var(--color-text);
.tabs {
.tabContent {
min-height: 15rem;
}
}
.cardTitle,
.cardTitle * {
color: var(--color-text);
padding: 0.5rem 0.5rem 1rem;
}
.collapseWrapper {
margin-top: -4.5rem;
.powerStatWrapper {
padding: 0 1rem 0.5rem;
}
}
.rackPowerStats {
display: flex;
margin-top: 1rem;
justify-content: space-between;
}
.dataColumns {
display: flex;
justify-content: space-between;
text-align: center;
.redundancyData,
.devices {
margin-top: 2rem;
> * {
margin: 1rem 0;
}
> *:first-child {
margin-top: 0.5rem;
}
.rpdus,
.iceblocks,
.iceswitches {
display: flex;
justify-content: space-between;
.device {
display: inline-flex;
> * {
align-self: flex-start;
}
}
}
}
.redundancy { width: 30%; }
.devices { width: 60%; }
}
.avatar {
height: 3rem;
width: 3rem;
font-size: 2rem;
* { line-height: 3rem; }
}
.powerAvatar {
@extend .avatar;
color: var(--color-background);
&.active { background-color: var(--color-success); }
&.warning { background-color: var(--color-success); }
&.error { background-color: var(--color-success); }
}
}