103 lines
1.2 KiB
Plaintext
103 lines
1.2 KiB
Plaintext
/* Grid system responsive code is in general.less */
|
|
|
|
.col, .row {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: stretch;
|
|
align-items: stretch;
|
|
flex-wrap: wrap;
|
|
gap: 1rem;
|
|
}
|
|
|
|
|
|
.row > * { flex: 1; max-height: 100%; }
|
|
.col > * { flex: 0; max-width: 100%; }
|
|
.col {
|
|
flex-direction: column;
|
|
}
|
|
.col > .row { padding: 0 1rem; }
|
|
.row > .col { padding: 1rem 0; }
|
|
.start {
|
|
justify-content: flex-start;
|
|
align-items: flex-start;
|
|
}
|
|
.middle { justify-content: center; align-item: center; }
|
|
|
|
.gapless { gap: 0; }
|
|
|
|
.table, .c12 {
|
|
width: 100%;
|
|
flex: 12;
|
|
}
|
|
|
|
.c11 {
|
|
flex: 11;
|
|
width: 91.66%;
|
|
}
|
|
|
|
.c10 {
|
|
flex: 10;
|
|
width: 83.33%;
|
|
}
|
|
|
|
.c9 {
|
|
flex: 9;
|
|
width: 75%;
|
|
}
|
|
|
|
.c8 {
|
|
flex: 8;
|
|
width: 66.66%;
|
|
}
|
|
|
|
.c7 {
|
|
flex: 7;
|
|
width: 58.33%;
|
|
}
|
|
|
|
.c6 {
|
|
flex: 6;
|
|
width: 50%;
|
|
}
|
|
|
|
.c5 {
|
|
flex: 5;
|
|
width: 41.66%
|
|
}
|
|
|
|
.c4 {
|
|
flex: 4;
|
|
width: 33.33%;
|
|
}
|
|
|
|
.c3 {
|
|
flex: 3;
|
|
width: 25%;
|
|
}
|
|
|
|
.c2 {
|
|
flex: 2;
|
|
width: 16.66%;
|
|
}
|
|
|
|
.c1 {
|
|
flex: 1;
|
|
width: 8.33%;
|
|
}
|
|
|
|
/* For smaller screens, change all columns to 100% width */
|
|
@media (max-width:960px) {
|
|
.row > * {
|
|
flex: 0 1 100%;
|
|
width: 100%;
|
|
}
|
|
.no-mobile {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.no-grow { flex: 0; }
|
|
.fixed { flex-grow: 0;
|
|
flex-shrink: 0;
|
|
}
|