From dc28cd8294c1358cb8548b1ae7da81ea2c219c22 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?H=C3=A5kon=20Rosseb=C3=B8?= <hakonrossebo@hotmail.com>
Date: Wed, 23 Mar 2016 10:34:40 +0100
Subject: [PATCH] Updates Demo Badge to use Style. Initial implementation

---
 examples/Demo.elm        |  3 +--
 examples/Demo/Badges.elm | 24 ++++++++++++------------
 2 files changed, 13 insertions(+), 14 deletions(-)

diff --git a/examples/Demo.elm b/examples/Demo.elm
index ee28fc3..e69f289 100644
--- a/examples/Demo.elm
+++ b/examples/Demo.elm
@@ -119,10 +119,9 @@ tabs =
   , ("Template", \addr model -> 
       [Demo.Template.view (Signal.forwardTo addr TemplateAction) model.template])
   -}
-  , ("Badges", \addr model -> Demo.Badges.view)
+  , ("Badges", \addr model -> Demo.Badges.view )
   ]
 
-
 tabViews : Array (Addr -> Model -> List Html)
 tabViews = List.map snd tabs |> Array.fromList
 
diff --git a/examples/Demo/Badges.elm b/examples/Demo/Badges.elm
index 422085e..5ee4d78 100644
--- a/examples/Demo/Badges.elm
+++ b/examples/Demo/Badges.elm
@@ -1,18 +1,18 @@
 module Demo.Badges where
 
-import Material.Icon as Icon
-import Material.Badge as Badge
 import Html exposing (..)
-import Html.Attributes exposing (..)
+import Html.Attributes exposing (class, style, key)
+import Material.Badge as Badge
+import Material.Style exposing (..)
 
+-- VIEW
 
 view : List Html
-view =
-  [ 
-    h1 [][text "Badges"],
-    Icon.viewWithOptions "face" Icon.S18 [] { badgeInfo = Just (Badge.viewDefault "16")},
-    Icon.viewWithOptions "add" Icon.S18 [] { badgeInfo = Just (Badge.view   { overlap = False, noBackground = False} "99")},
-    Icon.viewWithOptions "add" Icon.S18 [] { badgeInfo = Just (Badge.view   { overlap = False, noBackground = True} "4")},
-    Icon.view "add" Icon.S18 [],
-    Icon.i "add"
-  ]
+view = [  div [][p [][]
+        , styled span  (Badge.badgeStyle   { overlap = False, noBackground = False} "4")  [ ] [ text "Span with badge" ]
+        , p [][]
+        , styled span  (Badge.badgeStyle   { overlap = True, noBackground = False} "7")  [ ] [ text "Span with no background badge" ]
+        , p [][]
+        , styled span  (Badge.badgeStyle   { overlap = True, noBackground = False} "14")  [ ] [ text "Span with badge overlap" ]
+    ]
+  ]
\ No newline at end of file