Make the tabs pane fixed

aws · Sep 13, 2023 · 253acd2 · 253acd2
1 parent 1ac28b6
commit 253acd2
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 25 deletions.
diff --git a/src/html_files/index.css b/src/html_files/index.css
@@ -8,6 +8,17 @@ body {font-family: "Lato", sans-serif;}
   background-color: #f1f1f1;
   width: 10%;
   height: 100%;
+  position: fixed;
+}
+
+.aperf {
+  background-color: white;
+  text-align: center;
+  color: black;
+  padding: 5%;
+  width: 100%;
+  font-size: 27px;
+  display: grid;
 }
 
 /* Style the buttons inside the tab */
@@ -37,32 +48,9 @@ body {font-family: "Lato", sans-serif;}
 
 /* Style the tab content */
 .tabcontent {
-  float: left;
+  float: right;
   padding: 0px 12px;
   border: 1px solid #ccc;
   width: 90%;
   height: 100%;
 }
-
-.collapsible {
-  background-color: #777;
-  color: white;
-  cursor: pointer;
-  padding: 18px;
-  width: 100%;
-  border: none;
-  text-align: left;
-  outline: none;
-  font-size: 15px;
-}
-
-.active, .collapsible:hover {
-  background-color: #555;
-}
-
-.content {
-  float: left;
-  padding: 0 18px;
-  display: none;
-  background-color: #f1f1f1;
-}
diff --git a/src/html_files/index.html b/src/html_files/index.html
@@ -7,8 +7,8 @@
 		<title>APerf</title>
 	</head>
 	<body>
-		<h2>APerf</h2>
 		<div class="tab">
+			<div class="aperf">APerf</div>
 			<button class="tablinks" name="system_info" id="default">SUT Config</button>
 			<button class="tablinks" name="cpu_utilization">CPU Utilization</button>
 			<button class="tablinks" name="flamegraphs">Flamegraphs</button>