mrtoth/frontend-tutorial-framework
1
0
Fork 0
mirror of https://github.com/avatao-content/frontend-tutorial-framework synced 2025-04-03 11:52:40 +00:00
Code Issues Releases Wiki Activity

Fix iframe scrolling and other CSS issues

Browse Source
This commit is contained in:
Kristóf Tóth 2019-08-27 17:02:32 +02:00
parent 208edd9533
commit 00e4c2f7b3
3 changed files with 19 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -66,6 +66,7 @@
.tfw-header { .tfw-header {
padding: $small; padding: $small;
padding-top: $tiny;
background-color: $tao-gray-50; background-color: $tao-gray-50;
} }

34
src/assets/scss/mixins/_layout.scss
View File

@ -2,8 +2,8 @@ $grid-columns-count: 100;
$grid-rows-count: 30; $grid-rows-count: 30;
$terminal-ide-web-layout: ( $terminal-ide-web-layout: (
'header': (0, 20, 0, 4), 'header': (0, 20, 0, 8),
'messages': (0, 20, 4, 60), 'messages': (0, 20, 8, 60),
'ide': (56, 96, 0, 100), 'ide': (56, 96, 0, 100),
'terminal': (0, 56, 60, 100), 'terminal': (0, 56, 60, 100),
'web': (20, 56, 0, 60), 'web': (20, 56, 0, 60),
@ -11,8 +11,8 @@ $terminal-ide-web-layout: (
); );
$terminal-web-layout: ( $terminal-web-layout: (
'header': (0, 20, 0, 4), 'header': (0, 20, 0, 8),
'messages': (0, 20, 2, 100), 'messages': (0, 20, 8, 100),
'ide': (), 'ide': (),
'terminal': (56, 96, 0, 100), 'terminal': (56, 96, 0, 100),
'web': (20, 56, 0, 100), 'web': (20, 56, 0, 100),
@ -20,8 +20,8 @@ $terminal-web-layout: (
); );
$terminal-ide-vertical-layout: ( $terminal-ide-vertical-layout: (
'header': (0, 20, 0, 4), 'header': (0, 20, 0, 8),
'messages': (0, 20, 2, 100), 'messages': (0, 20, 8, 100),
'ide': (56, 96, 0, 100), 'ide': (56, 96, 0, 100),
'terminal': (20, 56, 0, 100), 'terminal': (20, 56, 0, 100),
'web': (), 'web': (),
@ -29,8 +29,8 @@ $terminal-ide-vertical-layout: (
); );
$terminal-ide-horizontal-layout: ( $terminal-ide-horizontal-layout: (
'header': (0, 20, 0, 4), 'header': (0, 20, 0, 8),
'messages': (0, 20, 2, 100), 'messages': (0, 20, 8, 100),
'ide': (20, 96, 0, 60), 'ide': (20, 96, 0, 60),
'terminal': (20, 96, 60, 100), 'terminal': (20, 96, 60, 100),
'web': (), 'web': (),
@ -38,8 +38,8 @@ $terminal-ide-horizontal-layout: (
); );
$ide-web-vertical-layout: ( $ide-web-vertical-layout: (
'header': (0, 20, 0, 4), 'header': (0, 20, 0, 8),
'messages': (0, 20, 4, 100), 'messages': (0, 20, 8, 100),
'ide': (56, 96, 0, 100), 'ide': (56, 96, 0, 100),
'terminal': (), 'terminal': (),
'web': (20, 56, 0, 100), 'web': (20, 56, 0, 100),
@ -47,8 +47,8 @@ $ide-web-vertical-layout: (
); );
$terminal-only-layout: ( $terminal-only-layout: (
'header': (0, 20, 0, 4), 'header': (0, 20, 0, 8),
'messages': (0, 20, 4, 100), 'messages': (0, 20, 8, 100),
'ide': (), 'ide': (),
'terminal': (20, 96, 0, 100), 'terminal': (20, 96, 0, 100),
'web': (), 'web': (),
@ -56,8 +56,8 @@ $terminal-only-layout: (
); );
$ide-only-layout: ( $ide-only-layout: (
'header': (0, 20, 0, 4), 'header': (0, 20, 0, 8),
'messages': (0, 20, 4, 100), 'messages': (0, 20, 8, 100),
'ide': (20, 96, 0, 100), 'ide': (20, 96, 0, 100),
'terminal': (), 'terminal': (),
'web': (), 'web': (),
@ -65,8 +65,8 @@ $ide-only-layout: (
); );
$web-only-layout: ( $web-only-layout: (
'header': (0, 20, 0, 4), 'header': (0, 20, 0, 8),
'messages': (0, 20, 4, 100), 'messages': (0, 20, 8, 100),
'ide': (), 'ide': (),
'terminal': (), 'terminal': (),
'web': (20, 96, 0, 100), 'web': (20, 96, 0, 100),
@ -142,7 +142,7 @@ $layouts: (
@if (length($tfw-component) > 0) { @if (length($tfw-component) > 0) {
$columns-count: convert-ratio(nth($tfw-component,2), $grid-columns-count) - convert-ratio(nth($tfw-component,1), $grid-columns-count); $columns-count: convert-ratio(nth($tfw-component,2), $grid-columns-count) - convert-ratio(nth($tfw-component,1), $grid-columns-count);
$rows-count: convert-ratio(nth($tfw-component,4), $grid-columns-count) - convert-ratio(nth($tfw-component,3), $grid-columns-count); $rows-count: convert-ratio(nth($tfw-component,4), $grid-rows-count) - convert-ratio(nth($tfw-component,3), $grid-rows-count);
min-width: #{$columns-count / $grid-columns-count * 100}vw; min-width: #{$columns-count / $grid-columns-count * 100}vw;
min-height: #{$rows-count / $grid-rows-count * 100}vh; min-height: #{$rows-count / $grid-rows-count * 100}vh;

1
src/assets/scss/mixins/_scrollbar.scss
View File

@ -1,6 +1,7 @@
@mixin set-scrollbar-style($style, $selctor) { @mixin set-scrollbar-style($style, $selctor) {
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 3px !important; width: 3px !important;
height: 3px !important;
} }
#{$selctor}::-webkit-scrollbar-track { #{$selctor}::-webkit-scrollbar-track {