layout fixes ...

cms/static/css/menu.css

@@ -1,3 +1,8 @@
+/**
+* This file implements styling for menus i.e we have 
+*   1. Traditional menus and 
+*   2. Tabbed menus
+*/
 .menu {
     padding:8px;
     border:1px solid #CAD5E0 ;
@@ -44,4 +49,33 @@
     
     display:block;
     height:auto;    
+}
+
+/**
+* This section shows how we use css to implement tabs i.e we will be using radio boxes and labels
+*
+*/
+.tabs {display:grid; grid-template-columns: repeat(auto-fit,209px); gap:0px; align-content:center; 
+    /* background-color: #f3f3f3; */
+    padding-top:4px;
+    padding-left:4px;
+    padding-right:4px;
+}
+.tabs input[type=radio] {display:none; }
+.tabs input[type=radio] + label { font-weight:lighter;  
+    border:1px solid transparent;
+    border-bottom-color: #CAD5E0;
+    background-color: #f3f3f3;
+    padding:8px;
+    padding-right:10px; padding-left:10px;
+    
+    cursor:pointer
+}
+.tabs input[type=radio]:checked +label {
+    background-color: #ffffff;
+    border-top-right-radius: 8px; 
+    border-top-left-radius: 8px;
+    font-weight:bold;
+    border-color: #CAD5E0;
+    border-bottom-color: #FFFFFF;
 }

cms/static/css/search.css

@@ -2,6 +2,13 @@
 /**
 * components: search
 */
+
+/* .search-box {
+    display:grid;
+    grid-template-columns: auto 64px; gap:4px;
+    
+} */
+
 .search .frame .suggestion-frame {
     width:98%;
     overflow: hidden;