From 228fd806889e0dba7fe108ece5e8053656bafce0 Mon Sep 17 00:00:00 2001 From: Alberto Garcia Cabeza Date: Thu, 6 Aug 2015 11:18:56 +0200 Subject: [PATCH 1/5] Updates icons font --- app/assets/fonts/icons.eot | Bin 4228 -> 3948 bytes app/assets/fonts/icons.svg | 13 ++++++------- app/assets/fonts/icons.ttf | Bin 4072 -> 3792 bytes app/assets/fonts/icons.woff | Bin 2976 -> 2828 bytes app/assets/stylesheets/icons.scss | 17 +++++++---------- 5 files changed, 13 insertions(+), 17 deletions(-) diff --git a/app/assets/fonts/icons.eot b/app/assets/fonts/icons.eot index 9d0c2321a0b6e9d6e323eb948c65f9d7b2569d95..456f00160aa062fcaf6138237a1e33ca2140cbfe 100644 GIT binary patch delta 1411 zcmZXUU1%It6vxlGpYyddv%531N!x6a-R`b5ADZ1{HxjJ{(?r{9OZ-5IRMyy5Xp)8| zLIlYosQ92@9g%atKFM#_M0PLHdJUj&xpvZok?7riV+*v*T z&r@Fj;1gs&KDW?Z>iRo-p6s8fA34)pUfSLUPV-+Uzj0>%h0`O0!8!mx1Yo}Z+^OcX z;^xuq*vFpMx423%lneIHpPOqsZ<*iIygst?3(eIfcnsbo|2Wxwi_L{oU!ETP9l+Tn z?d;OI>R49*)HtN-0 ztcHOeQMz8MMq!|8ZGE)%KSxd#%f$)>)kf-#qADiyIx)GTuIzYP^+sX03okQoYu#hq zov^eihkkMS){joQfDBz^fn?H3`FE4Rup^){Q{EKPhx}Q^I3wFmB05qaQ80=j2|xAy ztxdP6Eo0DK$@t|Q;xi^^=w#8gY_Fr39GM-og%YBPjCU+Q>s2Tq5jyh|At@Ip{(#qU z15(hR(8~r|6_SG!tz49gKd`f{5~0#+0P`4;+$|W!G$3m z+c7N3nIM62u5_eB*U;@)RmlszuiGz`Gih#1AySC5hM=@MNiN>qpyX2N4NdFnkxX~a zOQS?3kZZxDV>vbo#gt)4gBIhKB`qqZ(UNE=t@U1WkH>c6Qx-BMSrFx|bjAw;Ylmft zSY8JU@~{k0AFY%NS_QeN+UO9xO=JQIt_*Y(5)WcXeEa8}t z(RzbWCasnfhU$Pc1W}GMyXc{!uco(pR%(ZiDgANU>WoRp7v>C|7-u|zDIuiI)0uK9 z49sryGyBa14L7xiku*XnP;h$ZxDvu7)&zoy7O|#6P%{`(O-@98t3Iuetn<-Eo4wxX zl&>q}SV7j$_*P#K38s{Ci2m2K2bRV?+U^o2bC@lJOKgQC$Wk+t{szoswq*;O`^nnv zs|g%iWJ{@3-pdE#kCK$W`y0=vZgZUp{kgZu#)!$9+P)ZwMikM|MB-FqtI+?F(qv=J(yz zp8xBqPYHqjXg_&)d0}Pb`j!)De~HLvezT?|#1a;O3r^Y~D`0!3CJ+ z9(jvcgP-6492@MU(_WJ_$ruT+^sth_3Y|vJd-PRs2lucy2ES8XoFb2tm&u3Fqa7yL zLAGY?w0_|SFa5xNq5+CtH=RoM?AD-B8BSu!d4>gZe~kqSep(`_mJ40WRo1 z0N8Y9+UZ`1P6s`~ZOMh;(&jL49B0vSm8wX_Evc0Qz^GuBu$i=|vZPWVEI|bqmKJoj zRquk$Irk{zN{WWd4CF^fwl>S@*Gq+BSwj?Cu^kyd#M7PXlWno0Zvx(Wakn8l*IwXlrJ8RbM=EABX^94Z}$mR%`M z#znz#FYT{-+SvU@n3wf1K(Gqqu~IdTFdCZ}99Q59N^*d_Nl5T7NqA~)<~Cy(d6abz z8zEh&BfTg|%Hc+-!Wi5fx3dL1P~A?qpGlE2jmnN^lBBX^B{escNuekZ?wG($5&xr$ zkcuq;!r7LdpXzkb0Qx$Y@@wZUmN2H5yz8I ztk_lGN^!-}#P_I}6avMPE|6naCCqblh_;#8?@;FW~=4?NRdU355-`0ESki3^} zy5$t+H_}c2{pM}bnD{3uhVxP+5T?(+IK1YaLDzl1*uz`pa)lr%)q?c73YlJa$%+wZU - - - - - - - + + + + + + diff --git a/app/assets/fonts/icons.ttf b/app/assets/fonts/icons.ttf index 787788696608e9e3151139fa5341e70a68bc0b69..c6e67d6def01ce6afb0a0c7a1bcba44ba2fe8399 100644 GIT binary patch delta 1467 zcmZWpO>7%g5T1Fz`{&)Yyn1wooXe`pB*3Mw)oZKO7BL~;n1 znj9i=010Y@D$xT64sfelP~Zrna6zJ#Kmrv|xc~xj=z#+u5@y$_K*G;&cjucoGjG0m zZ+`B(wyO;Y010>zI80AYK6-Sya{X@r_dP;)PE8z~gmF+LzfN-hu}Ah+kNx%ZB>;Sq zFO%LldHRJDBSXOj0Ddok`PRaG>pAh;;VsgA zOS7@CFyC&8y-bpEK)}Gl;>xQ22v|Dz^Z+=1!`bo|$wpN$mF?f~qVJZq1025>U@nALKS$*1Cf-Y}s+Kp!Zzbd@Syv++9 z7$viT2kp+@TE8*Wo0K+bT%1n5ZNI%l272}L#JF@6PfkeT`h9G>` z_cw341#KBa?n=rpWf7k>IYTFnu4Q{&#N^2AAO?zvCNkcY{Ipjlg9zxZkASEuoM;EU zfg5x#cSr1{1FiB=;>1=q%yw>B>2{H*(rOTMm?0>~GGR8{g@KD1rMCwWRHjiMX7%_Z z63XOfKawLVKqDICNQOF|I+&HpRWg1IORZ)MsgyKkl$LnE=O;7Mv{&MZbKd5h=wN~i zLpru&SdueA0OMTgP-k32$F{1R6MAQ_Uo54P+?GNl5N8cRZgu2bytzTnrP3Rk;_8u9 zZ`MnqL?w`G!K7n3HVVa*VMv35am$hx71L--G?do*4s(acw(S!ZG9_6M=B#AO3j%AK z%OY`k11!kFGF`gSaw)G>kPWNNE`zrj8Al>l20F|TAH*TeLClwju|T{PZm()qn+LGj zXvgf0Hkw3bG-^>{s18VvAk30y7d=$;*L139rFJMy>5tJ?XG}_8m@||y&UgY7LP(n@ zQ>9`iFniHY4VV!%+|(Y1(#S}Gg43DfN(hsQjU$&f6O? z_j;pSzMhn01!+I!Tm3;Om{Q6i_CKIKuq5u#c8@Tb!)zg3;#No^S!!m|HDD&QEnC>! zk7CCi2po7LZYmw_{)qL?FYcX2y)ss*?i;ChroEsu>^(8(67L9%?*2iTgeiCc9)v@1 v7>>YEcqlsHfYc>f>?c~=6JwFg>BJ)llDmB>>do-Q@lXGZ-v2hO^|gNhQ&Pqt delta 1680 zcma)6O^6&t6s}j*Rn=8B{WCq?Jv*6SXJ=+N8$x6@nTcj2%Mw=<%!VXN5(FKxNfyjb zmLx&~!stO1@t_V$1P>n6L-e4Dus6MU(8Ys_g0PAgk$|v=1wqUqzMk1lqTmv$>vg@K zdfo5)Ue&k78|5AWLWo0NAdDQEojv;ah4GJigm~YeweZM+hiAzY5vYHRdS&j&uIAj$ zr#>YFj-meK$;Hmn$lv#!NBt+9kDcjUSh{r!GZF87^xJ37UOs)g_TY1bumgnX&lXN~ z=B*p`7t!}K&ep=hsb0t0MLBK`(NJ4hym(2z3ZJ9?3F?ir=T3H<6~BN9YN%HhJC~No z6XYHA?@jb>XYtgv`H4TUg1^xA?9#al7vU@T0)Jp0{nLZuu)vpoeDCF_y{SKmp=c)L zyWiGlhHtt)^Cs-)9(kKs{TVn8XZ!EMPOnbtq)Y-FU7V!<1MEZ(rLTb7e}i7>AEF{V zL5`B=$%oLTEhg9rwqotIe&;8yPqSZWk70s3tm5Y!a*Vu=#qJ(!j8>%xv+-oJT}N#P z>~6RABxWH8!vhzFtD)Qh(PT4j##tPb_{965iSez$uEEZ+X1mo6WgHD>D8&w_jy1*_ zy}^5b@`ZhX8`=*6iq>Q^$%WC$qAR#9xe#319OjJU%sZ}91L$70ePglNME$ zR0@P8sNllVf=)H6ZLm4#9%WofQFEDr^vKBedOjacjQ03p&uFdvgQn2 zJC4bRO2?sP7qa7VR&dOv{bf%ZyH^X-vKj^$tirgQE5#AEWgUBD6;_dwAk{sb>!t;veppOI@?=T;&mhz>__G~TxZA|Ua9uu{wygGi_F?9_$iaa_cnv;83I z#+6FErT6-m;sJVBl@oZMk#_R$o7E&eal0#qb}5PwCdWTJEc4z%*L*+Q#i~-NOi;{K zg56`jKZ?MF6FmHfnyM@n#~2$s!U?v+Ku<-uc>vI?0@f! cqrB;y2e03Ci!j%J4W-+^>gLVun|OWZ9}>&sy8r+H diff --git a/app/assets/fonts/icons.woff b/app/assets/fonts/icons.woff index a6676b0db6661734ebff5c7b85e79c5e08539df7..a0a43bada8bf54fc9c7473fb8b84ebafdb2aacd2 100644 GIT binary patch delta 2687 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 delta 2836 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 Date: Thu, 6 Aug 2015 11:19:13 +0200 Subject: [PATCH 2/5] Creates new sass for variables --- app/assets/stylesheets/variables.scss | 45 +++++++++++++++++++++++++++ 1 file changed, 45 insertions(+) create mode 100644 app/assets/stylesheets/variables.scss diff --git a/app/assets/stylesheets/variables.scss b/app/assets/stylesheets/variables.scss new file mode 100644 index 000000000..79de3eaf9 --- /dev/null +++ b/app/assets/stylesheets/variables.scss @@ -0,0 +1,45 @@ +// Table of Contents +// +// 01. Fonts +// 02. Colors +// + +// 01. Fonts +// - - - - - - - - - - - - + +$font-family-sans-serif: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; +$line-height: rem-calc(24); + +// 02. Colors +// - - - - - - - - - - - - + +$background: #EDEFF0; +$border: #DEE0E3; +$brand: #0077B9; + +$debates: #008CCF; + +$comments-bg: #F1F1F1; +$comments-info: #A5B2B9; +$comments-text: #3F4549; + +$header-color: #292B33; +$link: #0077B9; + +$tags-bg: #FAFAFA; +$tags-border: #F0F0F0; +$tags-color: #8F8F8F; + +$text-color: #222222; +$text-medium: #999999; +$text-light: #A3A6AD; + +$votes: #31708f; +$votes-background: #0081B3; +$votes-border: #005b80; +$votes-like: #7BD2A8; +$votes-like-act: #5D9E7F; +$votes-neutral: #CCCCCC; +$votes-text: #FFFFFF; +$votes-unlike: #EF8585; +$votes-unlike-act: #BD6A6A; \ No newline at end of file From 77ecf398527a0efc7ea70f487627f53edc448d70 Mon Sep 17 00:00:00 2001 From: Alberto Garcia Cabeza Date: Thu, 6 Aug 2015 11:19:37 +0200 Subject: [PATCH 3/5] Updates styles for debates index --- app/assets/images/truncate.png | Bin 0 -> 1160 bytes app/assets/stylesheets/debates.scss | 425 ++++++++++---------- app/views/debates/_debate.html.erb | 61 +-- app/views/debates/_featured_debate.html.erb | 70 ++-- app/views/debates/index.html.erb | 2 +- 5 files changed, 286 insertions(+), 272 deletions(-) create mode 100644 app/assets/images/truncate.png diff --git a/app/assets/images/truncate.png b/app/assets/images/truncate.png new file mode 100644 index 0000000000000000000000000000000000000000..799bcef4da78f2675faf0246c95f12f830c9733a GIT binary patch literal 1160 zcmeAS@N?(olHy`uVBq!ia0vp^5+KaM1|%Pp+x`Gjk|nMYCBgY=CFO}lsSJ)O`AMk? zp1FzXsX?iUDV2pMQ*9U+m^Cs(B1$5BeXNr6bM+EIYV;~{3xK*A7;Nk-3KEmEQ%e+* zQqwc@Y?a>c-mj#PnPRIHZt82`Ti~3Uk?B!Ylp0*+7m{3+ootz+WN)WnQ(*-(AUCxn zQK2F?C$HG5!d3}vt`(3C64qBz04piUwpD^SD#ABF!8yMuRl!uxOgGuU%v{0TQqR!T z+}y-mN5ROz&{W^RSl`${*T~q)#K6kLNC66zfVLH-q*(>IxIyg#@@$ndN=gc>^!3Zj z%k|2Q_413-^$jg8E%gnI^o@*kfhu&1EAvVcD|GXUm0>2hq!uR^WfqiV=I1GZOiWD5 zFD$Tv3bSNU;+l1ennz|zM-B0$V)JVzP|XC=H|jx7ncO3BHWAB;NpiyW)Z+ZoqGVvir744~DzI`cN=+=uFAB-e&w+(vKt_H^esM;Afr7I$IMft0d=ry1 z^FV@{U|qhxR-SpqC5d^-sh%#jN*Q ziwjQkpn6kqy2a8Jr(S)aWAs7Mixk~3Az&H;G2w|9$bl#S)I4CCF9Ig+tuyyT12e`q zPZ!6Kid$QzSo0k+;As=)RI}Q&(WscAERFAg=*^jtkvDHxbe@do6zO?;L$_08t7lGq zXZ*~Lpz{;C6K+ZyR6IGggfm?^A(pe?q0XF->s6-T%VsdUnr7R<`MG}I^p@_P23=); zS(TfN3FenABE?w}^ldgSU9t0}yLdzM0+nBvCHs#g7nG#=?_gQLejqbVc1BUR5&O~a zx8hz1nJzf}fPrgCj`rj$;uVU^9%?i&UH!+(mhkjMzW;-xP0q9CMLP*wy*|#yAg+9O z%b)XIzdc^LUbhzsxfa8A;A}?5!fgs`8Fy%x6dgOdhMz(1;32M)OdsCd)QV%`VaRTs VP^xu5<}9de@O1TaS?83{1ON+Ug~$K^ literal 0 HcmV?d00001 diff --git a/app/assets/stylesheets/debates.scss b/app/assets/stylesheets/debates.scss index 9e991d89b..112e0120c 100644 --- a/app/assets/stylesheets/debates.scss +++ b/app/assets/stylesheets/debates.scss @@ -1,8 +1,6 @@ // Table of Contents // // 01. Variables -// 01.1. Fonts -// 01.2. Colors // 02. Global styles // 03. Header // 04. Footer @@ -19,43 +17,7 @@ // 01. Variables // - - - - - - - - - - - - - - - - - - - - - - - - - -// 01.1. Fonts -// - - - - - - - - - - - - - -$font-family-sans-serif: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; -$line-height: rem-calc(24); - -// 01.2. Colors -// - - - - - - - - - - - - - -$background: #E9E9E9; -$border: #DEE0E3; -$brand: #0077B9; - -$debates: #008CCF; - -$comments-bg: #F1F1F1;//FAF9F8; -$comments-info: #A5B2B9; -$comments-text: #3F4549; - - -$header-color: #292B33; -$link: #0077B9; - -$tags-bg: #FAFAFA; -$tags-border: #F0F0F0; -$tags-color: #8F8F8F; - -$text-color: #222222; -$text-medium: #999999; -$text-light: #A3A6AD; - -$votes: #A0AEC4; -$votes-background: #F0F0F0; -$votes-border: #D8D8D8; -$votes-unlike: #EF8585; -$votes-like: #7BD2A8; -$votes-text: #54627C; +@import "variables"; // 02. Global styles // - - - - - - - - - - - - - - - - - - - - - - - - - @@ -66,19 +28,15 @@ $votes-text: #54627C; } body { - background: white; + background: $background; font-family: $font-family-sans-serif; font-size: rem-calc(13); font-weight: normal; text-rendering: optimizeLegibility; } -.row { - max-width: 1170px; -} - -.row-full { - max-width: 100% !important; +.button { + padding: rem-calc(15) rem-calc(32); } .clear { @@ -89,6 +47,14 @@ body { display: inline-block; } +.row { + max-width: 1170px; +} + +.row-full { + max-width: 100% !important; +} + ::selection, ::-moz-selection { background: $brand; color: white; @@ -126,6 +92,7 @@ header { .button { color: white; + font-family: inherit; margin-top: $line-height*2; } } @@ -195,200 +162,249 @@ header { // 05. Debates // - - - - - - - - - - - - - - - - - - - - - - - - - -aside { - .button { - margin-top: $line-height; - } -} - // 05.1. Debates Index // - - - - - - - - - - - - -.debates-list { - margin-top: $line-height; -} - .debates-featured { + margin-bottom: rem-calc(34); + margin-top: rem-calc(23); - .debate { + .panel { + background: white; + border: 1px solid; + border-color: #e5e6e9 #dfe0e4 #d0d1d5; + border-radius: rem-calc(3); + margin-bottom: $line-height; + padding: rem-calc(24) rem-calc(12) 0 rem-calc(12); - .panel { - background: white; - box-shadow: 0 2px 0 rgba(0,0,0,.1); - padding: rem-calc(20) rem-calc(20) 0 rem-calc(20); + .debate-content { + min-height: $line-height*14.71; + } - .debate-content { - min-height: $line-height*11; - } + .label { + background: none; + clear: both; + color: $debates; + display: block; + font-weight: bold; + text-transform: uppercase; + padding-left: 0; + padding-top: 0; + } - .label { - background: none; + .icon-comment-quotes { + color: $debates; + font-size: rem-calc(36); + line-height: $line-height; + position: absolute; + right: rem-calc(18); + top: rem-calc(24); + } + + h3 { + font-weight: bold; + margin: rem-calc(8) 0 0 0; + min-height: rem-calc(65); + + a { clear: both; - color: $debates; + color: $header-color; display: block; - font-weight: bold; - text-transform: uppercase; - padding: 0; - } - - .icon-quote-right { - color: $debates; - font-size: rem-calc(30); + font-size: rem-calc(16); line-height: $line-height; - position: absolute; - right: $line-height; - top: $line-height/2; } + } + + .debate-info { + color: $text-light; + font-weight: lighter; + margin-bottom: 0; .icon-chat-bubble-two { - vertical-align: middle; - } - - h3 { - margin: rem-calc(12) 0 0 0; - font-weight: bold; - - a { - clear: both; - color: $header-color; - display: block; - font-size: rem-calc(16); - line-height: $line-height; - } - } - - .debate-info { - color: $text-light; - font-weight: lighter; - margin-bottom: 0; - - .icon-chat-bubble-two { - font-size: rem-calc(16); - } - } - - p { - color: $text-color; - font-size: rem-calc(13); - line-height: $line-height; - margin-bottom: $line-height/2; + font-size: rem-calc(16); + vertical-align: top; } } - .votes { - border-top: 1px solid $votes-border; - padding: $line-height/2 0; + .debate-description { + color: $text-color; + font-size: rem-calc(13); + height: $line-height*6.5; + line-height: $line-height; + margin-bottom: $line-height/2; + margin-top: $line-height; + overflow: hidden; + position: relative; + } - .icon-like { - background: $votes-background; - border: 1px solid $votes-border; - border-radius: rem-calc(3); - color: $votes; - display: inline-block; - font-size: rem-calc(30); - line-height: rem-calc(30); - padding: rem-calc(6) rem-calc(12); - //when active => color: $votes-like; + .truncate { + background: url('truncate.png'); + background-repeat: repeat-x; + bottom: 0; + height: 24px; + position: absolute; + width: 100%; + } - &:hover { - background: white; - color: $brand; - } - } - - .icon-unlike { - background: $votes-background; - border: 1px solid $votes-border; - border-radius: rem-calc(3); - color: $votes; - display: inline-block; - font-size: rem-calc(30); - line-height: rem-calc(30); - padding: rem-calc(6) rem-calc(12); - //when active => color: $votes-unlike; - - &:hover { - background: white; - color: $brand; - } - } - - .like { - line-height: rem-calc(48); - vertical-align: super; - - span { - color: $votes-text; - display: inline-block; - font-size: rem-calc(18); - font-weight: bold; - line-height: $line-height*2; - padding-left: rem-calc(6); - vertical-align: top; - } - } - - .unlike { - @extend .like; - } - - .total-votes { - color: $votes-text; - line-height: $line-height*2; - } - - .divider { - margin: 0 rem-calc(3); - } + p { + color: $text-color; + font-size: rem-calc(13); + line-height: $line-height; + margin-bottom: $line-height/2; } } + + .votes { + border-top: 1px solid $votes-border; + padding: rem-calc(14) rem-calc(12); + background: $votes-background; + margin: 0 -12px; + + .icon-like { + background: white; + border: 2px solid white; + border-radius: rem-calc(3); + color: $votes-neutral; + display: inline-block; + font-size: rem-calc(30); + line-height: rem-calc(30); + padding: rem-calc(3) rem-calc(6); + position: relative; + //when active => color: $votes-like; + + &:hover { + background: $votes-like; + color: white; + cursor: pointer; + } + + &:active { + border-color: $votes-like-act; + } + } + + .icon-unlike { + background: white; + border: 2px solid white; + border-radius: rem-calc(3); + color: $votes-neutral; + display: inline-block; + font-size: rem-calc(30); + line-height: rem-calc(30); + padding: rem-calc(3) rem-calc(6); + position: relative; + //when active => color: $votes-unlike; + + &:hover { + background: $votes-unlike; + color: white; + cursor: pointer; + } + + &:active { + border-color: $votes-unlike-act; + } + } + + .like { + line-height: rem-calc(48); + vertical-align: super; + + span { + color: $votes-text; + display: inline-block; + font-size: rem-calc(16); + font-weight: lighter; + line-height: $line-height*2; + padding-left: rem-calc(8); + vertical-align: top; + } + } + + .unlike { + @extend .like; + } + + .total-votes { + color: $votes-text; + float: right; + line-height: $line-height*2; + } + + .divider { + margin: 0 rem-calc(6); + } + } +} + +.debates-list { + margin-bottom: $line-height*2; } .debates-index { @extend .debates-featured; + margin-bottom: 0; + margin-top: 0; - .debate { - margin-bottom: rem-calc(6); + .panel { + margin-bottom: 0; + min-height: $line-height*8; + padding: 0 rem-calc(12) rem-calc(2) rem-calc(12); - .panel { - border: 0; - box-shadow: none; - margin-bottom: 0; - padding: 0 rem-calc(6); + &:first-child { + padding-top: $line-height; + } - p { - text-align: justify; - } + .label { + line-height: $line-height; + padding-bottom: 0; + } - .debate-content { - min-height: 0; - } + h3 { + margin-top: 0; + min-height: $line-height*2; + } - .icon-quote-right { - font-size: rem-calc(14); - position: initial; - vertical-align: bottom; - } + p { + text-align: justify; + } - .label { - line-height: $line-height; - margin-right: rem-calc(5); + .debate-content { + margin: 0; + min-height: 0; + + .tags { + display: block; } } - .votes { - border: 0; - margin-top: $line-height; + .icon-comment-quotes { + font-size: rem-calc(18); + left: rem-calc(60); + top: 0; + } - .like { + .debate-description { + height: $line-height*3; + margin-top: 0; + } + } - span { - color: $votes-text; - display: block; - font-size: rem-calc(18); - font-weight: bold; - line-height: $line-height*1.5; - } + .votes { + border: 0; + + .total-votes { + float: none; + line-height: $line-height; + display: block; + } + + .like { + + span { + color: $votes-text; + display: block; + line-height: $line-height/2; } } } @@ -610,6 +626,7 @@ aside { color: $tags-color; display: inline-block; font-size: rem-calc(13); + line-height: rem-calc(22); margin-bottom: rem-calc(8); margin-right: rem-calc(8); padding: 0 rem-calc(6); diff --git a/app/views/debates/_debate.html.erb b/app/views/debates/_debate.html.erb index f37f1c5bc..adebe128c 100644 --- a/app/views/debates/_debate.html.erb +++ b/app/views/debates/_debate.html.erb @@ -1,39 +1,40 @@ -
-
-
-
-
-
- <%= t("debates.debate.debate") %> - -

<%= link_to debate.title, debate %>

-

-  <%= pluralize(debate.comment_threads.count, t("debates.debate.comment"), t("debates.debate.comments")) %> -

+
+
+
+
+
+ <%= t("debates.debate.debate") %> + +

<%= link_to debate.title, debate %>

+

+  <%= pluralize(debate.comment_threads.count, t("debates.debate.comment"), t("debates.debate.comments")) %> +

+
<%= debate.description %> - <%= render "shared/tags", debate: debate %> +
+ <%= render "shared/tags", debate: debate %>
-
-
- <%= link_to debate_votes_path(debate, value: 'yes'), class: "like inline-block", title: t('votes.agree'), method: "post" do %> - - <%= percentage('likes', debate) %> - <% end %> +
+
+
+ <%= link_to debate_votes_path(debate, value: 'yes'), class: "like inline-block", title: t('votes.agree'), method: "post" do %> + + <%= percentage('likes', debate) %> + <% end %> - + - <%= link_to debate_votes_path(debate, value: 'no'), class: "unlike inline-block", title: t('votes.disagree'), method: "post" do %> - - <%= percentage('dislikes', debate) %> - <% end %> -
- - <%= pluralize(debate.total_votes, t("debates.debate.vote"), t("debates.debate.votes")) %> - -
+ <%= link_to debate_votes_path(debate, value: 'no'), class: "unlike inline-block", title: t('votes.disagree'), method: "post" do %> + + <%= percentage('dislikes', debate) %> + <% end %> + + + <%= pluralize(debate.total_votes, t("debates.debate.vote"), t("debates.debate.votes")) %> +
-
+
\ No newline at end of file diff --git a/app/views/debates/_featured_debate.html.erb b/app/views/debates/_featured_debate.html.erb index 6f74b0ed7..20d63fdd0 100644 --- a/app/views/debates/_featured_debate.html.erb +++ b/app/views/debates/_featured_debate.html.erb @@ -1,41 +1,37 @@ -
-
-
- <%= link_to debate_votes_path(debate, value: 'yes'), class: "like inline-block", title: t('votes.agree'), method: "post" do %> - - <%= percentage('likes', debate) %> - <% end %> +
+ <%= link_to debate_votes_path(debate, value: 'yes'), class: "like inline-block", title: t('votes.agree'), method: "post" do %> + + <%= percentage('likes', debate) %> + <% end %> +
- <%= link_to debate_votes_path(debate, value: 'no'), class: "unlike inline-block", title: t('votes.disagree'), method: "post" do %> - - <%= percentage('dislikes', debate) %> - <% end %> +
+ <%= likenk_to debate_votes_path(debate, value: 'no'), class: "unlike inline-block", title: t('votes.disagree'), method: "post" do %> + + <%= percentage('dislikes', debate) %> + <% end %> +
<%= pluralize(debate.total_votes, t("debates.debate.vote"), t("debates.debate.votes")) %> diff --git a/app/views/debates/_featured_debate.html.erb b/app/views/debates/_featured_debate.html.erb index 20d63fdd0..28f66be96 100644 --- a/app/views/debates/_featured_debate.html.erb +++ b/app/views/debates/_featured_debate.html.erb @@ -16,17 +16,21 @@
- <%= link_to debate_votes_path(featured_debate, value: "yes"), class: "like", title: t('votes.agree'), method: "post" do %> - - <%= percentage('likes', featured_debate) %> - <% end %> +
+ <%= link_to debate_votes_path(featured_debate, value: "yes"), class: "like", title: t('votes.agree'), method: "post" do %> + + <%= percentage('likes', featured_debate) %> + <% end %> +
- <%= link_to debate_votes_path(featured_debate, value: "no"), class: "unlike", title: t('votes.disagree'), method: "post" do %> - - <%= percentage('dislikes', featured_debate) %> - <% end %> +
+ <%= link_to debate_votes_path(featured_debate, value: "no"), class: "unlike", title: t('votes.disagree'), method: "post" do %> + + <%= percentage('dislikes', featured_debate) %> + <% end %> +
<%= pluralize(featured_debate.total_votes, t("debates.debate.vote"), t("debates.debate.votes")) %> diff --git a/app/views/debates/show.html.erb b/app/views/debates/show.html.erb index 765ede640..fcb7bdb6c 100644 --- a/app/views/debates/show.html.erb +++ b/app/views/debates/show.html.erb @@ -10,9 +10,10 @@ <%= @debate.description %>

<%= render 'shared/tags', debate: @debate %>

-
- <%= render 'votes/votes' %> +
+

<%= t("votes.supports") %>

+ <%= render 'votes/votes' %> <%= link_to t("debates.show.leave_comment"), "#comments", class: "leave-comment" %>
diff --git a/app/views/votes/_votes.html.erb b/app/views/votes/_votes.html.erb index b88de32a9..8f6bbd9fc 100644 --- a/app/views/votes/_votes.html.erb +++ b/app/views/votes/_votes.html.erb @@ -1,25 +1,21 @@ -
-

- <%= pluralize(@debate.total_votes, t("debates.debate.vote"), t("debates.debate.votes")) %> -

- -

<%= t("votes.supports") %>

- -
-
- <%= link_to debate_votes_path(@debate, value: 'yes'), class: "like", title: t('votes.agree'), method: "post", remote: true do %> - - <%= percentage('likes', @debate) %> - <% end %> -
- - - -
- <%= link_to debate_votes_path(@debate, value: 'no'), class: "unlike", title: t('votes.disagree'), method: "post", remote: true do %> - - <%= percentage('dislikes', @debate) %> - <% end %> -
+
+
+ <%= link_to debate_votes_path(@debate, value: 'yes'), class: "like", title: t('votes.agree'), method: "post", remote: true do %> + + <%= percentage('likes', @debate) %> + <% end %>
+ + + +
+ <%= link_to debate_votes_path(@debate, value: 'no'), class: "unlike", title: t('votes.disagree'), method: "post", remote: true do %> + + <%= percentage('dislikes', @debate) %> + <% end %> +
+ + + <%= pluralize(@debate.total_votes, t("debates.debate.vote"), t("debates.debate.votes")) %> +
\ No newline at end of file From 56f480d5c0abcca8ff5e01cbb20b7b495cd61666 Mon Sep 17 00:00:00 2001 From: Alberto Garcia Cabeza Date: Thu, 6 Aug 2015 12:53:19 +0200 Subject: [PATCH 5/5] Improves CSS styles for votes --- app/views/debates/_debate.html.erb | 6 +++--- app/views/debates/_featured_debate.html.erb | 4 ++-- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/app/views/debates/_debate.html.erb b/app/views/debates/_debate.html.erb index 45775eb37..3125b72c3 100644 --- a/app/views/debates/_debate.html.erb +++ b/app/views/debates/_debate.html.erb @@ -18,7 +18,7 @@
-
+
<%= link_to debate_votes_path(debate, value: 'yes'), class: "like inline-block", title: t('votes.agree'), method: "post" do %> <%= percentage('likes', debate) %> @@ -27,8 +27,8 @@ -
- <%= likenk_to debate_votes_path(debate, value: 'no'), class: "unlike inline-block", title: t('votes.disagree'), method: "post" do %> +
+ <%= link_to debate_votes_path(debate, value: 'no'), class: "unlike inline-block", title: t('votes.disagree'), method: "post" do %> <%= percentage('dislikes', debate) %> <% end %> diff --git a/app/views/debates/_featured_debate.html.erb b/app/views/debates/_featured_debate.html.erb index 28f66be96..0cc84c184 100644 --- a/app/views/debates/_featured_debate.html.erb +++ b/app/views/debates/_featured_debate.html.erb @@ -16,7 +16,7 @@
-
+
<%= link_to debate_votes_path(featured_debate, value: "yes"), class: "like", title: t('votes.agree'), method: "post" do %> <%= percentage('likes', featured_debate) %> @@ -25,7 +25,7 @@ -
+
<%= link_to debate_votes_path(featured_debate, value: "no"), class: "unlike", title: t('votes.disagree'), method: "post" do %> <%= percentage('dislikes', featured_debate) %>