From cf511683cd77c7a0de0f132d72c37b46525648d9 Mon Sep 17 00:00:00 2001
From: Sean Li <mail@shang.li>
Date: Thu, 22 Jan 2015 15:08:17 -0800
Subject: [PATCH] Minor color change and added image tag in container detail.

---
 app/ContainerDetails.react.js |   3 ++-
 app/images/running.png        | Bin 536 -> 527 bytes
 app/images/running@2x.png     | Bin 1203 -> 1128 bytes
 app/images/runningwave.png    | Bin 355 -> 0 bytes
 app/images/runningwave@2x.png | Bin 654 -> 626 bytes
 app/styles/containers.less    |  20 ++++++++------------
 app/styles/variables.less     |   6 +++---
 7 files changed, 13 insertions(+), 16 deletions(-)
 delete mode 100644 app/images/runningwave.png

diff --git a/app/ContainerDetails.react.js b/app/ContainerDetails.react.js
index cd8c140d6f..26747d4bd7 100644
--- a/app/ContainerDetails.react.js
+++ b/app/ContainerDetails.react.js
@@ -160,11 +160,12 @@ var ContainerDetails = React.createClass({
     }
 
     var name = this.state.container.Name.replace('/', '');
+    var image = this.state.container.Config.Image;
 
     return (
       <div className="details">
         <div className="details-header">
-          <h1>{name}</h1> <a className="btn btn-primary" onClick={this.handleClick}>View</a>
+          <h1>{name}</h1> {state} {image}<a className="btn btn-primary" onClick={this.handleClick}>View</a>
         </div>
         {progress}
         <div className="details-logs">
diff --git a/app/images/running.png b/app/images/running.png
index 15ccd11b6b8643dab168d7f58451958826fcc4d7..ea129def4fe28b49fd0ac56a9c85a1341f8ad314 100644
GIT binary patch
delta 488
zcmV<E0T=$51djxeF@MQPL_t(I5v`TKP69y?#=l#m6_z#@hJ=#F#Crk@6Fc+?D4;M@
zl9*Up8c1j@r0@xl&cwneI1?L7611?fv7qtat@91La3V+GaFb*I%zVGQo!uD%Oldn2
zR<}1$3M@)u4ub%jbh8#O(nU5v_u&=Y`w*X8PqrXA;keqz0e=ECWmuTBP0V|+IJwN@
zI=OB}lQWn~9}R(ZWUXL<M;qh#3n;z~u+E2LuF*yx`l?2>BaR=?P<?`x{#~9Lra5`%
z;md3Eb()4Z>6YC#I})Q0G3>YVxbqIPdI9c={YGNECfh&c_6-lf#f;keyf8XD-#W)+
zkY#w9GS!&1uYYi%#sz+;@i8UKxT^ugXiMDU1z1B@YN(Y)7EdSS<lEqueU_HchQ?po
z!2r)$VAOamS^UC(ZN{Y&aye{eC3`Jd{KAN!l^A<jfeCG7nCJ>JsLafcw6`&%sFg;R
zVbzdvPg15>DdQ+jm$ps~wPcWGv;;}jaDtXgr!@Vqbz$e*(nVpArKijslz=uhCnYz<
zajxPZAkAZH$sl-K4_QIVI2WjXt)`P?057e-XFN?k0EwB~CW~%U((lw~*%+wby?lZF
e10;8uzknZ0Y`x(OY+-T$0000<MNUMnLSTaUO6Pk3

delta 497
zcmV<N0S^9;1egSnF@MrYL_t(I5v`T6FGEoj#=m=uNsJvjSPV!PlKuq-iLFfRB0(of
z#n@3aF;$z0oe7)7;4f&xA{Z=&4jsjWzU%w$dws2Ho1!;q^WM4V`}Ll4&p9>dwyGPW
z7@x~pi>!0V&?ObQ)r>(k2yltFyGvw_KRV^6(}1VavN4GwH-Dyn?6nyj@a$Y8kLlb+
zn;9)&p<wN5av#>@<>27%U4RobKCgkqODJkgA~CXPEY=N7+S>wG49@C%C=>#{$3Xj7
zJ`ju{z7w{C(|V=p6vEoR`QuniZW4OP6pTU8nXTOxkYQSrIQKAzCCqHzw8?uvK2{b8
zyb?5UjTME@6n}4wnu+-b<t%V6hv}`O-h?hYPvvcEOv&f;^>)_kHU(48e3)G{eN9Y_
zv|@yn!P1bxUqF=DzJSh6YP^<qm6?s|4B>5ddJp*SD}je%&00#LqHUJOfRJx)u{I^(
zP?vzUkjSF_^NO`K-Z-kB!w&c}FVc!-eWR14c4BAzK57Njcr6)XSxpTUrSDC))2~k%
zwqRNev8+arpBg$PdlPJ@fuU+WX}COttT054AU3#qlAkNEo%)8a)X+!1(n#AJWAU^R
nV5s9O4s&P&HYW1nAAbQ~<l)~L5*LYX00000NkvXXu0mjf_(1T9

diff --git a/app/images/running@2x.png b/app/images/running@2x.png
index 406bfc05f44a5fb99265c2dec3b4ec321e2b5984..b2777164bfe6b95f26cfc8c0aa059c28e9911153 100644
GIT binary patch
delta 1094
zcmV-M1iAaO3FrurF@GXSL_t(o3C&qMOjJP>J?{yN#8qijL=!YZqY?{aV(e@!P>jaH
z7#eJdHfm?0EQy_385_4T#=>AEQrOxV6JufgG+>lO7tsa`1X+mdIkP*%ytgZEaQ9^g
z9&_(}?m6?HI|Nu`=pV<PR5OkjfP*yAp)Uwbj6wl9>gEf8*MIpXJiXtIk86Qq{p!QH
z32bd?!UY8AW5xZ|*96#*cl<NDxQsgwy70Z)x>XT8{T}JfX<TOED>R(0*7#q_&5`WQ
z**V-A*@wBmlyS-bBslOHCt3O~hi{v!RRe+3V47wIv%BzQHFK*G3<f4~jg_ynP+2(w
z<eB=M@mNs6hkxKVax=foyhGc1bQD5<0rs+Cy&T%3j8kzU>`DG2lkLPXW65Qq3|J*j
zzd&o-4&0X*uR%iJXli(284n+J<7Yg-l74m^n_8Q2mJPZ_qU{yRjLdvR|Hu(6#Pcc<
z49-vD5er7i6|l%A-dLQ)?FR=iA2(Eue(nu6v~0#Df`48m*_K$Hk$asu!?Z|GmJ#Hz
zYDkCt%B5cG%kIWYKYgw8z$Y9g!O?hclGzZ4JLB7p5Ht%Sz+)!*>2C{p9Lsj&i(m17
z<$-bR3{rSTJ3ZDG2^RQs%3nB+h}lXuV1li3tJU<}5)RdxoFycZXvQnQCy6;dJC82A
z1%<Y-*?;Fea%{;WzrK2r6RxpM41-l7q7D)l%gYed3Bj(^ChUS1M6KqWGg?6qhOqoB
zaS<n_8G@-MT%_zy2o0@Pt6!;}varl_S^-I$BbB-#$ZkEcl1GXA+*-Gih@C1GgGJ0p
zah~_m19K}$VZvszCHaLVY^in=w)OruHk)}fet)pD+=-LVqbt;vDPo+*SJLE!Z!n4N
za}l?Y6IAy(7ubViPDxmZV~d;Spe~y(=-_us!a@b?j&g#$l_bo|!Rbcil%miPa#BWm
z&|aBh1rt%@*y0v)+&R=MVdJ{UIlPjQfE33THx2QWkG-xL+kHJrxdQf-2u8+TH{m2n
z`F~gyuyf@Ec}@2#B`M2Ah~ecz9?Y-(L{7|JUr$nwV~blTr#eD{4vvnUNLm7l!6dd1
zC2pZSelFv8HiNB583)HEBoqr%*cMKl#7%Qhx0g|yVPbk;a&RJPbyN%%F(VKqPKKbK
zBbe#De72-r-dChT9Tns0McvW45~t#QP=9YF?9!V)2Tstd#{2RU>mUn5SiWg-vF|s<
zA!e@LO1N|DIieWkx6(B<j*U&Lacpc8gE-Dd76);$P>x{9iy9<*{uYCVTCQO|NXn*c
z3&Y}-um`P2r*ub9O35G1NcKXHT*F!px3NW=#Be@w2`}UO#7g7vmxacD`Viele?L63
zUD~+MZ<e9rMt;C_JRAB6*s-Lb=Lo$*aBDch)zvtU=srm+C-rZLKR!I41wK7RUjP6A
M07*qoM6N<$f;*)LX8-^I

delta 1170
zcmV;D1a1512(t;0F@J4IL_t(o3C&qMY*j}Pon35fWGhM$@e>`0NCe~}LPB)36a)~6
zf`Zy6aY2$Q5+6&c5-2RNYl;*R5eSO3=@1g4u=ofNbdd>BiYRh~!OoqWGw<#7+z;m2
ze(%CckGnf}cF$q&e&&pWthU^r+%D_;zKB6SR|#81bt{JAkAG!WLYNJrvzf|0d9!#^
z_KZJoy;|A7VMXpU(;MT4>`M?j5+v+iNnaIx0Kzx2SMjopjQ-ha-_8g=yfPg7;@1HA
zCWJ8D>ELyKsyc`N+>hB}c2Pb%Jy+-BZSN-d^vcm7aSD!`e8;ucRpg~gHYPhyUteyl
z<p_rOWcsWIIe!PIil3^yk)Xd}Ms7)#J%Y=uWcaZ}u1EZ0+=UrGBpMEcAnVISKvILs
zh3wPO3A{tIS}MTia{JPT_{rc^fF3V*0ii!s!-V|3@RRHt|EK)EwtZ*vBl)=hWC(f|
zgf~}x^jh}U{3+Rg=2iJ!9l;QvPW@aahxPYbv+%vVo`1U}Bj5g89;l=C%nw5{FnlIN
z{SNDJpx6f_caEKatuT`ng7~cG@IlY}&NgfR$r0H#cE{USU4JySFRYUrmDyA|kI#L<
zk6R?z+7Q3MnA@?|?(6)*K^YnU-FIAbeP(i780`NQYjaN;i)#`a=a}C(IT68868hsa
z81mg}Gk-U~xVP)%5+ftoch}D(NWRpCY)3kRV)ErVS0KkV$IsgBnM;6tVr*h?eJ3+H
zkV|T}2;zp|A)JhS+J@-Xn)3sf>%cH9XE!e3M3WJW1Ns%FIlm$JX>GT<PCc#SWH8J&
z2)Xb|Wzz_1l*68YopY-_O8h{b)`4Z1&Y$-^n}1OdmH3O_ZU`R2O&4Gqb{p3?fm>wA
zRN#W^tK%D@&~c3o-b%#wh2b3IId8*SxaHeT*2~!B7A@HHEbQX<h6d{;Y;ue3NZ7Gx
zM<mYDT(yLaD4n}Fh3PFGDP(Gn)e=$_n*<S&`LYfH@B1nh?0^$c^hJS>4s9v4n`~6D
z^?yaA`YLiTbyhSr)+%9x8+Ni52_j5yj87S;giUVIbgOg3J$T498?BbH$t{|w_B0@H
zgc_phLQG=&0>K}t_z~VbNOn_S5ICvb*waMSlJYZ7;AYVb6~8A!^(7QIO%-4nro&5|
zj3CnyxCe8UkF~Iw>dX1}wo0Yv<S4mVihl&CMv%D@rXxHHN<)GA^0uDTsql#9ig9V@
zZ(0QLlDQHJmgEPg0ZK!Gut~PAKPj3hKb=M<2g}>E!E%CBQOuRVA;0=K?UaT+A(_k0
zrAz~{Ennl3N=pRE7>OL_O8iVww}!#KyIuX<{Hz$$Yhq#=b}5-u7Z`j{sgL3ewtuEh
zEs-O7tuT{VCo#%I7#w;gkEcghbeQuHMj!UIG2EJKL$;DfZh0l_x*5#heYokjM3K+;
zoWQL6#GamQ9Ltp;^W+cnqEqKB8-rsp|5Dlzb)ziziL3rhq9Y4Ip^vj`ch%wT7T&GA
kzIu~HufuKV&k+9um3t4k0S4Kb01E&B07*qoM6N<$f{;8&-~a#s

diff --git a/app/images/runningwave.png b/app/images/runningwave.png
deleted file mode 100644
index 2934116bf3fbcbab00bad027b676126520dda423..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 355
zcmV-p0i6DcP)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00001b5ch_0Itp)
z=>Px$9Z5t%R5%gsQ9VmTK@gnTASnbb1Z@;71Ti3{vQQMnUctX0SOr8=+5~JZUwl77
zECs<zu(MEXf*6y+fJHzM{Afh-cHI<trZ@xk@0#12n;C{#AUjzD|89V(;&x{U!^I`!
zuqbMipo{?at+XaOoih}6n<;m|Ks-caBC>Dfw!2S+xCV1yo@(+{Mq#fV;`A`G5x=?7
zXcutdJq=e%Jo@VsigBS7jkZNFZ@{~m9pL08Mx~-Xlk~1v*C>tHId);HhnOo}r=R^p
ztvba#BRAdX!e(fBh;uc42KXU@1v4&_nD;EvI%Z3k{rW%WdbCNABR8H2aXi@T?@~gH
zFy_4<uln*<#4zm?FPJqX$qk<LE-cB=tbu_I`~bvrVA8@kNk;$x002ovPDHLkV1k)L
Bk)Qwo

diff --git a/app/images/runningwave@2x.png b/app/images/runningwave@2x.png
index d20f942fceaa8a2035e0d3db49bf585a258bb370..cfda2c62a470c91776846229241e9ad3dba1fdbc 100644
GIT binary patch
delta 588
zcmV-S0<-;&1@Z)tF@G#cL_t(o3GJ0lNK{c6hTn6?F)axp22l`YQX<;uB89+(i$L6l
zA`FB&jzY^ewhSQ@qrzQC4!EdI8(qkNfx7VrQHWd^#5glMe-NA)f0}9T>Aix3j`vb?
z$sqX7a5-nbzw@5weuoRl5CTF#2nYcoAOwWK|4cwRiSPZ2Dt}K2nzcd`H10F5S}FLr
zz77R1=adHaX;1K(GqZ?<Z)44=o?H6`fgMXIy;+G)L!qA{9u!(sYb;Xq@I)<U3e9zj
zKNZ;X4L*+-gA59iQn^!b0ruH+8c!zc5iKCcHdOV+F+^HVsq}_zgi9l7p70rp#_@8Y
z6+c~;feIzqO@B6nMy)iKO<;xdYSzF;_6R$BMMy>7BNGUq%xj>+<3S4#_lV@%ZOVWm
zKWh^M6Mn4P`JHUtF_aVm&n^qp*yY6tQ}+0~TEv_R<l93rG-v~(6#FpWXC0QmDbvK;
zupgi3w}oQm@r~XkkS=N%;GrvW0(sJHX1(}+i1Cm2kblnK<WK*H;s~(Lo6{R_lf->?
zc!)K&)fc*xl$xO!AJ=}ao0(U0KF#XEV;Wv14>3Yvsq;>^>&Kh8Ra}ZOZWeG`<19}F
zw@}0WNSqn|=G+@cs{y>G&<0m^HIk%#^&=QVn=;VD&8&-5_M07#_^RjG0@Ei4`0!5z
z<^(;5(M8vdJM7U$3aH~{xJCiR>_O|Rv}I~Uw=-Ce)Z<4kM;1ar2nYcoAOwVf5D)@a
aN#GaSexM9A_t44!0000<MNUMnLSTaHR}a<z

delta 616
zcmV-u0+;>r1daueF@H!&L_t(o3GGxpXcSQp{$_7;qUMwo7k@w$6*LhM^ia^sQbZKf
zh_xUlK}3+Gu!z{Gpu)-Bil9xvLQ92|7LgE)h(uz}6c&nw%84Nt6TI9Tza<gk`c`ur
z6aw!x``*kqGvE7W-U4np1)Ks-0jGddz$xGqSjq~>g2)ftSbvU;zaA++3r|)+(EypL
zKv0H$`+)6T6AQ|d0AwflBA>-d|ELG-Q(!Mdb`Y4d<)^;}=#VP<FfF&S>&zz`E~#xk
zK|v`v=m}1<=rIwb>rKkIX;IuWlhq#VKKr@ecpE+>NMeOH@w`hswAw)R+NkCig?3?E
z`(4J8ck(6jCVv>BTDd=^U<KCGcf89-Zo}EDLZuO+YXq`2E>>0h)tFOg=^Ts0{KYQf
zjRn>l()e0o?vvOcCMwU7>mIiz8!4=XFKtx+f{1L4Vwfjv`xR53x`zGdr=tGYbLrLr
zk<|5H2r^lX$sQPJ!1naV2HPA@dVH*F?qoMElW1cU5`VUxzFt$)UQE6mM($2Eior;}
z6@J4ZUiQS#uFfN<4^7QnTtqu&>%A&$khBCOdH6R1a|V+A&h02iWt_u9qMGG-v+ZJ>
z!QwMDdJZie191rx*++{fC54-u(dI<)b3wDOc#$tHmcU?smDl8Vt4KQwt&YW69DJ3A
z=Eotye__8$S2K{zan98dzWzP@Zn706sjvJ~JXJM)9D+yK+427W5R9@JE;b=u+d}g)
zz)N!$D=_+&^Iwia-PtMN6mSYS1)Ks-0jI#yR^SJoPqV(OG&^np0000<MNUMnLSTYK
Cf+RKo

diff --git a/app/styles/containers.less b/app/styles/containers.less
index a8944625bd..ae3c8b6cad 100644
--- a/app/styles/containers.less
+++ b/app/styles/containers.less
@@ -210,12 +210,6 @@
           }
         }
       }
-
-      .status {
-        font-size: 12px;
-        font-variant: small-caps;
-        color: @brand-primary;
-      }
     }
 
     .details {
@@ -232,7 +226,7 @@
         flex: 0 auto;
         display: flex;
         flex-direction: row;
-        padding: 0px 45px 14px;
+        padding: 4px 40px 10px 40px;
         position: relative;
         a {
           position: absolute;
@@ -240,16 +234,18 @@
           top: -4px;
         }
         h1 {
-          font-size: 24px;
+          margin: 0;
+          font-size: 20px;
           margin: 0;
         }
         h2 {
-          margin-left: 18px;
-          font-size: 14px;
-          font-variant: small-caps;
+          margin: 6px 0px 0px 16px;
+          font-size: 10px;
+          text-transform: uppercase;
 
           &.status {
-            color: @brand-success;
+            font-weight: bold;
+            color: @brand-positive;
           }
 
           &.image {
diff --git a/app/styles/variables.less b/app/styles/variables.less
index e11e816a84..1aa67787dd 100644
--- a/app/styles/variables.less
+++ b/app/styles/variables.less
@@ -1,4 +1,4 @@
 @brand-primary:         #24B8EB;
-@brand-action:          #49CEF2;
-@brand-positive:        #3AD86D;
-@brand-negative:        #F74B1F;
+@brand-action:          #24B8EB;
+@brand-positive:        #65E100;
+@brand-negative:        #F47A45;