chore: fix full screen styling of Trading Platform example

ghiscoding · Dec 3, 2022 · 4f08034 · 4f08034
1 parent 021da1d
commit 4f08034
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 62 deletions.
diff --git a/src/examples/slickgrid/example34.tsx b/src/examples/slickgrid/example34.tsx
@@ -427,14 +427,14 @@ export default class Example34 extends React.Component<Props, State> {
               </div>
             </div>
           </div>
-        </div>
 
-        <ReactSlickgridComponent gridId="grid34"
-          columnDefinitions={this.state.columnDefinitions}
-          gridOptions={this.state.gridOptions}
-          dataset={this.state.dataset}
-          onReactGridCreated={$event => this.reactGridReady($event.detail)}
-        />
+          <ReactSlickgridComponent gridId="grid34"
+            columnDefinitions={this.state.columnDefinitions}
+            gridOptions={this.state.gridOptions}
+            dataset={this.state.dataset}
+            onReactGridCreated={$event => this.reactGridReady($event.detail)}
+          />
+        </div>
       </div>
     );
   }

diff --git a/src/styles.scss b/src/styles.scss
@@ -1,72 +1,30 @@
-/* make sure to add the @import the SlickGrid Bootstrap Theme AFTER the variables changes */
-// @import '@slickgrid-universal/common/dist/styles/sass/slickgrid-theme-bootstrap.scss';
-
-.btn-group-xs > .btn, .btn-xs {
-  padding  : 6px 2px;
-  line-height  : .5;
-  border-radius : .2rem;
-  margin: 0 2px;
-  font-size: 12px;
-}
-
 $navbar-height: 56px;
 $side-menu-width: 250px;
 
-body {
-  margin: 0;
-}
-.bold {
-  font-weight: bold;
-}
-.italic {
-  font-style: italic;
-}
-.faded {
-  opacity: 0.2;
-}
-.faded:hover {
-  opacity: 0.5;
-}
-.btn {
-  padding: 5px;
-}
-.page-host {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 50px;
-  bottom: 0;
-  overflow-x: hidden;
-  overflow-y: auto;
+.body-content {
+  margin-top: $navbar-height;
 }
-
 .lightblue {
   color: lightblue;
 }
 .red {
   color: red;
 }
-.subtitle {
-  font-size: 15px;
-  font-style: italic;
-  color: grey;
-  margin-bottom: 10px;
-}
-
 .faded {
-  opacity: 0.2;
+    opacity: 0.2;
 }
 .faded:hover {
-  opacity: 0.5;
+    opacity: 0.5;
 }
-.btn:focus, .btn:active:focus, .btn.active:focus {
-outline: 0 none;
+
+section {
+  margin: 0;
 }
 
 /** Sidebar (left) and Content (right) */
 @media (min-width: 1200px) {
   .panel-wm-content .container {
-      width: calc(1170px - $side-menu-width);
+      width: calc(1170px - #{$side-menu-width});
   }
 }
 
@@ -105,8 +63,3 @@ outline: 0 none;
     width: $side-menu-width;
   }
 }
-.github-button-container {
-  position: relative;
-  top: 6px;
-  margin: 0 5px;
-}