From c19df41bfdd5cc4754ac2dacfbe5898e2cdbb9fc Mon Sep 17 00:00:00 2001 From: Manolo Bevia Date: Thu, 11 Apr 2013 15:09:23 -0400 Subject: [PATCH] Added new features for VITRO home page: -Filtered search based in class groups (It needs to be wired. Just added HTML/CSS/JS) -Class group stats (It needs to be wired. Just added HTML/CSS/JS) -Improveed UX for signing when there is external authorization Removed search box located in header in homepage. --- webapp/themes/vitro/css/vitroTheme.css | 182 ++++++++++++++++++ webapp/themes/vitro/templates/identity.ftl | 16 +- webapp/themes/vitro/templates/menu.ftl | 2 + webapp/themes/vitro/templates/page-home.ftl | 43 ++++- webapp/themes/vitro/templates/page.ftl | 13 ++ webapp/web/css/login.css | 14 +- webapp/web/js/login/loginUtils.js | 7 +- webapp/web/js/vitroUtils.js | 123 ++++++++++++ .../freemarker/widgets/widget-login.ftl | 48 +++-- 9 files changed, 411 insertions(+), 37 deletions(-) diff --git a/webapp/themes/vitro/css/vitroTheme.css b/webapp/themes/vitro/css/vitroTheme.css index dce6060c8..78bbcc7e1 100644 --- a/webapp/themes/vitro/css/vitroTheme.css +++ b/webapp/themes/vitro/css/vitroTheme.css @@ -622,6 +622,12 @@ body.login #login { padding-top: 18px; border-bottom: none; } +h3.internal-auth { + color: #5E6363; +} +h3.internal-auth:hover { + color: #47B6D0; +} #error-alert { margin: 0 12px; margin-bottom: 12px; @@ -742,6 +748,106 @@ p.password-note { margin-right:-10px; height:34px; } + +/* SEARCH HOME------> */ +#search-home { + margin-top: 2em; +} + +#search-home h3 { + padding-left: 24px; +} +#search-homepage { + position: relative; + padding-left: 24px; +} +#search-home-field { + width: 530px; + height: 44px; + background: url(../images/search-field-and-button.gif) 0 0 no-repeat; +} +#search-home-field input.search { + text-decoration: none; + background-color: transparent; + color: #fff; + font-size: 18px; + border: none; + padding-left: 13px; + padding-top: 8px; + cursor: pointer; +} +span.search-filter-selected { + display: none; +} +input.search-homepage { + float: left; + height: 20px; + border: 0; + font-size: 18px; + margin-left: 4px; + margin-top: 2px; + background-color: #f9fafa; + margin-right: 40px; + margin-top: 2px; + width: 351px; + background: url('../images/limit-search.png') no-repeat; + background-position: right; + opacity: .7; +} +a.filter-search { + position: absolute; + vertical-align: middle; + display: inline-block; + width: 39px; + height: 43px; + z-index: 9999; + top: 0; + right: 135px; + z-index: 9999; +} +.filter-default { + background: url(../images/filteredSearch.gif) 0 0 no-repeat; +} +.filter-active { + background: url(../images/filteredSearchActive.gif) 0 0 no-repeat; +} +#filter-search-nav { + position: absolute; + width: 184px; + background-color: #2d3535; + color: #fff; + top: 0; + right: 135px; + background-color: #2d3535; + color: #fff; + z-index: 9998; + display: none; + list-style-type: none; +} +#filter-search-nav li { + padding-left: 0; + margin-left: 0; + list-style-type: none; + background-image: none; +} +#filter-search-nav { + z-index: 9998; +} +#filter-search-nav a.active { + color: #fff; +} +#filter-search-nav a { + font-size: 17px; + display: block; + margin-left: 15px; + margin-right: 15px; + border-bottom: 1px dotted #4f5656; + color: #fff; + padding-top: 8px; + padding-bottom: 8px; + text-decoration: none; + color: #1483A4; +} /* BROWSE ------> */ #browse { background-color: #f7f5f0; @@ -801,6 +907,82 @@ ul#browse-classgroups a.selected span.count-classes, ul#browse-classgroups a:hover span.count-classes { color: #fff; } + +/* HOME STATS-----> */ +#home-stats { + margin-top: 1em; + width: 921px; + height: 213px; + border-top: 1px dotted #dbe3e3; /* stroke */ + border-bottom: 1px dotted #dbe3e3; /* stroke */ + background-color: #fff; /* layer fill content */ + float: left; +} +#home-stats h4 { + margin-top: 0; + width: 64px; + height: 34px; + border-top: 1px solid rgba(220,228,227,.42); /* stroke */ + border-bottom: 1px solid rgba(220,228,227,.42); /* stroke */ + background-color: #395d7f; /* layer fill content */ + border-bottom: 2px solid #62b6d7; + color: #fff; + font-size: 18px; + text-align: center; + margin-left: 35px; + padding: 0; + line-height: 35px; +} +#stats { + margin: 0 auto; + width: 875px; +} +#stats li { + float: left; + width: 108px; + height: 102px; + -moz-border-radius: 6px; + -webkit-border-radius: 6px; + border-radius: 6px; /* border radius */ + -moz-background-clip: padding; + -webkit-background-clip: padding-box; + background-clip: padding-box; /* prevents bg color from leaking outside the border */ + background: #5e6363 url(../images/stats-bg.png) repeat-x 0 0; + color: #fff; + margin-top: 35px; + margin-right: 25px; +} +#stats p { + color: #fff; +} +#stats li a { + text-decoration: none; +} +#stats li a:hover { + opacity: .5; +} +#stats li:first-child { + margin-left: 50px; +} +#stats .stats-count { + text-align: center; + font-size: 42px; + margin: 0; + padding-top: 30px; +} +#stats .stats-count span { + color: #fff; + font-size: 18px; + padding-left: 2px; + opacity: .5; +} +#stats .stats-type { + font-size: 13px; + text-align: center; + margin: 0; + margin-top: 13px; +} + /* FOOTER------> */ footer { clear: both; diff --git a/webapp/themes/vitro/templates/identity.ftl b/webapp/themes/vitro/templates/identity.ftl index 127c66fc6..297945d43 100644 --- a/webapp/themes/vitro/templates/identity.ftl +++ b/webapp/themes/vitro/templates/identity.ftl @@ -35,18 +35,4 @@ - - - - \ No newline at end of file + \ No newline at end of file diff --git a/webapp/themes/vitro/templates/menu.ftl b/webapp/themes/vitro/templates/menu.ftl index a09f090d5..1f7e501ef 100644 --- a/webapp/themes/vitro/templates/menu.ftl +++ b/webapp/themes/vitro/templates/menu.ftl @@ -1,5 +1,7 @@ <#-- $This file is distributed under the terms of the license in /doc/license.txt$ --> + +