Adds css breakpoint helper examples

src/Nri/Ui/Message/V3.elm

@@ -3,7 +3,7 @@ module Nri.Ui.Message.V3 exposing
     , view, Attribute
     , icon, custom, testId, id
     , hideIconForMobile, hideIconFor
-    , css
+    , css, notMobileCss, mobileCss, quizEngineMobileCss
     , tiny, large, banner
     , plaintext, markdown, html, httpError
     , tip, error, alert, success, customTheme

styleguide-app/Examples/Message.elm

@@ -46,6 +46,21 @@ init =
                 , use = Message.css
                 , default = "border: 1px dashed red;"
                 }
+            |> CommonControls.mobileCss
+                { moduleName = "Message"
+                , use = Message.mobileCss
+                , default = "border: 2px solid orange;"
+                }
+            |> CommonControls.quizEngineMobileCss
+                { moduleName = "Message"
+                , use = Message.quizEngineMobileCss
+                , default = "border: 4px solid yellow !important;"
+                }
+            |> CommonControls.notMobileCss
+                { moduleName = "Message"
+                , use = Message.notMobileCss
+                , default = ""
+                }
     }