Styling view page

src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss

@@ -176,6 +176,47 @@ div[class*='activity-'] {
     }
 }
 
+div[class*='budget-'] {
+    div.dashboard,
+    h4.badge-title,
+    h3.badge-title,
+    h2.badge-title {
+        span.title_label {
+            // Calculate same color then border:groove
+            &_resource {
+                background-color: shade-color($budget-resource-color, 34%);
+            }
+            &_charge {
+                background-color: shade-color($budget-charge-color, 34%);
+            }
+            h3 {
+                color: $white;
+            }
+        }
+        span.title_action {
+            &_resource {
+                @include dashboard_like_badge($budget-resource-color);
+            }
+            &_charge {
+                @include dashboard_like_badge($budget-charge-color);
+            }
+        }
+        span.title_label {
+            div.duration {
+                font-size: 70%;
+                font-weight: 500;
+                p {
+                    margin-bottom: 0;
+                    text-align: right;
+                    abbr {
+                        text-decoration: none;
+                    }
+                }
+            }
+        }
+    }
+}
+
 /*
 * Pill badge by entity
 */