DeokHong Kim (a.k.a insanehong) DeokHong Kim (a.k.a insanehong) 2013-10-13
changed notification icon sylte changed state color
changed state color
@9c5e0d377f2c0240890a198236631b1c005d8d2d
app/assets/stylesheets/less/_page.less
--- app/assets/stylesheets/less/_page.less
+++ app/assets/stylesheets/less/_page.less
@@ -960,7 +960,7 @@
                 font-size:16px;
                 padding:15px 20px;
                 text-align:center;
-                background-color:@yobi-cyan-dark;
+                background-color:#8b8b8b;
                 color:@yobi-white;
                 .border-radius(6px);
             }
@@ -993,38 +993,25 @@
                 }
 
                 .stream-type {
-                    width:26px;
-                    height:26px;
-                    padding:4px;
-                    border: 1px solid @state-open;
+                    display:inline-block;
+                    padding:4px 6px;
+                    border: 4px solid @state-open;
                     .border-radius(50%);
                     background: #FFF;
                     position:absolute;
                     top:12px; 
                     left:0;
-                    color:#fdfdfd;
+                    color:@state-open;
+                    text-align:center;
+                    line-height:20px;
+                    font-size:16px;
+                    font-weight:bold;
+                    vertical-align: middle;
 
-                    &.closed {border: 1px solid @state-closed;}
-                    &.changed {border: 1px solid @state-changed;}
-                    &.rejected {border: 1px solid @state-rejected;}
-                    &.warning {border : 1px solid @state-warning;}
-
-                    span { 
-                        background:@state-open;
-                        width:26px;
-                        height:26px;
-                        .border-radius(50%);
-                        display:inline-block;
-                        font-size:15px;
-                        text-align : center;
-
-                        &.closed {background:  @state-closed;}
-                        &.changed {background: @state-changed;}
-                        &.rejected {background: @state-rejected;}
-                        &.warning {background : @state-warning;}
-
-                        i { vertical-align:middle;width:auto;height:auto;}
-                    }
+                    &.closed {border: 4px solid @state-closed; color:@state-closed;}
+                    &.changed {border: 4px solid @state-changed;color:@state-changed}
+                    &.rejected {border: 4px solid @state-rejected;color:@state-rejected}
+                    &.warning {border : 4px solid @state-warning;color:@state-warning}
 
                 }
 
app/assets/stylesheets/less/_variables.less
--- app/assets/stylesheets/less/_variables.less
+++ app/assets/stylesheets/less/_variables.less
@@ -131,11 +131,11 @@
 @yobi-btn-disabled-hover : #cacfd2;
 
 // State color
-@state-open: @yobi-green-dark;
-@state-closed: @yobi-red-dark;
-@state-rejected: @yobi-orange-dark;
-@state-warning: @yobi-yello-dark;
-@state-changed: @yobi-blue-dark;
+@state-open: #b6da54;
+@state-closed: #fd6956;
+@state-rejected: #fd8658;
+@state-warning: #fcc666;
+@state-changed: #65c9df;
 
 @primary         : @orange;
 @secondary       : @blue2;
app/views/index/partial_notifications.scala.html
--- app/views/index/partial_notifications.scala.html
+++ app/views/index/partial_notifications.scala.html
@@ -53,7 +53,7 @@
 <li class="notification-stream">
     @defining(User.find.byId(noti.senderId)){ user =>
     <div class="stream-type @notifycationIcon(noti.eventType,noti.newValue)">
-        <span class="@notifycationIcon(noti.eventType,noti.newValue)"><i class="yobicon-@notifycationIcon(noti.eventType,noti.newValue)"></i></span>
+        <i class="yobicon-@notifycationIcon(noti.eventType,noti.newValue)"></i>
     </div>
     <div class="stream-desc" data-target="message-@noti.id" data-toggle="learnmore">
         <div class="stream-info">
Add a comment
List