Browse code

Rozne male upravy v CSS

Cinan Rakosnik authored on 20/05/2013 at 14:22:55
Showing 4 changed files
... ...
@@ -7,22 +7,21 @@
7 7
       %p change
8 8
   %h1
9 9
     %input{ type: 'text', title: "#{@jid}", class: 'js-edit-name', value: "#{@name}"}
10
-  %h2 #{@message || '<input type="text" class="js-edit-status empty" value="'+I18n.t('chat.roster.change_status_msg')+'">' }
11
-  -#todo: nastylovat placeholder
10
+  %h2{style: 'margin-top: -5px'} #{@message || '<input type="text" class="js-edit-status empty" value="'+I18n.t('chat.roster.change_status_msg')+'">' }
12 11
   %h3
13 12
     .rolldown.js-change-state
14 13
       .js-state-clickable{ 'data-state' => 'online' }
15 14
         %span.status.icon-record.online
16 15
         %a.active{ href: '#' }
17 16
           Online
18
-          %br
17
+          %span.icon-arrow-down.drop-down
19 18
       .hidden.js-state-clickable{ 'data-state' => 'away' }
20 19
         %span.status.icon-record.away
21 20
         %a{ href: '#' }
22 21
           Away
23
-          %br
22
+          %span.icon-arrow-down.drop-down
24 23
       .hidden.js-state-clickable{ 'data-state' => 'dnd' }
25 24
         %span.status.icon-record.dnd
26 25
         %a{ href: '#' }
27 26
           DND
28
-    %span.icon-arrow-down.drop-down
29 27
\ No newline at end of file
28
+          %span.icon-arrow-down.drop-down
30 29
\ No newline at end of file
... ...
@@ -83,6 +83,7 @@ class Xmpp.Views.Contacts.MeView extends Backbone.View
83 83
          .find('.hidden').removeClass('hidden')
84 84
 
85 85
     $('.rolldown').removeClass('js-change-state')
86
+                  .find('.drop-down').addClass('hidden')
86 87
 
87 88
   confirmChangeState: (e) ->
88 89
     $this = $(e.currentTarget)
... ...
@@ -92,6 +93,7 @@ class Xmpp.Views.Contacts.MeView extends Backbone.View
92 92
       .children().addClass('hidden')
93 93
 
94 94
     $('.rolldown').find('a').removeClass('active')
95
+                  .find('.drop-down').removeClass('hidden')
95 96
 
96 97
     $this.removeClass('hidden')
97 98
       .find('a').addClass('active')
... ...
@@ -6,6 +6,7 @@
6 6
 
7 7
 @import "compass/css3/box-sizing";
8 8
 @import "compass/css3/opacity";
9
+@import "compass/css3/box-shadow";
9 10
 
10 11
 @import "config";
11 12
 @import "chat.css.scss";
... ...
@@ -43,6 +43,7 @@
43 43
   .wrap {
44 44
     overflow-y: auto;
45 45
     overflow-x: hidden;
46
+    width: 210px;
46 47
   }
47 48
 }
48 49
 
... ...
@@ -75,7 +76,7 @@
75 75
   h3 {
76 76
     font-size: 12px;
77 77
     color: $status-color;
78
-    margin-top: -3px;
78
+    margin-top: -2px;
79 79
 
80 80
     .rolldown {
81 81
       clear: both;
... ...
@@ -84,24 +85,31 @@
84 84
       width: 67px;
85 85
       font-weight: normal;
86 86
       float: left;
87
+      z-index: 10;
88
+
87 89
       a {
88 90
         color: $status-color;
89 91
       }
90 92
 
91 93
       &.editing {
92 94
         background: white;
95
+        @include box-shadow(rgba(33,87,81, 0.4) 0 0 2px);
93 96
       }
94 97
 
95 98
       .active {
96 99
         font-weight: bold;
97 100
       }
101
+
102
+      div {
103
+        clear: both;
104
+      }
98 105
     }
99 106
 
100 107
     .drop-down {
101 108
       position: relative;
102
-      top: 1px;
103
-      left: 54px;
109
+      top: 2px;
104 110
       font-size: 13px;
111
+      float: right;
105 112
     }
106 113
   }
107 114
 
... ...
@@ -252,6 +260,7 @@
252 252
     padding: 8px 10px;
253 253
     background: white;
254 254
     border-right: 0 !important;
255
+    z-index: 1;
255 256
 
256 257
     li {
257 258
       background: white;
... ...
@@ -275,7 +284,7 @@
275 275
   }
276 276
 
277 277
   .action {
278
-    margin-right: 2px;
278
+    margin-right: 5px;
279 279
     margin-top: -31px;
280 280
     float: right;
281 281
     width: 67px;
... ...
@@ -289,6 +298,10 @@
289 289
       padding-right: 10px;
290 290
       padding-top: 1px;
291 291
 
292
+      &:hover {
293
+        cursor: pointer;
294
+      }
295
+
292 296
       &:before {
293 297
         margin-left: 6px;
294 298
       }
... ...
@@ -335,7 +348,7 @@
335 335
 .status {
336 336
   font-size: 15px;
337 337
   position: relative;
338
-  top: 2px;
338
+  top: 1px;
339 339
 
340 340
   &.online, &.away, &.dnd, &.offline {
341 341
     font-size: 11px;