Wrapped Bulma table inside of additional grid to make it responsive

Megabit · Apr 22, 2020 · 5146cbe · 5146cbe
1 parent cfc223c
commit 5146cbe
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 0 deletions.
diff --git a/Source/Blazorise.Bulma/Config.cs b/Source/Blazorise.Bulma/Config.cs
@@ -50,6 +50,7 @@ private static void RegisterComponents( IComponentMapper componentMapper )
             componentMapper.Register( typeof( Blazorise.Select<> ), typeof( Bulma.Select<> ) );
             componentMapper.Register( typeof( Blazorise.Switch<> ), typeof( Bulma.Switch<> ) );
             componentMapper.Register<Blazorise.Button, Bulma.Button>();
+            componentMapper.Register<Blazorise.Table, Bulma.Table>();
             componentMapper.Register<Blazorise.Tabs, Bulma.Tabs>();
             componentMapper.Register<Blazorise.TextEdit, Bulma.TextEdit>();
             componentMapper.Register( typeof( Blazorise.TimeEdit<> ), typeof( Bulma.TimeEdit<> ) );

diff --git a/Source/Blazorise.Bulma/Table.razor b/Source/Blazorise.Bulma/Table.razor
@@ -0,0 +1,17 @@
+@inherits Blazorise.Table
+@if ( Responsive )
+{
+    <div style="display: grid;">
+        <div class="@ResponsiveClassNames">
+            <table class="@ClassNames" style="@StyleNames" @attributes="@Attributes">
+                @ChildContent
+            </table>
+        </div>
+    </div>
+}
+else
+{
+    <table class="@ClassNames" style="@StyleNames" @attributes="@Attributes">
+        @ChildContent
+    </table>
+}