Merge pull request #39 from emncnozge/master

Add Card component

README.md

@@ -103,6 +103,7 @@ public partial class Index
 - [Blind](#blind)
 - [Breadcrumb](#breadcrumb)
 - [Button](#button)
+- [Card](#card)
 - [Card List](#card-list) **(since v0.3.3)**
 - [Push Card](#push-card) **(since v0.3.3)**
 - [Action Card](#action-card) **(since v0.3.3)**
@@ -479,6 +480,21 @@ Test content
 <Button>Test Button</Button>
 ```
 
+## Card
+
+```razor
+<Card Variant="CardVariant.info">
+    <ix-icon name="capacity"></ix-icon>
+    <ix-typography bold>Number of components</ix-typography>
+    <ix-typography>
+        Item 1<br />
+        Item 2<br />
+        Item 3
+    </ix-typography>
+    <ix-typography format="h1">3</ix-typography>
+</Card>
+```
+
 ## Card List
 
 ```razor
@@ -1107,7 +1123,7 @@ div[data-tab-content].show {
 ```razor
 <Tile Size="TileSize.Medium" Class="mr-1">
     <div slot="header">Tile header</div>
-    <div class="text-l">92.8 °C</div>
+    <div class="text-l">92.8 °C</div>
 </Tile>
 ```
 

SiemensIXBlazor/Components/Card/Card.razor

@@ -0,0 +1,13 @@
+@namespace SiemensIXBlazor.Components
+@inherits IXBaseComponent
+@using SiemensIXBlazor.Helpers
+
+<ix-card @attributes="UserAttributes"
+         class=@Class
+         style=@Style
+         variant=@Variant
+         selected=@Selected>
+    <ix-card-content>
+        @ChildContent
+    </ix-card-content>
+</ix-card>

SiemensIXBlazor/Components/Card/Card.razor.cs

@@ -0,0 +1,15 @@
+using Microsoft.AspNetCore.Components;
+using SiemensIXBlazor.Enums;
+
+namespace SiemensIXBlazor.Components
+{
+    public partial class Card
+    {
+        [Parameter]
+        public bool? Selected { get; set; }
+        [Parameter]
+        public CardVariant Variant { get; set; } = CardVariant.insight;
+        [Parameter]
+        public RenderFragment? ChildContent { get; set; }
+    }
+}

SiemensIXBlazor/Enums/Card/CardVariant.cs

@@ -0,0 +1,16 @@
+
+namespace SiemensIXBlazor.Enums
+{
+    public enum CardVariant
+    {
+        alarm,
+        critical,
+        info,
+        insight,
+        neutral,
+        notification,
+        primary,
+        success,
+        warning
+    }
+}