mirror of
				https://github.com/avatao-content/frontend-tutorial-framework
				synced 2025-11-04 05:52:56 +00:00 
			
		
		
		
	Merge pull request #22 from avatao-content/layout-fix
Fix breaking layout for web component
This commit is contained in:
		@@ -22,6 +22,26 @@
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@mixin set-scrollbar-style() {
 | 
			
		||||
 | 
			
		||||
  ::-webkit-scrollbar-track
 | 
			
		||||
  {
 | 
			
		||||
    background-color: #F5F5F5;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  ::-webkit-scrollbar
 | 
			
		||||
  {
 | 
			
		||||
    width: 4px;
 | 
			
		||||
    background-color: #F5F5F5;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  ::-webkit-scrollbar-thumb
 | 
			
		||||
  {
 | 
			
		||||
    background-color: gray;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.tfw-grid-main-components {
 | 
			
		||||
  display: grid;
 | 
			
		||||
  width: 100vw;
 | 
			
		||||
@@ -58,10 +78,14 @@
 | 
			
		||||
    div[class="terminal-ide-web"] & {
 | 
			
		||||
      max-height: 55vmin;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    @include set-scrollbar-style();
 | 
			
		||||
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .tfw-ide {
 | 
			
		||||
    background-color: $tao-plum-900;
 | 
			
		||||
    @include set-scrollbar-style();
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  .tfw-sidebar {
 | 
			
		||||
@@ -78,6 +102,8 @@
 | 
			
		||||
  .tfw-terminal {
 | 
			
		||||
    overflow-y: hidden;
 | 
			
		||||
    background-color: $tao-gray-800;
 | 
			
		||||
    @include set-scrollbar-style();
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
    div[class*="web"] & {
 | 
			
		||||
      border-top: 1px solid $tao-plum-100;
 | 
			
		||||
 
 | 
			
		||||
@@ -18,7 +18,7 @@ $terminal-web-layout: (
 | 
			
		||||
  'messages': (1, 6, 2, $grid-columns-count+1),
 | 
			
		||||
  'ide': (),
 | 
			
		||||
  'terminal': (15, $grid-columns-count, 1, $grid-rows-count+1),
 | 
			
		||||
  'web': (6, 15, 1, 10),
 | 
			
		||||
  'web': (6, 15, 1, $grid-rows-count+1),
 | 
			
		||||
  'sidebar': ($grid-columns-count,$grid-columns-count+1, 1,$grid-rows-count+1)
 | 
			
		||||
);
 | 
			
		||||
 | 
			
		||||
@@ -45,7 +45,7 @@ $ide-web-vertical-layout: (
 | 
			
		||||
  'messages': (1, 6, 2, $grid-rows-count+1),
 | 
			
		||||
  'ide': (15, $grid-columns-count, 1,$grid-rows-count+1),
 | 
			
		||||
  'terminal': (),
 | 
			
		||||
  'web': (6, 15, 10, $grid-rows-count+1),
 | 
			
		||||
  'web': (6, 15, 1, $grid-rows-count+1),
 | 
			
		||||
  'sidebar': ($grid-columns-count,$grid-columns-count+1, 1,$grid-rows-count+1)
 | 
			
		||||
);
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user