mrtoth/frontend-tutorial-framework
1
0
Fork 0
mirror of https://github.com/avatao-content/frontend-tutorial-framework synced 2025-06-28 23:35:12 +00:00
Code Issues Releases Wiki Activity

Polishing button colors and starting to create templates for different layouts

Browse Source
This commit is contained in:
Gabor PEK
2018-03-08 17:07:21 +01:00
parent d11564e58b
commit 5ac380c702
4 changed files with 30 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/app/dashboard/dashboard.component.scss
View File

@ -139,6 +139,16 @@ $tao-gray-900: #000000;
$tao-navbar-height: 67px;
//
// Layouts
//
// Default messages, webide, terminal, web component
@mixin position($col-start, $col-end, $row-start, $row-end) {
grid-column: $col-start / $col-end;
grid-row: $row-start / $row-end;
}
.tao-grid-main-components {
overflow-y: hidden;
@ -154,6 +164,7 @@ $tao-navbar-height: 67px;
.tao-web-component {
padding: $space;
@include position(2, 4, 1, 4);
grid-column: 2 / 4;
grid-row: 1 / 4;
}
@ -161,17 +172,22 @@ $tao-navbar-height: 67px;
.tao-messages-component {
padding: $space;
background-color: $tao-gray-50;
@include position(1, 2, 1, 4);
grid-column: 1 / 2;
grid-row: 1 / 4;
}
.tao-webide-component {
background-color: $tao-plum-900;
@include position(4, -1, 1, -1);
grid-column: 4 / -1;
grid-row: 1 / -1;
}
.tao-terminal-component {
@include position(1, 4, 4, -1);
grid-row: 4 / -1;
grid-column: 1 / 4;
}