Changeset 65087 in vbox

Timestamp:

Jan 3, 2017 8:09:37 PM (8 years ago)

Author:

vboxsync

Message:

TestManager: Layout fun (pain).

Location:

trunk/src/VBox/ValidationKit/testmanager

Files:

• htdocs/css/common.css (modified) (6 diffs)
• webui/template.html (modified) (1 diff)

trunk/src/VBox/ValidationKit/testmanager/htdocs/css/common.css

@@ -177 +177 @@
 }
 
-#side-menu {
+#side-menu-wrap {
     position:       fixed;
-    width:          116px;
-    height:         auto;
-    top:            46px;
+    top:            0px;
     left:           0;
     right:          auto;
-    bottom:         0;
+    bottom:         auto;
+
+    width:          164px;
+    height:         100vh;
+    min-height:     100vh;
+    max-height:     100vh;
+
+    display:        flex;
+}
+
+#side-menu {
+    margin-top:     46px;
+    height:         auto;
+    max-height:     100%;
+    width:          156px;
+
+    display:            flex;
+    flex-direction:     column;
+    justify-content:    space-between;
+}
+
+#side-menu-body {
+    display:        block;
+    max-height:     100%;
+    overflow:       auto;
 }
 
@@ -190 +212 @@
     height:         100%;
     margin-top:     74px;  /**< header + top-menu + padding. */
-    margin-left:    124px;
-/*    overflow:       auto;*/
+    margin-left:    164px;
     padding-left:   2px;
     padding-right:  2px;
@@ -283 +304 @@
 }
 
+/* Webkit: Pretty scroll bars on the menu body as well as inside filter criteria. */
+#side-menu ::-webkit-scrollbar {
+    width:                  8px;
+}
+#side-menu ::-webkit-scrollbar-track {
+    -webkit-box-shadow:     inset 0 0 3px rgba(0, 0, 0, 0.3);
+    -webkit-border-radius:  4px;
+    border-radius:          4px;
+}
+#side-menu ::-webkit-scrollbar-thumb {
+    -webkit-box-shadow:     inset 0 0 3px rgba(0, 0, 0, 0.5);
+    -webkit-border-radius:  4px;
+    border-radius:          4px;
+    background:             rgba(112, 128, 144, 0.9);
+}
+#side-menu ::-webkit-scrollbar-thumb:window-inactive {
+    background:             rgba(112, 128, 144, 0.7);
+}
+
 
 /* Filters: */
@@ -330 +370 @@
 }
 
-/* Filters: webkit specific scroll bar optimizations  */
-#side-filters ::-webkit-scrollbar {
-    width:                  8px;
-}
-#side-filters ::-webkit-scrollbar-track {
-    -webkit-box-shadow:     inset 0 0 3px rgba(0, 0, 0, 0.3);
-    -webkit-border-radius:  4px;
-    border-radius:          4px;
-}
-#side-filters ::-webkit-scrollbar-thumb {
-    -webkit-box-shadow:     inset 0 0 3px rgba(0, 0, 0, 0.5);
-    -webkit-border-radius:  4px;
-    border-radius:          4px;
-    background:             rgba(112, 128, 144, 0.9);
-}
-#side-filters ::-webkit-scrollbar-thumb:window-inactive {
-    background:             rgba(112, 128, 144, 0.7);
-}
-
 /* Footer: */
 #side-footer {
-    position:       absolute;
-    top:            auto;
-    bottom:         0;
-    left:           auto;
-    right:          auto;
-
-    width:          107px;
+    width:          100%;
     margin-left:    2px;
     margin-right:   2px;
+    margin-top:     1em;
     padding-top:    1em;
     padding-bottom: 0.8em;
@@ -368 +384 @@
     margin-left:    3px;
     margin-right:   3px;
-    font-family:    "Lucida Sans Unicode", "Lucida Grande", sans-serif;
-    font-size:      8px;
+    margin-bottom:  0.5em;
+    font-size:      0.86em;
+    line-height:    1.2em;
     font-style:     normal;
     text-align:     center;
@@ -963 +980 @@
 }
 
-

trunk/src/VBox/ValidationKit/testmanager/webui/template.html

@@ -34 +34 @@
             </div>
 
-            <div id="side-menu">
-                <form id="side-menu-form"@@SIDE_MENU_FORM_ATTRS@@>
-                    <ul>
-                        @@SIDE_MENU_ITEMS@@
-                    </ul>
-                    @@SIDE_FILTER_CONTROL@@
-                </form>
-                <div id="side-footer">
-                    <p>
-                    VBox Test Manager<br/>@@TESTMANAGER_VERSION@@r@@TESTMANAGER_REVISION@@
-                    </p>
-                    <br>
-                    <p>Copyright &copy; 2012-2017 Oracle Corporation</p>
+            <div id="side-menu-wrap">
+                <div id="side-menu">
+                    <div id="side-menu-body">
+                        <form id="side-menu-form" @@SIDE_MENU_FORM_ATTRS@@>
+                            <ul>
+                                @@SIDE_MENU_ITEMS@@
+                            </ul>
+                            @@SIDE_FILTER_CONTROL@@
+                        </form>
+                    </div>
+                    <!-- justify-content: space-between -->
+                    <div id="side-footer">
+                        <p>
+                        VBox Test Manager<br/>@@TESTMANAGER_VERSION@@r@@TESTMANAGER_REVISION@@
+                        </p>
+                        <p>Copyright &copy; 2012-2017 Oracle Corporation</p>
+                    </div>
                 </div>
             </div>