70 lines
1 KiB
CSS
70 lines
1 KiB
CSS
@import "tailwindcss/base";
|
|
@import "tailwindcss/components";
|
|
@import "tailwindcss/utilities";
|
|
|
|
/* This file is for your main application CSS */
|
|
|
|
h1 {
|
|
font-size: 2rem;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 1.5rem;
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
#cpus, #mems, #disks {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
gap: 10px;
|
|
margin-top: 2rem;
|
|
}
|
|
|
|
#cpus {
|
|
margin-top: 0;
|
|
}
|
|
|
|
#cpus h2, #mems h2, #disks h2 {
|
|
grid-column: 1 / 3;
|
|
}
|
|
|
|
.progress {
|
|
display: grid;
|
|
grid-template: 'label current' auto
|
|
'vals vals' 1fr;
|
|
height: 75px;
|
|
gap: 5px;
|
|
}
|
|
|
|
.progress-current {
|
|
grid-area: current;
|
|
text-align: right;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.progress label {
|
|
grid-area: label;
|
|
margin-right: 10px;
|
|
overflow-x: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.progress-current, .progress label {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.progress-vals {
|
|
grid-area: vals;
|
|
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: flex-end;
|
|
justify-content: flex-start;
|
|
overflow: hidden;
|
|
height: 100%;
|
|
}
|
|
|
|
.progress-val {
|
|
flex: 1 1 1px;
|
|
background-color: darkseagreen;
|
|
}
|