Update content-formal-informal.sass with Tab structure CSS

openSUSE · Feb 21, 2024 · 8d9c5dd · 8d9c5dd
1 parent 5ad2db1
commit 8d9c5dd
Showing 1 changed file with 39 additions and 0 deletions.
diff --git a/source-assets/styles2022/sass/custom/content-formal-informal.sass b/source-assets/styles2022/sass/custom/content-formal-informal.sass
@@ -349,3 +349,42 @@ li > p
 
 div.blockquote
   margin: 17px 35px
+
+// CSS for Tab structure
+.tab-structure {
+  display: flex;
+  border: 1px solid #30ba78;
+  flex-direction: column;
+  margin-top: 32px;
+  margin-bottom: 32px;
+
+  .tabs {
+    display: flex;
+    overflow-x: auto;
+    padding: 0;
+    margin: 0;
+    overflow-x: auto;
+
+    .tab {
+      cursor: pointer;
+      list-style: none;
+      padding-top: 8px;
+      padding-bottom: 8px;
+      padding-left: 16px;
+      padding-right: 16px;
+    }
+
+    .active-tab {
+      /* border-bottom: 3px solid #0c322c; */
+      border-bottom: 3px solid #30ba78;
+      color: #0c322c;
+      font-size: bold;
+    }
+  }
+
+  .content-container {
+    background-color: rgb(246, 248, 250);
+    padding: 8px;
+    overflow-x: auto;
+  }
+}