Skip to content

GitLab

Commit 52f7b2ee authored by Matija Obreza's avatar Matija Obreza
Browse files

Look-and-Feel updates

parent aa5aa5ca
Hide whitespace changes
Inline Side-by-side
Showing with 8305 additions and 8007 deletions
src/main/webapp/WEB-INF/decorator/entry.jsp
View file @ 52f7b2ee
......@@ -9,18 +9,16 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="" />
<meta name="author" content="" />
<!--
<link rel="shortcut icon" href="../../docs-assets/ico/favicon.png" />
-->
<title><sitemesh:write property="title" /></title>
<!-- Bootstrap core CSS -->
<link href="/html/css/bootstrap.css" rel="stylesheet" />
<link href="<c:url value="/html/css/bootstrap.css" />" rel="stylesheet" />
<!-- Custom styles for this template -->
<link href="/html/css/custom.css" rel="stylesheet" />
<link href="/html/font/forza.css" rel="stylesheet" />
<link href="<c:url value="/html/css/custom.css" />" rel="stylesheet" />
<link href="<c:url value="/html/css/responsive.css" />" rel="stylesheet" />
<link href="<c:url value="/html/font/forza.css" />" rel="stylesheet" />
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
......
src/main/webapp/WEB-INF/decorator/footer.jsp
View file @ 52f7b2ee
......@@ -36,7 +36,35 @@
<script type="text/javascript" src="/html/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/html/js/tab.js"></script>
<script type="text/javascript" src="/html/js/crophub.js"></script>
<script type="text/javascript">
$( document ).ready(function() {
$('#news a').click(function (e) {
e.preventDefault();
$(this).tab('show');
});
});
// show mobile menu
$('.mobile-menu-show').click(function(){
$('.mobile-header .header-top .mobile-menu-show').css('display', 'none');
$('.mobile-header .header-top .mobile-menu-hide').css('display', 'inline-block');
$('.logo-container').css('display', 'none');
$('.mobile-header #search').show('slow');
$('#left-col').show('slow');
$('#nav-main').show('slow');
});
$('.mobile-menu-hide').click(function(){
$('.mobile-header .header-top .mobile-menu-show').css('display', 'inline-block');
$('.mobile-header .header-top .mobile-menu-hide').css('display', 'none');
$('.logo-container').css('display', 'block');
$('.mobile-header #search').hide('slow');
$('#left-col').hide('slow');
$('#nav-main').hide('slow');
});
</script>
<!-- Processing time:
<div class="footer clearfix" style="font-size: 80%"><spring:message code="page.rendertime" arguments="${springExecuteTime}" /></div>
-->
src/main/webapp/WEB-INF/decorator/header.jsp
View file @ 52f7b2ee
......@@ -17,21 +17,21 @@
<ul class="nav navbar-nav navbar-right">
<security:authorize access="isAnonymous()">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><spring:message code="page.login" /></a>
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><spring:message code="page.login" /></a>
<ul class="dropdown-menu pull-left">
<li>
<form role="form" method="post" action="/login-attempt">
<div class="form-group">
<label for="username"><spring:message code="login.username"/>:</label>
<input type="email" class="form-control" id="username" name="j_username" placeholder="<spring:message code="login.username"/>" />
<input type="email" class="form-control" id="username" name="j_username" placeholder="<spring:message code="login.username"/>" />
</div>
<div class="form-group">
<label for="password"><spring:message code="login.password"/></label>
<input type="password" class="form-control" id="password" name="j_password" placeholder="<spring:message code="login.password"/>" />
<input type="password" class="form-control" id="password" name="j_password" placeholder="<spring:message code="login.password"/>" />
</div>
<div class="checkbox">
<label>
<input type="checkbox" name="_spring_security_remember_me" id="_spring_security_remember_me"/>
<input type="checkbox" name="_spring_security_remember_me" id="_spring_security_remember_me"/>
<spring:message code="login.remember-me"/>
</label>
</div>
......@@ -47,24 +47,22 @@
</security:authorize>
<security:authorize access="isAuthenticated()">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><spring:message code="user.pulldown.heading" arguments="${user.user.name}" /></a>
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><spring:message code="user.pulldown.heading" arguments="${user.user.name}" /></a>
<ul class="dropdown-menu pull-left">
<security:authorize access="hasRole('ADMINISTRATOR')">
<li><a href="<c:url value="/admin/" />"><spring:message code="user.pulldown.administration" /></a></li>
<li><a href="<c:url value="/profile/list" />"><spring:message code="user.pulldown.users" /></a></li>
<li><a href="<c:url value="/team" />"><spring:message code="user.pulldown.teams" /></a></li>
<li><a href="<c:url value="/admin/" />"><spring:message code="user.pulldown.administration" /></a></li>
<li><a href="<c:url value="/profile/list" />"><spring:message code="user.pulldown.users" /></a></li>
<li><a href="<c:url value="/team" />"><spring:message code="user.pulldown.teams" /></a></li>
</security:authorize>
<li><a href="<c:url value="/profile/${user.username}" />"><spring:message
code="user.pulldown.profile"/></a></li>
<li><a id="logout" href="<c:url value="/logout" />"><spring:message
code="user.pulldown.logout"/></a>
<li><a href="<c:url value="/profile/${user.username}" />"><spring:message code="user.pulldown.profile"/></a></li>
<li><a id="logout" href="<c:url value="/logout" />"><spring:message code="user.pulldown.logout"/></a>
</li>
</ul>
</li>
</security:authorize>
<li class="dropdown" id="lang">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><c:out value="${pageContext.response.locale.displayLanguage}" /> <b class="caret"></b></a>
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><c:out value="${pageContext.response.locale.displayLanguage}" /> <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu">
<li><a href="?lang=en">English</a></li>
<li><a href="?lang=ar">Arabic</a></li>
......@@ -79,36 +77,103 @@
<security:authorize access="isAuthenticated()">
<li><a href="?lang=sl">Slovene</a></li>
</security:authorize>
<li><a target="_blank" href="https://www.transifex.com/projects/p/genesys/">Translate Genesys</a></li>
<li><a target="_blank" href="https://www.transifex.com/projects/p/genesys/">Translate Genesys</a></li>
</ul>
</li>
</ul>
</div>
</div>
</header>
<!--
<!-- Mobile Header -->
<div class="mobile-header">
<div class="header-top">
<div class="container">
<a href="#" class="mobile-menu-show"><img src="<c:url value="/html/images/icon_mobile_menu.png" />" alt="" /></a>
<a href="#" class="mobile-menu-hide"><img src="<c:url value="/html/images/icon_mobile_menu_back.png" />" alt="" /></a>
<ul class="nav navbar-nav navbar-right">
<security:authorize access="isAnonymous()">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><spring:message code="page.login" /></a>
<ul class="dropdown-menu pull-left">
<li>
<form role="form" method="post" action="/login-attempt">
<div class="form-group">
<label for="username"><spring:message code="login.username"/>:</label>
<input type="email" class="form-control" id="username" name="j_username" placeholder="<spring:message code="login.username"/>" />
</div>
<div class="form-group">
<label for="password"><spring:message code="login.password"/></label>
<input type="password" class="form-control" id="password" name="j_password" placeholder="<spring:message code="login.password"/>" />
</div>
<div class="checkbox">
<label>
<input type="checkbox" name="_spring_security_remember_me" id="_spring_security_remember_me"/>
<spring:message code="login.remember-me"/>
</label>
</div>
<button type="submit" class="btn btn-green"><spring:message
code="login.login-button"/></button>
<span class="or">-</span>
<a href="<c:url value="/google/login" />" class="btn btn-default google-signin"><spring:message code="login.with-google-plus"/></a>
<a href="<c:url value="/registration" />" class="btn btn-default"><spring:message code="login.register-now"/></a>
</form>
</li>
</ul>
</li>
</security:authorize>
<security:authorize access="isAuthenticated()">
<li class="dropdown">
<a href="<c:url value="/profile" />" class="dropdown-toggle" data-toggle="dropdown"><spring:message code="user.pulldown.heading" arguments="${user.user.name}" /></a>
<ul class="dropdown-menu pull-left">
<security:authorize access="hasRole('ADMINISTRATOR')">
<li><a href="<c:url value="/admin/" />"><spring:message code="user.pulldown.administration" /></a></li>
<li><a href="<c:url value="/profile/list" />"><spring:message code="user.pulldown.users" /></a></li>
<li><a href="<c:url value="/team" />"><spring:message code="user.pulldown.teams" /></a></li>
</security:authorize>
<li><a href="<c:url value="/profile/${user.username}" />"><spring:message code="user.pulldown.profile"/></a></li>
<li><a id="logout" href="<c:url value="/logout" />"><spring:message code="user.pulldown.logout"/></a></li>
</ul>
</li>
</security:authorize>
</li>
<li class="dropdown" id="lang">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"><c:out value="${pageContext.response.locale.displayLanguage}" /> <b class="caret"></b></a>
<ul class="dropdown-menu" role="menu">
<li><a href="?lang=en">English</a></li>
<li><a href="?lang=ar">Arabic</a></li>
<li><a href="?lang=de">German</a></li>
<li><a href="?lang=es">Spanish</a></li>
<li><a href="?lang=fa">Persian</a></li>
<li><a href="?lang=fr">French</a></li>
<li><a href="?lang=pt">Portugese</a></li>
<li><a href="?lang=ru">Russian</a></li>
<li><a href="?lang=zh">Chinese</a></li>
<%-- Only show fully translated languages --%>
<security:authorize access="isAuthenticated()">
<li><a href="?lang=sl">Slovene</a></li>
</security:authorize>
<li><a target="_blank" href="https://www.transifex.com/projects/p/genesys/">Translate Genesys</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div class="logo-container">
<div class="container">
<a href="<c:url value="/" />"><img src="<c:url value="/html/images/logo_genesys.png" />" alt="Genesys - Gateway to Genetic Resources" title="Genesys - Gateway to Genetic Resources" /></a>
</div>
</div>
<form role="search" id="search" action="<c:url value="/acn/search" />">
<div class="container">
<div class="form-group">
<input type="text" class="form-control" placeholder="Search Genesys ..." />
</div>
<button type="submit" class="btn"><img src="<c:url value="/html/images/icon_search.png" />" alt="" /></button>
</div>
</form>
<div class="notimportant navbar pull-right">
<security:authorize access="isAnonymous()">
<ul class="nav">
<li><a href="<c:url value="/login"/>"><spring:message code="page.login"/></a>
</ul>
</security:authorize>
<security:authorize access="isAuthenticated()">
<ul class="nav">
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" title="<spring:message code="locale.language.change"/>"><spring:message code="user.pulldown.heading" arguments="${user.user.name}" /> <b class="caret"></b>
</a>
<ul class="dropdown-menu">
<security:authorize access="hasRole('ADMINISTRATOR')">
<li><a href="<c:url value="/admin/"/>"><spring:message code="user.pulldown.administration"/></a></li>
<li><a href="<c:url value="/profile/list"/>"><spring:message code="user.pulldown.users"/></a></li>
</security:authorize>
<li><a href="<c:url value="/profile/${user.username}"/>"><spring:message code="user.pulldown.profile"/></a></li>
<li><a href="<c:url value="/logout"/>"><spring:message code="user.pulldown.logout"/></a></li>
</ul></li>
</ul>
</security:authorize>
</div>
-->
</div> <!-- Mobile Header end -->
src/main/webapp/WEB-INF/decorator/main.jsp
View file @ 52f7b2ee
......@@ -16,11 +16,12 @@
<title><sitemesh:write property="title" /></title>
<!-- Bootstrap core CSS -->
<link href="/html/css/bootstrap.css" rel="stylesheet" />
<link href="<c:url value="/html/css/bootstrap.css" />" rel="stylesheet" />
<!-- Custom styles for this template -->
<link href="/html/css/custom.css" rel="stylesheet" />
<link href="/html/font/forza.css" rel="stylesheet" />
<link href="<c:url value="/html/css/custom.css" />" rel="stylesheet" />
<link href="<c:url value="/html/css/responsive.css" />" rel="stylesheet" />
<link href="<c:url value="/html/font/forza.css" />" rel="stylesheet" />
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
......
src/main/webapp/WEB-INF/decorator/menu.jsp
View file @ 52f7b2ee
......@@ -2,7 +2,7 @@
<div class="navbar" role="navigation" id="nav-main">
<div class="container">
<div class="collapse navbar-collapse">
<div class="navbar-collapse">
<ul class="nav navbar-nav">
<li class="notimportant"><a href="<c:url value="/" />"><spring:message code="menu.home" /></a></li>
<li><a href="<c:url value="/acn/" />"><spring:message code="menu.browse" /></a></li>
......
src/main/webapp/html/css/bootstrap.css
View file @ 52f7b2ee
This source diff could not be displayed because it is too large. You can view the blob instead.
src/main/webapp/html/css/custom.css
View file @ 52f7b2ee
......@@ -58,7 +58,12 @@ html[dir="rtl"] #content .right-col {
}
#search {
margin:18px 0 0 30px;
margin:18px 0 0 30px;
width:50%;
}
#search .form-group {
width:80%;
}
#search .form-control {
......@@ -68,7 +73,7 @@ html[dir="rtl"] #content .right-col {
border:1px solid #fff;
margin-right:-5px;
height:35px;
width:460px;
width:100%;
}
#search .btn {
......@@ -78,11 +83,13 @@ html[dir="rtl"] #content .right-col {
border-radius:0;
}
#header .nav {
#header .nav,
.mobile-header .nav {
margin-top:16px;
}
#header .nav li a {
#header .nav li a,
.mobile-header .nav li a {
border-left:1px solid #83827e;
color:#fff;
font-weight:bold;
......@@ -105,15 +112,21 @@ html[dir="rtl"] #header .nav li:last-of-type a {
#header .nav li a:hover,
#header .nav li a:focus,
#header .nav li:hover a,
#header .nav li.open a {
#header .nav li.open a,
.mobile-header .nav li a:hover,
.mobile-header .nav li a:focus,
.mobile-header .nav li:hover a,
.mobile-header .nav li.open a {
background:#2b2924;
}
#header .nav .caret {
#header .nav .caret,
.mobile-header .nav .caret {
color:#88ba42;
}
#header .nav .dropdown-menu {
#header .nav .dropdown-menu,
.mobile-header .nav .dropdown-menu {
background:#2b2924;
-moz-border-radius:0;
-webkit-border-radius:0;
......@@ -126,7 +139,8 @@ html[dir="rtl"] #header .nav li:last-of-type a {
z-index:1001;
}
html:not([dir="rtl"]) #header .nav li#lang .dropdown-menu {
html:not([dir="rtl"]) #header .nav li#lang .dropdown-menu,
html:not([dir="rtl"]) .mobile-header .nav li#lang .dropdown-menu {
left:auto;
}
......@@ -134,13 +148,15 @@ html[dir="rtl"] #header .nav li#lang .dropdown-menu {
right:-107px;
}
#header .nav .dropdown-menu li a {
#header .nav .dropdown-menu li a,
.mobile-header .nav .dropdown-menu li a {
border:none;
padding:5px 30px;
text-align:right;
}
#header .nav .dropdown-menu a:hover {
#header .nav .dropdown-menu a:hover,
.mobile-header .nav .dropdown-menu a:hover {
background:#4d4c46;
}
......@@ -148,7 +164,8 @@ html[dir="rtl"] #header .nav li:last-of-type .dropdown-menu a {
border-left:none;
}
#header .nav .dropdown-menu .form-group {
#header .nav .dropdown-menu .form-group,
.mobile-header .nav .dropdown-menu .form-group {
margin:5px 20px 0 20px;
text-align:left;
}
......@@ -157,12 +174,14 @@ html[dir="rtl"] #header .nav .dropdown-menu .form-group {
text-align:right;
}
#header .nav .dropdown-menu .form-group label {
#header .nav .dropdown-menu .form-group label,
.mobile-header .nav .dropdown-menu .form-group label {
color:#fff;
font-weight:bold;
}
#header .nav .dropdown-menu .form-group .form-control {
#header .nav .dropdown-menu .form-group .form-control,
.mobile-header .nav .dropdown-menu .form-group .form-control {
border:none;
-moz-border-radius:0;
-webkit-border-radius:0;
......@@ -170,7 +189,8 @@ html[dir="rtl"] #header .nav .dropdown-menu .form-group {
width:200px;
}
#header .nav .dropdown-menu .checkbox {
#header .nav .dropdown-menu .checkbox,
.mobile-header .nav .dropdown-menu .checkbox {
margin:10px 20px 20px 20px;
text-align:left;
}
......@@ -179,14 +199,16 @@ html[dir="rtl"] #header .nav .dropdown-menu .checkbox {
text-align:right;
}
#header .nav .dropdown-menu .btn {
#header .nav .dropdown-menu .btn,
.mobile-header .nav .dropdown-menu .btn {
-moz-border-radius:0;
-webkit-border-radius:0;
border-radius:0;
border:none;
}
#header .nav .dropdown-menu .btn-green {
#header .nav .dropdown-menu .btn-green,
.mobile-header .nav .dropdown-menu .btn-green {
background: #accf7b;
background: -moz-linear-gradient(top, #accf7b 0%, #accf7b 50%, #88ba42 51%, #88ba42 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#accf7b), color-stop(50%,#accf7b), color-stop(51%,#88ba42), color-stop(100%,#88ba42));
......@@ -202,7 +224,8 @@ html[dir="rtl"] #header .nav .dropdown-menu .checkbox {
width:200px;
}
#header .nav .dropdown-menu .btn-green:hover {
#header .nav .dropdown-menu .btn-green:hover,
.mobile-header .nav .dropdown-menu .btn-green:hover {
background: #88ba42;
background: -moz-linear-gradient(top, #88ba42 0%, #88ba42 50%, #accf7b 51%, #accf7b 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#88ba42), color-stop(50%,#88ba42), color-stop(51%,#accf7b), color-stop(100%,#accf7b));
......@@ -213,19 +236,21 @@ html[dir="rtl"] #header .nav .dropdown-menu .checkbox {
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#88ba42', endColorstr='#accf7b',GradientType=0 );
}
#header .nav .dropdown-menu .btn-default {
#header .nav .dropdown-menu .btn-default,
.mobile-header .nav .dropdown-menu .btn-default {
background:#e8e8e8;
color:#4d4c46;
margin-bottom:15px;
}
#header .nav .dropdown-menu .btn-default:hover {
#header .nav .dropdown-menu .btn-default:hover,
.mobile-header .nav .dropdown-menu .btn-default:hover {
background:#e8e8e8;
text-decoration:underline;
}
#header .nav .dropdown-menu .or {
#header .nav .dropdown-menu .or,
.mobile-header .nav .dropdown-menu .or {
display:block;
margin:5px 0;
text-align:center;
......@@ -305,11 +330,6 @@ html[dir="rtl"] #header .nav .dropdown-menu .checkbox {
background:#cfcdc7 url('../images/arrow_croplist_nav.png') no-repeat 95% 8px;
}
html[dir="rtl"] #left-col .nav li a:hover,
html[dir="rtl"] #left-col .nav li.active a {
background:#cfcdc7 url('../images/arrow_croplist_nav_rtl.png') no-repeat 5% 8px;
}
#left-col .nav li.active a {font-weight:bold;}
#crop-list .dropdown,
......@@ -328,12 +348,10 @@ html[dir="rtl"] #left-col .nav li.active a {
border-radius:0;
border:1px solid #4d4c46;
padding:0 0 0 5px;
}
html[dir="rtl"] #crop-list .dropdown button,
html[dir="rtl"] #crop-list-dropdown .dropdown button,
html[dir="rtl"] #countries-list-dropdown .dropdown button {
padding:0 5px 0 0;
position:relative;
height:27px;
text-align:left;
width:100%;
}
#crop-list .dropdown button .caret,
......@@ -341,16 +359,11 @@ html[dir="rtl"] #countries-list-dropdown .dropdown button {
#countries-list-dropdown .dropdown button .caret {
background:#b4b3ae url('../images/arrow_croplist.png') no-repeat center center;
border:none;
margin-left:20px;
height:25px;
width:23px;
}
html[dir="rtl"] #crop-list .dropdown button .caret,
html[dir="rtl"] #crop-list-dropdown .dropdown button .caret,
html[dir="rtl"] #countries-list-dropdown .dropdown button .caret {
margin-left:auto;
margin-right:35px;
position:absolute;
top:0;
right:0;
}
#crop-list .dropdown .dropdown-menu,
......@@ -555,8 +568,8 @@ html[dir="rtl"] .tab-pane .all-posts .post-inner {
.tab-pane .all-posts .post-inner .post-image {
float:left;
margin-right:10px;
width:150px;
margin-right:3.22%;
width:28.09%;
}
html[dir="rtl"] .tab-pane .all-posts .post-inner .post-image {
......@@ -575,7 +588,7 @@ html[dir="rtl"] .tab-pane .all-posts .post-inner .post-image {
border-right:1px solid #d2d0cb;
position:relative;
min-height:100px;
width:100px;
width:18.73%;
}
html[dir="rtl"] .tab-pane .all-posts .type-crop .post-inner .post-image {
......@@ -597,16 +610,16 @@ html[dir="rtl"] .tab-pane .all-posts .type-crop .post-inner .post-image img {
.tab-pane .all-posts .post-inner .post-content {
float:left;
width:363px;
width:68.69%;
}
.tab-pane .all-posts .type-crop .post-inner .post-content {
width:413px;
width:77.34%;
}
.tab-pane .all-posts .type-list .post-inner .post-content {
background:url('../images/pic_map_news_full.png') no-repeat 95% center;
width:523px;
width:100%;
}
.tab-pane .all-posts .type-list .post-inner .post-content ol {
......@@ -651,6 +664,7 @@ html[dir="rtl"] .tab-pane .all-posts .type-list .post-inner .post-content ol li
.tab-pane .all-posts .post-inner .post-content p {
font-size:12px;
margin:0 10px 10px 0;
}
.tab-pane .all-posts .post-actions {
......@@ -840,7 +854,7 @@ html[dir="rtl"] #country-in-genesys table .alignleft {
border:1px solid #4d4c46;
margin:5px 0 0 0;
height:17px;
width:220px;
}
#my-profile .profile-status .status-bar .status-progress {
......
src/main/webapp/html/css/responsive.css 0 → 100644
View file @ 52f7b2ee
.mobile-header {display:none;}
.mobile-header .header-top {
background:#2b2924;
}
.mobile-header .header-top .navbar-nav {
float:right;
margin:5px 0 0 0;
}
.mobile-header .header-top .mobile-menu-show,
.mobile-header .header-top .mobile-menu-hide {
display:inline-block;
padding:10px;
}
.mobile-header .logo-container {
background:#4d4c46;
padding:5px 0 10px 0;
}
@media (max-width: 1200px) {
}
@media (max-width: 1024px) {
}