Merge pull request #2107 from SylvainCorlay/gridbox

Grid layout

Author: SylvainCorlay

docs/source/examples/Widget Styling.ipynb

@@ -10,7 +10,7 @@
 from .widget_core import CoreWidget
 from .widget_bool import Checkbox, ToggleButton, Valid
 from .widget_button import Button, ButtonStyle
-from .widget_box import Box, HBox, VBox
+from .widget_box import Box, HBox, VBox, GridBox
 from .widget_float import FloatText, BoundedFloatText, FloatSlider, FloatProgress, FloatRangeSlider, FloatLogSlider
 from .widget_image import Image
 from .widget_int import IntText, BoundedIntText, IntSlider, IntProgress, IntRangeSlider, Play, SliderStyle

docs/source/examples/images/grid-area.png

@@ -107,3 +107,10 @@ class HBox(Box):
     """
     _model_name = Unicode('HBoxModel').tag(sync=True)
     _view_name = Unicode('HBoxView').tag(sync=True)
+
+
+@register
+class GridBox(Box):
+    _model_name = Unicode('GridBoxModel').tag(sync=True)
+    _view_name = Unicode('GridBoxView').tag(sync=True)
+ 

docs/source/examples/images/grid-cell.png

@@ -61,6 +61,17 @@ class Layout(Widget):
     visibility = CaselessStrEnum(['visible', 'hidden']+CSS_PROPERTIES, allow_none=True, help="The visibility CSS attribute.").tag(sync=True)
     width = Unicode(None, allow_none=True, help="The width CSS attribute.").tag(sync=True)
 
+    grid_auto_columns = Unicode(None, allow_none=True, help="The grid-auto-columns CSS attribute.").tag(sync=True)
+    grid_auto_flow = CaselessStrEnum(['column','row','row dense','column dense']+ CSS_PROPERTIES, allow_none=True, help="The grid-auto-flow CSS attribute.").tag(sync=True)
+    grid_auto_rows = Unicode(None, allow_none=True, help="The grid-auto-rows CSS attribute.").tag(sync=True)
+    grid_gap = Unicode(None, allow_none=True, help="The grid-gap CSS attribute.").tag(sync=True)
+    grid_template_rows = Unicode(None, allow_none=True, help="The grid-template-rows CSS attribute.").tag(sync=True)
+    grid_template_columns = Unicode(None, allow_none=True, help="The grid-template-columns CSS attribute.").tag(sync=True)
+    grid_template_areas = Unicode(None, allow_none=True, help="The grid-template-areas CSS attribute.").tag(sync=True)
+    grid_row = Unicode(None, allow_none=True, help="The grid-row CSS attribute.").tag(sync=True)
+    grid_column = Unicode(None, allow_none=True, help="The grid-column CSS attribute.").tag(sync=True)
+    grid_area = Unicode(None, allow_none=True, help="The grid-area CSS attribute.").tag(sync=True)
+
 
 class LayoutTraitType(Instance):