From 75d31db0b5495c19bbfa3ae4596b32a08933e4de Mon Sep 17 00:00:00 2001 From: Loic Date: Tue, 17 Feb 2015 14:13:38 +0200 Subject: [PATCH] [#1049] UI fixes --- akvo/rsr/static/rsr/v3/css/src/main.css | 63 ++++++++++-------- akvo/rsr/static/rsr/v3/css/src/main.scss | 29 +++++--- akvo/rsr/static/rsr/v3/img/carretWhite.png | Bin 0 -> 1633 bytes .../static/rsr/v3/js/src/react-my-details.js | 2 +- .../static/rsr/v3/js/src/react-my-details.jsx | 2 +- akvo/templates/navigation/footer.html | 2 + akvo/templates/organisation_main.html | 2 +- akvo/templates/partials/project_footer.html | 4 +- 8 files changed, 64 insertions(+), 40 deletions(-) create mode 100644 akvo/rsr/static/rsr/v3/img/carretWhite.png diff --git a/akvo/rsr/static/rsr/v3/css/src/main.css b/akvo/rsr/static/rsr/v3/css/src/main.css index 50621553c0..056b262551 100755 --- a/akvo/rsr/static/rsr/v3/css/src/main.css +++ b/akvo/rsr/static/rsr/v3/css/src/main.css @@ -369,7 +369,8 @@ nav.navbar-fixed-top { nav.navbar-fixed-top .navbar-nav.navbar-right li a { padding: 10px 15px; } } nav.navbar-fixed-top .navbar-nav.navbar-right li a.active { - background: none; } + background: none; + color: #ff5500; } .navbar-inverse .navbar-collapse { border-color: #e4e4e4; } @@ -404,17 +405,17 @@ nav.navbar-fixed-top { background: rgba(255, 85, 0, 0.05) url(../../img/carret.png) 98% center no-repeat; background-size: 5px auto; } .myRsrMenu nav[role=navigation] ul li a.active { - color: #72742a; + color: #ff5500; font-weight: bold; - background: rgba(255, 85, 0, 0.05) url(../../img/carret.png) 98% center no-repeat; + background: rgba(255, 85, 0, 0.05) url(../../img/carretWhite.png) 98% center no-repeat; background-size: 5px auto; } #profile .usrAvatar { - background-color: rgba(32, 32, 36, 0.05); - padding: 10px; } + background-color: rgba(32, 32, 36, 0); + padding: 10px 0 10px 0; } #organisations { - background: rgba(255, 85, 0, 0.1); + background: rgba(255, 85, 0, 0.05); padding-bottom: 15px; -moz-border-radius: 5px; -o-border-radius: 5px; @@ -674,7 +675,7 @@ h4.detailedInfo { .main-list.projects ul li .projectLocation { color: rgba(32, 32, 36, 0.5); } .main-list.projects ul li:hover { - background: rgba(1, 1, 4, 0.05); + background: rgba(44, 42, 116, 0.15); border: thin solid rgba(44, 42, 116, 0.35); } .main-list.updates ul li { border: thin solid rgba(0, 167, 157, 0); @@ -699,7 +700,7 @@ h4.detailedInfo { .main-list.updates ul li .projectLocation { color: rgba(32, 32, 36, 0.5); } .main-list.updates ul li:hover { - background: rgba(0, 14, 13, 0.05); + background: rgba(0, 167, 157, 0.1); border: thin solid rgba(0, 167, 157, 0.35); } .main-list.organisations ul li { border: thin solid rgba(238, 49, 36, 0); @@ -728,7 +729,7 @@ h4.detailedInfo { background: rgba(238, 49, 36, 0.05); border: thin solid rgba(238, 49, 36, 0.15); } .main-list.organisations ul li:hover { - background: rgba(112, 15, 9, 0.05); + background: rgba(238, 49, 36, 0.1); border: thin solid rgba(238, 49, 36, 0.35); } .main-list.organisations ul li img { filter: gray; @@ -797,6 +798,7 @@ div.projectTopRow { position: relative; background: rgba(245, 245, 245, 0.5); margin-top: 1px; + margin-bottom: 20px; border-bottom: 1px solid rgba(32, 32, 36, 0.1); } div.projectTopRow #carousel { padding: 15px 0; @@ -902,23 +904,26 @@ div.projectTopRow { font-weight: normal; } div.timelineBlock { - margin: 15px auto 25px; } + margin: 15px auto 25px; + display: none; } div.timelineBlock #timeline { height: 200px; } -div.textBlock .panel { - border: 1px solid rgba(235, 235, 235, 0.5); } - div.textBlock .panel .panel-heading { - padding: 0; } - div.textBlock .panel .panel-heading .panel-title a { - display: block; - padding: 15px 15px; } - div.textBlock .panel .panel-collapse .panel-body { - background: rgba(44, 42, 116, 0); } -div.textBlock .udpateComponent { - padding-top: 10px; - padding-bottom: 15px; - background: #fff6f1; } +div.textBlock { + margin: 10px auto; } + div.textBlock .panel { + border: 1px solid rgba(235, 235, 235, 0.5); } + div.textBlock .panel .panel-heading { + padding: 0; } + div.textBlock .panel .panel-heading .panel-title a { + display: block; + padding: 15px 15px; } + div.textBlock .panel .panel-collapse .panel-body { + background: rgba(44, 42, 116, 0); } + div.textBlock .udpateComponent { + padding-top: 10px; + padding-bottom: 15px; + background: #fff6f1; } #project-footer { margin-bottom: -16px; @@ -978,10 +983,16 @@ div.textBlock .udpateComponent { background: rgba(32, 32, 36, 0.05); } .organisationDetail h1 { margin-top: 0; - margin-bottom: 20px; } + margin-bottom: 20px; + color: #ee3124; + padding-bottom: 10px; + border-bottom: 1px solid rgba(238, 49, 36, 0.05); + position: relative; } + .organisationDetail h1 i { + font-size: 0.75em; + top: -5px; } .organisationDetail .orgLogo { - padding: 10px 0; - background: rgba(255, 255, 255, 0.5); } + padding: 10px 0; } .organisationDetail .orgLogo img { width: 35%; margin-left: 5px; } diff --git a/akvo/rsr/static/rsr/v3/css/src/main.scss b/akvo/rsr/static/rsr/v3/css/src/main.scss index 9c8bc4aab5..f1733bfeab 100755 --- a/akvo/rsr/static/rsr/v3/css/src/main.scss +++ b/akvo/rsr/static/rsr/v3/css/src/main.scss @@ -378,6 +378,7 @@ nav.navbar-fixed-top { } &.active { background: none; + color:$anchorLinkHover; } } } @@ -427,9 +428,9 @@ nav.navbar-fixed-top { background-size: 5px auto; } &.active { - color: complement($rsrBlue); + color: $anchorLinkHover; font-weight: bold; - background: rgba($anchorLinkHover, 0.05) url(../../img/carret.png) 98% center no-repeat; + background: rgba($anchorLinkHover, 0.05) url(../../img/carretWhite.png) 98% center no-repeat; background-size: 5px auto; } } @@ -439,12 +440,12 @@ nav.navbar-fixed-top { } #profile { .usrAvatar { - background-color: rgba($akvoBlack,0.05); - padding:10px; + background-color: rgba($akvoBlack,0); + padding:10px 0 10px 0; } } #organisations { - background: darken(rgba($anchorLinkHover, 0.1), 0); + background: darken(rgba($anchorLinkHover, 0.05), 0); padding-bottom: 15px; @include border-radius(5px); @include responsive(small-max-screens) { @@ -783,7 +784,7 @@ h4.detailedInfo { color: rgba($akvoBlack, 0.5); } &:hover { - background: darken(rgba($rsrBlue, 0.05), 30%); + background: darken(rgba($rsrBlue, 0.15), 0%); border:thin solid rgba($rsrBlue, 0.35); } } @@ -823,7 +824,7 @@ h4.detailedInfo { color: rgba($akvoBlack, 0.5); } &:hover { - background: darken(rgba($rsrGreen, 0.05), 30%); + background: darken(rgba($rsrGreen, 0.10), 0%); border:thin solid rgba($rsrGreen, 0.35); } .excerpt { @@ -876,7 +877,7 @@ h4.detailedInfo { border:thin solid rgba($akvoTvRed, 0.15); } &:hover { - background: darken(rgba($akvoTvRed, 0.05), 30%); + background: darken(rgba($akvoTvRed, 0.10), 0%); border:thin solid rgba($akvoTvRed, 0.35); } img { @@ -961,6 +962,7 @@ div.projectTopRow { position: relative; background: rgba(245, 245, 245, 0.5); margin-top: 1px; + margin-bottom: 20px; border-bottom: 1px solid rgba($akvoBlack, 0.1); #carousel { padding: 15px 0; @@ -1101,12 +1103,14 @@ div.projectTopRow { } div.timelineBlock { margin: 15px auto 25px; + display:none; #timeline { height: 200px; } } div.textBlock { + margin:10px auto; .panel { border: 1px solid rgba(235, 235, 235, 0.5); .panel-heading { @@ -1207,10 +1211,17 @@ div.textBlock { h1 { margin-top:0; margin-bottom:20px; + color: rgba($akvoTvRed, 1); + padding-bottom:10px; + border-bottom:1px solid rgba($akvoTvRed,0.05); + position:relative; + i { + font-size:0.75em; + top:-5px; + } } .orgLogo { padding:10px 0; - background:rgba(white,0.5); img { width:35%; margin-left:5px; diff --git a/akvo/rsr/static/rsr/v3/img/carretWhite.png b/akvo/rsr/static/rsr/v3/img/carretWhite.png new file mode 100644 index 0000000000000000000000000000000000000000..e6142c7848fe010c64aca70c7c8b9be3aa56fe36 GIT binary patch literal 1633 zcmah}4Nw$S9KS(OJcmT1w3>8Tbw)<-cK43+xQ&yz-GjT4BZj*fP{+n)_Z_#u?Jm2E z9GGS}DIbG0PLLH!nWaZ%$P}fJsQ8hM;TM^aGmcJWVhS@wMNU(1PdKfSX=gv)d-MDK z{@+`dmz$lSe^Rg0=@Q&7Iv;)$;gb?S6~5EAgk$073DsGsdPTol$;d#L$%#b(aR-@V zkPjHHs{Axa*XgF*=6!`~p(lrA#h{VVFvd_&f@~<05t10T6sSlMDCPw_I^5lhB0OhD z3oIVoBT*p0yQ*d2ta2shcleh^PzffpR=KN$n zoi%O??(AqlRV5O`Dl03Em1d(T7h{CYX2Wn3W-=Kd!k|<+6>?d`ILBh33PZa)8*|da{C6Sa27*&*gqF6SO@w|Yj zib_C~5Q>Uq7+LILSYFT$QyyReno)rrg*C7kaFc;B`v@zk-R32@iNx`HP>;y*{;K~# ztv&)G(nyo#Ur^Wp9HTP-3+7nTFUmm%R)N=g7L$bHh&7LgbPI~g2rO{Zb`%C^eo8F9W}GoyXsNL!dhe9)T{#D zIh3akb^03Ke%~E;K6&K(tZPR%C!IeKPsY~7AM4t<>xDW{{++dZO4|l=-{Ik&t8ZF= zxqG6kzDdYl6(DwGavhJoly)Zh!o?3ZeL~?)uGQukaUdgM<{Ps<(_gh5b|)1$Vt41p@9eb3tbes_M?>DFm^k|Gm6+KpkLHvFPA^5bt2123>r0;Rdvs)>>)G36 z*}fMW7YnI5*O$BP^<%M5cT6d+z4MO7{;2EFmUWjOPxKs&Ti989n!h{)n^o5xH*n|J zw9&K2K3+1-GUf_@QEh2Xs5>(62dlrUWN2eLUc>H~^UAqxtxa)h^N%m3_P%$rc3+Z0 z4zKBvXz$GO{;faP1h3gfulCWdMT0wE|7PT=JuCleTA{mdbFIxcU(V|PJ9el!eCw-UdrhN<2Zvh11#5fSbFvFRzj9_yee+GJqH$~dfWbTL nEZ^IFwkPmzK7S&kbIB21z!uK_`rGUk+E3r@%%%4`*4F$3FOyF| literal 0 HcmV?d00001 diff --git a/akvo/rsr/static/rsr/v3/js/src/react-my-details.js b/akvo/rsr/static/rsr/v3/js/src/react-my-details.js index 72b7468f2a..b8171b1e5d 100644 --- a/akvo/rsr/static/rsr/v3/js/src/react-my-details.js +++ b/akvo/rsr/static/rsr/v3/js/src/react-my-details.js @@ -194,7 +194,7 @@ var AddEmploymentForm = React.createClass({displayName: 'AddEmploymentForm', render: function() { return ( React.DOM.span(null, - React.DOM.h4(null, "Connect with an organisation"), + React.DOM.h4(null, "Connect with your employer"), React.DOM.form(null, OrganisationInput( {ref:"organisationInput"} ), CountryInput( {ref:"countryInput"} ), diff --git a/akvo/rsr/static/rsr/v3/js/src/react-my-details.jsx b/akvo/rsr/static/rsr/v3/js/src/react-my-details.jsx index adb346ad00..db9d7d9b54 100644 --- a/akvo/rsr/static/rsr/v3/js/src/react-my-details.jsx +++ b/akvo/rsr/static/rsr/v3/js/src/react-my-details.jsx @@ -194,7 +194,7 @@ var AddEmploymentForm = React.createClass({ render: function() { return ( -

Connect with an organisation

+

Connect with your employer

diff --git a/akvo/templates/navigation/footer.html b/akvo/templates/navigation/footer.html index 133a6d1255..669568803d 100644 --- a/akvo/templates/navigation/footer.html +++ b/akvo/templates/navigation/footer.html @@ -9,6 +9,8 @@
  • API
  • Terms of service
  • +
  • Leave a feedback
  • + diff --git a/akvo/templates/organisation_main.html b/akvo/templates/organisation_main.html index 63faf73e62..08b746ec7c 100644 --- a/akvo/templates/organisation_main.html +++ b/akvo/templates/organisation_main.html @@ -6,7 +6,7 @@
    -

    {{organisation.name}}

    +

    {{organisation.name}}