fluent is ok (but use html tabs)

manatlan · Apr 30, 2024 · 56f3224 · 56f3224
1 parent 201a6f9
commit 56f3224
Show file tree

Hide file tree

Showing 3 changed files with 60 additions and 178 deletions.
diff --git a/htagui/fluent/bases.py b/htagui/fluent/bases.py
@@ -23,6 +23,19 @@
     font-family: ubuntu;
 }
 
+                  
+.tab {
+    border:0px;
+    cursor:pointer;
+    margin:2px;
+    background:white;
+    padding:8px;
+    font-family: ubuntu;
+}
+.tab.selected {
+    color:#0075ff;
+    border-bottom: 1px solid #0075ff;
+}
 """),
 ]
 
@@ -213,16 +226,29 @@ def init(self,main_non_used,obj,timeout=1000):
 ######################################################################################
 
 
+# class Tabs(Tag.div):
+#     def init(self,metatag,selected=0):
+#         selTab=None
+#         tabs=[]
+#         for idx,i in enumerate(metatag._tabs):
+#             name = hasattr(i,"name") and i.name or "?(name)?"
+#             tab=Tag.fluent_tab(name, _onclick = metatag.stepevent(select=idx))
+#             tabs.append( tab )
+#             if idx==selected:
+#                 selTab=tab
+
+#         self <= Tag.fluent_tabs( tabs, _activeindicator=True, _activeid=id(selTab))
+#         # self <= f"""<fluent-tab-panel id="{id(selTab)}Panel">"""
+#         # self <= metatag._tabs[selected]
+#         # self <= """</fluent-tab-panel>"""
+#         for idx,i in enumerate(tabs):
+#             self <= f"""<fluent-tab-panel id="{id(i)}Panel" hidden={selected!=idx}>"""
+#             self <= metatag._tabs[idx]
+#             self <= """</fluent-tab-panel>"""
+
 class Tabs(Tag.div):
     def init(self,metatag,selected=0):
-        selTab=None
-        tabs=[]
         for idx,i in enumerate(metatag._tabs):
             name = hasattr(i,"name") and i.name or "?(name)?"
-            tab=Tag.fluent_tab(name, _onclick = metatag.stepevent(select=idx))
-            tabs.append( tab )
-            if idx==selected:
-                selTab=tab
-
-        self <= Tag.fluent_tabs( tabs, _activeindicator=True, _activeid=id(selTab))
-        self <= metatag._tabs[selected]
+            self+=Tag.button(name, _onclick = metatag.stepevent(select=idx), _class="tab selected" if idx==selected else "tab")
+        if metatag._tabs: self+=metatag._tabs[selected]
diff --git a/test_fast.html b/test_fast.html
diff --git a/test_fluent.html b/test_fluent.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <script type="module" src="https://unpkg.com/@fluentui/web-components"></script>
+    </head>
+    <body>
+
+        <fluent-tabs activeid="entrees">
+            <fluent-tab id="apps">Appetizers</fluent-tab>
+            <fluent-tab id="entrees">Entrees</fluent-tab>
+            <fluent-tab id="desserts">Desserts</fluent-tab>
+            <fluent-tab-panel id="appsPanel">
+                apps
+            </fluent-tab-panel>
+            <fluent-tab-panel id="entreesPanel">
+                entrees
+            </fluent-tab-panel>
+            <fluent-tab-panel id="dessertsPanel">
+                desserts
+            </fluent-tab-panel>
+        </fluent-tabs>
+
+
+    </body>
+</html>