Merge pull request #66 from ArthurLobopro/use-flex-on-tabs

Use flex on tabs

Author: eltonfabricio10

biglinux-webapps/usr/share/bigbashview/bcc/apps/biglinux-webapps/css/style.css

@@ -952,7 +952,6 @@ input {
 /* USER (FORM WRAPPER) */
 .form-wrap {
   position: relative;
-  margin-top: 53px;
   width: 100%;
   color: #fff;
   height: -webkit-fill-available;
@@ -995,7 +994,7 @@ input {
   padding: 0 1em;
   background: var(--theme-bg-color);
   border-radius: 15px;
-  min-height: 100%;
+  min-height: -webkit-fill-available;
 }
 
 .help-action {
@@ -1403,9 +1402,6 @@ li img {
 /* breakpoints */
 /* selectors relative to radio inputs */
 .tabs {
-    left: 50%;
-    transform: translateX(-50%);
-    position: fixed;
     border-radius: 5px 5px 0 0;
     min-width: 100%;
     background-color: var(--tabs-bg-color);
@@ -2152,3 +2148,16 @@ hr {
 #backup-li, #restore-li, #add-li{
   border-bottom: 2px solid var(--border-color);
 }
+
+
+
+#content{
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
+
+#content .overflow-wrapper{
+  overflow-y: auto;
+  height: 100%;
+}

biglinux-webapps/usr/share/bigbashview/bcc/apps/biglinux-webapps/index.sh.htm

@@ -54,7 +54,7 @@
         <div class="logo">
           <img src="icons/logo-big-trans-branco.png" alt="logo" class="logo-biglinux"/>
         </div>
-        <div class="user">
+        <div class="user" id="content">
           <!-- TABS -->
           <div class="tabs">
             <input type="radio" id="tab1" name="tab-control"/>
@@ -90,7 +90,8 @@
               <div class="indicator"></div>
             </div>
           </div>
-          <div class="form-wrap">
+          <div class="overflow-wrapper">
+            <div class="form-wrap">
 
               <!-- TABS CONTENT -->
             <div class="tabs-content">
@@ -1131,6 +1132,7 @@
 
             </div>
           </div>
+          </div>
         </div>
       </div>
     </div>