1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-07-24 23:59:47 +02:00

Provide icon rendering framework

This commit is contained in:
Harvey Kandola 2018-12-12 13:35:16 +00:00
parent 6eb68f84e0
commit 02102f9bf3
48 changed files with 851 additions and 546 deletions

View file

@ -0,0 +1,92 @@
$display-break-1: 700px;
$display-break-2: 900px;
$display-break-3: 1200px;
$display-break-4: 1600px;
$display-break-5: 1800px;
%grid-base {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 2fr;
.grid-cell-1 {
grid-column-start: 1;
grid-row-start: 2;
padding: 0;
align-self: self-start;
justify-self: self-start;
}
.grid-cell-2 {
grid-column-start: 1;
grid-row-start: 1;
padding: 0;
align-self: self-start;
justify-self: self-start;
}
// X- axis alignment
.grid-cell-left {
justify-self: self-end;
}
.grid-cell-right {
justify-self: self-end;
}
.grid-cell-center {
justify-self: center;
}
// Y axis alignment
.grid-cell-top {
align-self: self-start;
}
.grid-cell-middle {
align-self: center;
}
.grid-cell-bottom {
align-self: self-end;
}
}
.grid-container-8-2 {
@extend %grid-base;
@media (min-width: $display-break-2) {
grid-template-columns: 8fr 2fr;
grid-template-rows: 1fr;
.grid-cell-1 {
grid-column-start: 1;
grid-row-start: 1;
padding: 0;
}
.grid-cell-2 {
grid-column-start: 2;
grid-row-start: 1;
padding: 0;
}
}
}
.grid-container-6-4 {
@extend %grid-base;
@media (min-width: $display-break-2) {
grid-template-columns: 6fr 4fr;
grid-template-rows: 1fr;
.grid-cell-1 {
grid-column-start: 1;
grid-row-start: 1;
padding: 0;
}
.grid-cell-2 {
grid-column-start: 2;
grid-row-start: 1;
padding: 0;
justify-self: self-end;
}
}
}