Browse code

Prepisanie inline stylov do css suboru

Cinan Rakosnik authored on 06/03/2013 at 23:33:30
Showing 2 changed files
... ...
@@ -23,7 +23,7 @@
23 23
 }
24 24
 
25 25
 .user {
26
-  padding: 4px 3px;
26
+  padding: 4px 0 4px 3px;
27 27
   margin-right: -9px;
28 28
 
29 29
   h1, h2, h3 {
... ...
@@ -122,21 +122,48 @@
122 122
 
123 123
   .action {
124 124
     margin-right: 2px;
125
+    margin-top: -31px;
126
+    float: right;
127
+    width: 67px;
128
+    color: #7e8b90;
125 129
 
126
-    .icon-bubble:before {
127
-      margin-left: 6px;
128
-    }
130
+    .icon-bubble, .icon-bubbles, .icon-x-full {
131
+      width: 21px;
132
+      overflow: hidden;
133
+      display: block;
134
+      float: right;
135
+      padding-right: 10px;
136
+      padding-top: 1px;
137
+
138
+      &:before {
139
+        margin-left: 6px;
140
+      }
129 141
 
130
-    .icon-bubbles:before {
131
-      margin-left: 6px;
142
+      span {
143
+        font-variant: small-caps;
144
+        font-weight: bold;
145
+        position: relative;
146
+        top: -3px;
147
+        font-size: 0.9em;
148
+      }
132 149
     }
133 150
 
134
-    .icon-x-full:before {
135
-      margin-left: 6px;
151
+    .icon-bubble {
152
+      span {
153
+        left: 2px;
154
+      }
136 155
     }
137 156
 
138
-    &.invite {
157
+    .icon-bubbles {
158
+      span {
159
+        left: 1px;
160
+      }
161
+    }
139 162
 
163
+    .icon-x-full {
164
+      span {
165
+        left: 3px;
166
+      }
140 167
     }
141 168
   }
142 169
 }
... ...
@@ -24,9 +24,9 @@
24 24
               Adam Wolsky
25 25
               %span.status.online.icon-record
26 26
             %h2 co-founder
27
-            %span.action{ style: "float: right; margin-top: -31px; width: 62px; color: #7e8b90"}
28
-              %span.icon-x-full{ style: "width: 21px; overflow: hidden; display: block; float: right;padding-right: 10px; padding-top: 1px;"}
29
-                %span{style: "font-variant: small-caps; font-weight: bold; position: relative; top: -3px; left: 2px; font-size: 0.9em;"} kick
27
+            %span.action
28
+              %span.icon-x-full
29
+                %span kick
30 30
           %li.clear.user
31 31
             .avatar
32 32
               %img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
... ...
@@ -34,25 +34,23 @@
34 34
               John Savage
35 35
               %span.status.away.icon-record
36 36
             %h2 web & ui designer
37
-            %span.action{ style: "float: right; margin-top: -31px; width: 62px; color: #7e8b90"}
38
-              %span.icon-x-full{ style: "width: 21px; overflow: hidden; display: block; float: right;padding-right: 10px; padding-top: 1px;"}
39
-                %span{style: "font-variant: small-caps; font-weight: bold; position: relative; top: -3px; left: 2px; font-size: 0.9em;"} kick
40
-              %span.icon-bubbles{ style: "width: 21px; overflow: hidden; display: block; float: right;padding-right: 10px; padding-top: 1px;"}
41
-                %span{style: "font-variant: small-caps; font-weight: bold; position: relative; top: -3px; font-size: 0.9em;"} invite
37
+            %span.action
38
+              %span.icon-x-full
39
+                %span kick
40
+              %span.icon-bubbles
41
+                %span invite
42 42
         %h1.group-header Friends
43 43
         %ul
44
-          %li.clear.user{ style: "padding-right: 0"}
44
+          %li.clear.user
45 45
             .avatar
46 46
               %img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
47 47
             %h1
48 48
               Ashley Bond
49 49
               %span.status.offline.icon-record
50 50
             %h2 sexretary
51
-            %span.action{ style: "float: right; margin-top: -31px; width: 62px; color: #7e8b90"}
52
-              -#%span.icon-bubble{ style: "width: 21px; overflow: hidden; display: block; float: right;padding-right: 10px; padding-top: 1px;"}
53
-              -#  %span{style: "font-variant: small-caps; font-weight: bold; position: relative; top: -3px; font-size: 0.9em;"} chat
54
-              %span.icon-bubbles{ style: "width: 21px; overflow: hidden; display: block; float: right;padding-right: 13px; padding-top: 1px;"}
55
-                %span{style: "font-variant: small-caps; font-weight: bold; position: relative; top: -3px; font-size: 0.9em;"} invite
51
+            %span.action
52
+              %span.icon-bubbles
53
+                %span invite
56 54
           %li.clear.user
57 55
             .avatar
58 56
               %img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
... ...
@@ -60,9 +58,9 @@
60 60
               Bob Awesome
61 61
               %span.status.dnd.icon-record
62 62
             %h2 sales manager
63
-            %span.action{ style: "float: right; margin-top: -31px; width: 62px; color: #7e8b90"}
64
-              %span.icon-x-full{ style: "width: 21px; overflow: hidden; display: block; float: right;padding-right: 10px; padding-top: 1px;"}
65
-                %span{style: "font-variant: small-caps; font-weight: bold; position: relative; top: -3px; left: 2px; font-size: 0.9em;"} kick
63
+            %span.action
64
+              %span.icon-x-full
65
+                %span kick
66 66
           %li.clear.user
67 67
             .avatar
68 68
               %img{src: 'assets/avatar.png', alt: t("chat.avatar_alt")}
... ...
@@ -70,9 +68,9 @@
70 70
               Bob Awesome
71 71
               %span.status.dnd.icon-record
72 72
             %h2 sales manager
73
-            %span.action{ style: "float: right; margin-top: -31px; width: 62px; color: #7e8b90"}
74
-              %span.icon-bubble{ style: "width: 21px; overflow: hidden; display: block; float: right;padding-right: 10px; padding-top: 1px;"}
75
-                %span{style: "font-variant: small-caps; font-weight: bold; position: relative; top: -3px; left: 2px; font-size: 0.9em;"} chat
73
+            %span.action
74
+              %span.icon-bubble
75
+                %span chat
76 76
 
77 77
       .toolbox
78 78
         %input{type: "search", placeholder: "Search contact"}