From fbb50e6621c8ee0973628e53e4855773488fc0f8 Mon Sep 17 00:00:00 2001
From: lilia <liliakai@gmail.com>
Date: Thu, 27 Aug 2015 17:01:34 -0700
Subject: [PATCH] Change colors and backgrounds

---
 images/icon_tile.png           | Bin 0 -> 1135 bytes
 stylesheets/_conversation.scss |   1 +
 stylesheets/_global.scss       |   9 ++++++---
 stylesheets/_index.scss        |   5 +++++
 stylesheets/manifest.css       |  15 +++++++++++----
 5 files changed, 23 insertions(+), 7 deletions(-)
 create mode 100644 images/icon_tile.png

diff --git a/images/icon_tile.png b/images/icon_tile.png
new file mode 100644
index 0000000000000000000000000000000000000000..4710e2a73133f9012cd6e0e201b5ef162a00b290
GIT binary patch
literal 1135
zcmV-#1d#iQP)<h;3K|Lk000e1NJLTq001%o001%w1^@s69zTe&00006VoOIv0RI60
z0RN!9r;`8x010qNS#tmY4#NNd4#NS*Z>VGd000McNliru-v}H49XdQ?5)uFa1N=!u
zK~!ko?U~zh+eQ#XPcHxha%9Qz|Nmef^58Nhl347HA7(*Nj$#2MXe$o4in<oD)6;Y5
z8S1a?VEhIr@SB_)kQ<O2kQ<Qy)~T=cU^6&vP#V7&NbeZPXm}-I7<DDux&Q$B1Th&^
zB~muB`Ty1ewHlC3EjG1#d_TCcy9k(DY8VnU0qz=+4Gs~8Y^#8&FJVCPSC9yT=N?kF
zBMW8@;q*Pv*-(Tk2x<DBvK^oK(}0*k9h`w7Lq8ZpI>`q?EfE4QKqZ4@9#$zkz$%EQ
zf~FFOSVB%e0f-s2wWurDN67AW3}`EHS3?zEkAKf25fkhN=(9mK_R$@4w-HYV!<ZZ}
z_h^awwPMVs5<~H*nH&DF5%t1ien{}O|7S=E$P2+Ny1Ei{^#lTQ7Cv{PIin+W6@2d8
z0i!poAnqD1W+W`FOd~5}h<)lNwibse&gP$;Xe7*FNJc8GuMWfvnjiw6*oHIn&_cd&
zEE~h>v2#$AJF0LcMhw^wr9uR_-;CvTon{(<$JQCoz`j(lRe?y}xUxALf1DA+v%*aN
zZ1ZBq$5ykQ^(K&P@Szb+Q0X6>mDqDnTOB1C*}T8Z0W-^_DnKkeH^IC3)#SMR4uF_o
zQ_U+R;mz1psp~d@x+0DuTl|i+AW44ANU?Z7Or1KwRgtK$GUm-wZ?hsGy!B8sI1G~z
zyeb{9M8ti&LXM1~_0WlYT3)UV;55v%LXPm=L&mabc3luTkBP6@z2wc%%B5M2ahmM9
zq?mbyw9<HEo)^utWPG2d+8(oErmM`|;PXu?V{o5rn)NU3BSG+dGVl!9U)MU@=*HJU
zw6%`2{W@Ap@Ys3vP`T_HWp_7BPU;#+3x<-}>Nh4=yd(WjalJ|`O+!{tk?`hQm$`S$
z0ultf!DuR{JP4kmv5l9rAbG?6Qb3Hdem5+e-RmXQWEUqfH|CBI_nYN&iHgzN9`?gD
zHg~nyCtKWm!;*`~5%=Rp)8Fi0JpBXtF?#&(ow18Pvt#hkmTG9r!?s@P#UUHX#9b|(
zixJ;r*$r-R9XJ}6@#H-uXTVN+Qx(L=jlXX{*jeg&@j58TFMDjobDTg}={MWnrt++l
zy;k`$8X4s4)hz#c+Z!=+_K0xSf-akTR`R{pE{c6}aXD6<Y%fREa1w8ArK40ol$|he
z(VTM@kg<w|5-wkRH{`AnZ8gsKLIxk2DL)R$yR`v_!MBdK(sus*CAPUL{&KKVMt!%n
zjpm}Sgw<33GW<sAar}LyW)v>K!I0roSENL?7h6NUqWbmv+_uU&n~|}P5MAU2{o0Se
zF8X|AOy(ed`MC&)-T{D%bL7398;~228<77AkZ%_I0Ky9{%O3y$002ovPDHLkV1mc9
B6fpn*

literal 0
HcmV?d00001

diff --git a/stylesheets/_conversation.scss b/stylesheets/_conversation.scss
index 6a6007f34..f70c51144 100644
--- a/stylesheets/_conversation.scss
+++ b/stylesheets/_conversation.scss
@@ -117,6 +117,7 @@
   margin: 0;
   padding: 1em 0;
   overflow-y: auto;
+  background-color: #ffffff;
 
   .timestamp {
     cursor: pointer;
diff --git a/stylesheets/_global.scss b/stylesheets/_global.scss
index 977a4c3be..c1db267e5 100644
--- a/stylesheets/_global.scss
+++ b/stylesheets/_global.scss
@@ -267,17 +267,20 @@ $avatar-size: 44px;
 .contact {
   position: relative;
   padding: 12px;
-  background: white;
   cursor: pointer;
-  transition: background 0.2s;
   white-space: nowrap;
   overflow: hidden;
-  box-shadow: 0 1px 3px rgba(#aaa, 0.8);
+  box-shadow: 0 0px 1px rgba(#aaa, 0.8);
 
   &:hover {
     background: #f8f8f8;
   }
 
+  &.selected {
+    background: $blue;
+    color: #ffffff;
+  }
+
   &:last-child::after {
     display: none;
   }
diff --git a/stylesheets/_index.scss b/stylesheets/_index.scss
index e5eb92229..b159b5009 100644
--- a/stylesheets/_index.scss
+++ b/stylesheets/_index.scss
@@ -1,4 +1,5 @@
 .gutter {
+  background: $grey_l;
   padding: $header-height 0 0;
 }
 
@@ -50,6 +51,7 @@
 }
 
 .conversation-stack {
+  background: url('/images/icon_tile.png');
   padding-left: 300px;
   padding-top: $header-height;
   .conversation {
@@ -114,6 +116,9 @@ input.search {
   font-size: smaller;
 }
 
+.new-contact, .contacts {
+  background: $grey_l;
+}
 .new-contact {
   display: none;
   .contact-name { display: none; }
diff --git a/stylesheets/manifest.css b/stylesheets/manifest.css
index d2556ce9e..42b61b595 100644
--- a/stylesheets/manifest.css
+++ b/stylesheets/manifest.css
@@ -224,14 +224,15 @@ img.emoji {
 .contact {
   position: relative;
   padding: 12px;
-  background: white;
   cursor: pointer;
-  transition: background 0.2s;
   white-space: nowrap;
   overflow: hidden;
-  box-shadow: 0 1px 3px rgba(170, 170, 170, 0.8); }
+  box-shadow: 0 0px 1px rgba(170, 170, 170, 0.8); }
   .contact:hover {
     background: #f8f8f8; }
+  .contact.selected {
+    background: #2090ea;
+    color: #ffffff; }
   .contact:last-child::after {
     display: none; }
   .contact .contact-details {
@@ -345,6 +346,7 @@ img.emoji {
   to {
     transform: rotate(360deg); } }
 .gutter {
+  background: #f3f3f3;
   padding: 36px 0 0; }
 
 .conversation-stack,
@@ -379,6 +381,7 @@ img.emoji {
     background: url("/images/error_red.png") no-repeat left center; }
 
 .conversation-stack {
+  background: url("/images/icon_tile.png");
   padding-left: 300px;
   padding-top: 36px; }
   .conversation-stack .conversation {
@@ -429,6 +432,9 @@ input.search {
 .last-timestamp {
   font-size: smaller; }
 
+.new-contact, .contacts {
+  background: #f3f3f3; }
+
 .new-contact {
   display: none; }
   .new-contact .contact-name {
@@ -554,7 +560,8 @@ input.search {
 .message-list {
   margin: 0;
   padding: 1em 0;
-  overflow-y: auto; }
+  overflow-y: auto;
+  background-color: #ffffff; }
   .message-list .timestamp {
     cursor: pointer; }
     .message-list .timestamp:hover {