add Grid Object

Author: manatlan

.gitignore

@@ -159,3 +159,4 @@ cython_debug/
 #  option (not recommended) you can uncomment the following to ignore the entire idea folder.
 #.idea/
 poetry.lock
+htagui/swipers2.py

README.md

@@ -373,6 +373,20 @@ self <= ui.Button("p1", _onclick = lambda ev: v.go( Tag.div("p1") ))
 self <= ui.Button("p2", _onclick = lambda ev: v.go( Tag.div("p2") ))
 self <= v
 ```
+## Object Grid
+
+signature : Grid(format,vformat="auto",gap="1px",**a)
+
+A simple grid container
+
+example:
+```python
+
+g = Grid("1fr 1fr 2fr")
+g <= Tag.div( "2colums",_style="grid-column:1 / 3")    
+g <= Tag.div( "1column")  
+
+```
 
 
 ## utilities methods

htagui/all.py

@@ -16,7 +16,7 @@
 from .splitters import HSplit, VSplit
 from .ifields import IText,ITextarea,IRange,IBool,ISelect,IRadios
 from .fileupload import FileUpload
-from .containers import VScroll,VScrollPager, View    
+from .containers import VScroll,VScrollPager, View, Grid    
 from .sortables import Sortable
 from .swipers import Swiper
 from .javascripts import JSKEYABLE
@@ -34,5 +34,5 @@ def ui(self):
 
 # Swiper not inluded by default !!!!!
 
-ALL=[JSKEYABLE, App,Form,Tabs,Dialog,HSplit,VSplit,IText,ITextarea,IRange,IBool,ISelect,IRadios,FileUpload,Sortable,VScroll,VScrollPager,View]
+ALL=[JSKEYABLE, App,Form,Tabs,Dialog,HSplit,VSplit,IText,ITextarea,IRange,IBool,ISelect,IRadios,FileUpload,Sortable,VScroll,VScrollPager,View,Grid]
 FULL=ALL+[Swiper] # Swiper not inluded by default !!!!! (coz +170ko)

htagui/containers.py

@@ -96,3 +96,14 @@ def go(self,tag,anchor=None):
         self._refs[f'#{anchor}'] = tag
         self.call( f"document.location=`#{anchor}`")
 
+class Grid(Tag.div):
+    """
+        g = Grid("2fr 1fr 1fr")
+        g <= Tag.div( "2colums",_style="grid-column:1 / 3")    
+        g <= Tag.div( "1column")    
+    """
+    def init(self,format,vformat="auto",gap="1px",**a): # format= "2fr 1fr 1fr"
+        self["style"].set("display","grid")
+        self["style"].set("grid-template-columns",format)
+        self["style"].set("grid-template-rows",vformat)
+        self["style"].set("gap",gap)