Fixed right search panel and home search region.

This commit is contained in:
Svetlana Rastegina 2021-02-23 18:42:50 +01:00 committed by Georgy Litvinov
parent 1cca929387
commit 83aa4a1491
12 changed files with 268 additions and 126 deletions

View file

@ -97,8 +97,7 @@ select,
input[type="password"] {
border: 0;
font-size: 1rem;
font-family: "Roboto";
font-style: italic;
font-family: "Roboto Italic";
padding: .5em;
background: #fff;
border: 1px dashed #000000;
@ -110,7 +109,7 @@ input[type="password"] {
select.form-control {
padding: 5px 8px 5px 5px;
font-family: "Roboto";
font-family: "Roboto Regular";
font-style: normal;
-webkit-appearance: none;
-moz-appearance: none;
@ -543,7 +542,7 @@ ul#header-nav li {
padding-left: 20px;
padding-right: 20px;
border-right: 1px solid #7c7d7f;
font-size: 1em;
font-size: 1rem;
color: #fff;
}
ul#header-nav li:last-child {
@ -577,23 +576,24 @@ ul#header-nav a.log-out {
background-color:unset;
color: #8B4513;
text-align: right;
width: 50%;
width: 100%;
font-size: 1em;
padding-left: 0px;
padding-right: 0px;
padding-top: 10px;
font-family: "Roboto Regular";
}
#custom-search {
width: 50%;
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
justify-content: right;
}
.custom-search-input {
width: 70%;
width: 75%;
border-radius: unset !important;
-webkit-border-radius: unset !important;
float: left;
@ -645,28 +645,7 @@ input.search-submit-button {
background-size: 18px 7px;
}
#searchRightpanel {
width: 80%;
margin-left: auto;
margin-right: auto;
margin-bottom: -60px;
z-index: 2;
}
#searchRightpanel >section#search {
display: flex;
justify-content: right;
padding-top: 20px;
}
#searchRightpanel >section#search >div.search-form-container {
display: flex;
justify-content: right;
width: 60%;
}
#searchRightpanel >section#search >div.search-form-container >form#custom-search {
display: flex;
justify-content: right;
width: 30%;
}
#search {
/*position: absolute;*/
@ -674,7 +653,7 @@ input.search-submit-button {
height: 38px;
/* top: 90px;
right: 10px;*/
padding-top: 10px;
padding-top: 20px;
}
#search-field {
width: 396px;
@ -855,7 +834,7 @@ ul#main-nav {
}
#main-nav li a {
padding-left: 20px;
font-family: Roboto;
font-family: "Roboto Regular";
font-style: normal;
padding-right: 20px;
display: block;
@ -874,7 +853,7 @@ ul#main-nav {
#wrapper-content {
clear: both;
width: 80%;
margin: 0 auto;
/*margin: 0 auto;*/
background: #fff;
min-height: 710px;
padding-top: 20px ;
@ -901,7 +880,7 @@ ul#main-nav {
color: #8B4513;
font-size: 1.4rem;
padding: 0 0px 10px 25px;
/*font-family: Roboto;*/
font-family: "Roboto Regular";
background-image: url(../images/circle.png);
background-repeat: no-repeat;
background-position: left center;
@ -1141,7 +1120,7 @@ p.external-auth a.blue:hover {
justify-content: center;
flex-wrap: wrap;
align-content: center;
width: 100%;
width: 50%;
}
@ -1252,6 +1231,7 @@ input.search-homepage {
p.request-account a,
ul#header-nav a {
color: #fff;
font-family: "Roboto Regular";
}
#filter-search-nav a {
border-bottom: 1px dotted #4f5656;
@ -1318,6 +1298,7 @@ section#home-stats.home-sections {
padding-bottom: 0px;
display: block;
height: 1.5rem;
font-family: "Roboto Regular";
}
@ -1371,7 +1352,7 @@ section#home-stats.home-sections {
height: 28px;
vertical-align: middle;
border-bottom: 1px dashed #ffffff;
font-family: "Roboto Regular";
}
#stats .stats-type {
@ -1379,6 +1360,7 @@ section#home-stats.home-sections {
padding-top: 0px;
margin-top: 0px;
font-size: 1.1em;
font-family: "Roboto Regular";
}
#stats .stats-count span {
@ -1500,7 +1482,7 @@ div#adjImgHeight {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
justify-content: space-between;
width: 80%;
margin-left: auto;
margin-right: auto;
@ -1528,7 +1510,7 @@ footer p.copyright {
color: #ffffff;
}
footer p.copyright small {
font-size: 1em;
font-size: 1rem;
}
ul#footer-nav {
float: right;
@ -1560,7 +1542,7 @@ ul#individual-facultyMemberships li:last-child {
#footer-nav a:hover,
a.terms,
a.powered-by-vivo {
color: #09C;
color: #DD9F00;
text-decoration: none;
}
a.terms:hover,
@ -1667,6 +1649,7 @@ ul#individual-tools-people li a {
font-weight: normal;
padding: 0 25px 10px 20px;
font-family: Roboto;
display: none;
}
#menupage-intro.people h2 {
float: left;
@ -1775,6 +1758,8 @@ ul#browse-classes li {
width: 90%;
margin-left: 10px;
margin-right: 10px;
font-family: "IPH Astra Serif Regular";
font-size: 1.2rem;
}
ul#browse-classes a:hover,
ul#browse-classes a.selected {
@ -1787,6 +1772,7 @@ ul#browse-classes .count-classes {
/* ALPHA BROWSE------> */
ul#alpha-browse-individuals {
background-color: #fff;
font-family: "IPH Astra Serif Regular";
}
ul#alpha-browse-individuals a:hover,
ul#alpha-browse-individuals a.selected {
@ -1825,8 +1811,10 @@ ul#alpha-browse-individuals {
font-size: 1.5rem;
}
h3.selected-class {
padding-bottom: 0.2em;
padding-bottom: 0.3em;
color: #8B4513;
font-family: "IPH Astra Serif Regular";
font-size: 1.3rem;
}
#individuals-in-class li.individual {
@ -1848,6 +1836,8 @@ li.individual {
margin-left: 0;
margin-right: 0;
width: 100%;
font-family: "IPH Astra Serif Regular";
font-size: 1.4rem;
}
/* -------------------------------------------------> */
@ -1958,6 +1948,10 @@ h3.internal-auth {
}
#individual-info {
border-bottom: 1px solid #8B4513;
font-family: "IPH Astra Serif Regular";
}
#titleContainer {
font-family: "IPH Astra Serif Regular";
}
#individual-info h1.fn {
font-size: 1.375em;
@ -2274,6 +2268,8 @@ span.subclassExpandMinus {
.affiliations {
margin-bottom: 1.5em;
font-family: "IPH Astra Serif Bold";
font-size: 1rem;
}
/* -------------------------------------------------> */
/* ARTICLESTYLES --------------------------------> */
@ -2281,6 +2277,12 @@ span.subclassExpandMinus {
.articleExcerpt {
background-color: #ffffff;
/*border: 1px solid #F6F6F6;*/
font-family: "IPH Astra Serif Regular";
font-size: 1.4rem;
}
.articleExcerpt >div.htmlExcerpt >p.Textbody {
font-family: "IPH Astra Serif Regular";
font-size: 1rem;
}
button.collapsible {
background-color: #F6F6F6;
@ -2290,6 +2292,8 @@ button.collapsible {
background-repeat: no-repeat;
background-position: 1% 50%;
padding-left: 40px !important;
font-family: "IPH Astra Serif Regular";
font-size: 1.3rem;
}
button.collapsible:visited {
-webkit-appearance: none;
@ -2324,84 +2328,246 @@ button.collapsible.active:focus {
.bibliography {
padding-left: 40px;
}
.rubrics >div#wrapper-content {
margin-top: 60px;
ul.dropdown li#user-menu a {
font-family: "Roboto Regular";
font-size: 1rem;
}
.issues >div#wrapper-content {
margin-top: 60px;
ul.dropdown ul.sub_menu {
background-color: #000000;
}
.people >div#wrapper-content {
margin-top: 60px;
ul.dropdown ul.sub_menu li {
background: url(../images/arrow-menu-account.gif) 7px 8px no-repeat;
}
.rubrics >div#searchRightpanel >section#search {
justify-content: center;
ul.dropdown ul.sub_menu li a {
background-color: #000000;
color: #ffffff !important;
}
.rubrics >div#searchRightpanel > section#search > div.search-form-container {
width: 100%;
justify-content: center;
ul.dropdown ul.sub_menu li a:hover {
color: #DD9F00;
}
.rubrics >div#searchRightpanel > section#search > div.search-form-container > form#custom-search {
justify-content: center;
.individual.loggedIn >div#articleWrapper {
width: 80%;
margin-left: auto;
margin-right: auto;
display: flex;
flex-direction: row-reverse;
flex-wrap: nowrap;
justify-content: space-between;
}
.issues >div#searchRightpanel >section#search {
justify-content: center;
.individual >div#articleWrapper {
width: 80%;
margin-left: auto;
margin-right: auto;
display: flex;
flex-direction: row-reverse;
flex-wrap: nowrap;
justify-content: space-between;
}
.issues >div#searchRightpanel > section#search > div.search-form-container {
width: 100%;
justify-content: center;
}
.issues >div#searchRightpanel > section#search > div.search-form-container > form#custom-search {
justify-content: center;
.individual.loggedIn >div#articleWrapper >div#searchRightpanel {
width: 30%;
}
.home.loggedIn >div#wrapper-content {
margin-left: auto;
margin-right: auto;
display: flex;
justify-content: center;
}
.home >div#wrapper-content {
margin-left: auto;
margin-right: auto;
display: flex;
justify-content: center;
}
.elenph_articles.loggedIn >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.elenph_articles >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.elenph_articles.loggedIn >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.elenph_articles >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.rubrics.loggedIn >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.rubrics >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.rubrics.loggedIn >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.rubrics >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.issues.loggedIn >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.issues >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.issues.loggedIn >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.issues >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.excerpts.loggedIn >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.excerpts >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.excerpts.loggedIn >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.excerpts >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.people.loggedIn >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.people >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.people.loggedIn >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.people >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.siteAdmin.loggedIn >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.siteAdmin >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.siteAdmin.loggedIn >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.siteAdmin >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.login.loggedIn >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.login >div#articleWrapper {
margin-left: auto;
margin-right: auto;
width: 80%;
}
.login.loggedIn >div#articleWrapper >div#wrapper-content {
width: 100%;
}
.login >div#articleWrapper >div#wrapper-content {
width: 100%;
/* -------------------------------------------------> */
/* FONTS --------------------------------> */
/* -------------------------------------------------> */
@font-face {
font-family: "IPH Serif";
font-family: "IPH Serif Regular";
font-weight: normal;
src: url("../fonts/IPHSerif-Regular.woff2") format("woff2"),
url("../fonts/IPHSerif-Regular.ttf") format("truetype");
}
@font-face {
font-family: "IPH Serif";
font-weight: bold;
src: url("../fonts/IPHSerif-Bold.woff2") format("woff2"),
url("../fonts/IPHSerif-Bold.ttf") format("truetype");
}
@font-face {
font-family: "IPH Serif";
font-style: italic;
font-family: "IPH Serif Italic";
font-weight: normal;
src: url("../fonts/IPHSerif-Italic.woff2") format("woff2"),
url("../fonts/IPHSerif-Italic.ttf") format("truetype");
}
@font-face {
font-family: "IPH Serif";
font-family: "IPH Serif Bold";
font-weight: bold;
src: url("../fonts/IPHSerif-Bold.woff2") format("woff2"),
url("../fonts/IPHSerif-Bold.ttf") format("truetype");
}
@font-face {
font-family: "IPH Serif Bold Italic";
font-style: italic;
font-weight: bold;
src: url("../fonts/IPHSerif-BoldItalic.woff2") format("woff2"),
url("../fonts/IPHSerif-BoldItalic.ttf") format("truetype");
}
@font-face {
font-family: "Roboto";
font-family: "IPH Astra Serif Regular";
font-weight: normal;
src: url("../fonts/IPHAstraSerif-Regular.woff2") format("woff2"),
url("../fonts/IPHAstraSerif-Regular.ttf") format("truetype");
}
@font-face {
font-family: "IPH Astra Serif Bold";
font-weight: bold;
src: url("../fonts/IPHAstraSerif-Bold.woff2") format("woff2"),
url("../fonts/IPHAstraSerif-Bold.ttf") format("truetype");
}
@font-face {
font-family: "IPH Astra Serif Italic";
font-style: italic;
src: url("../fonts/IPHAstraSerif-Italic.woff2") format("woff2"),
url("../fonts/IPHAstraSerif-Italic.ttf") format("truetype");
}
@font-face {
font-family: "IPH Astra Serif Bold Italic";
font-style: italic;
font-weight: bold;
src: url("../fonts/IPHAstraSerif-BoldItalic.woff2") format("woff2"),
url("../fonts/IPHAstraSerif-BoldItalic.ttf") format("truetype");
}
@font-face {
font-family: "Roboto Regular";
font-weight: normal;
src: url("../fonts/Roboto-Regular.woff2") format("woff2"),
url("../fonts/Roboto-Regular.ttf") format("truetype");
}
@font-face {
font-family: "Roboto";
font-family: "Roboto Bold";
font-weight: bold;
src: url("../fonts/Roboto-Bold.woff2") format("woff2"),
url("../fonts/Roboto-Bold.ttf") format("truetype");
}
@font-face {
font-family: "Roboto";
font-family: "Roboto Italic";
font-weight: italic;
src: url("../fonts/Roboto-Italic.woff2") format("woff2"),
url("../fonts/Roboto-Italic.ttf") format("truetype");
}
@font-face {
font-family: "Roboto";
font-family: "Roboto Italic Bold";
font-style: italic;
font-weight: bold;
src: url("../fonts/Roboto-BoldItalic.woff2") format("woff2"),
@ -2422,17 +2588,11 @@ button.collapsible.active:focus {
width: 90%;
}
#switch-to-extended-searchform {
width: 50%;
width: 100%;
}
#querybuilder-container {
width: 70%;
}
.elenph_articles >div#searchRightpanel {
width: 90%;
}
.excerpts >div#searchRightpanel {
width: 90%;
}
}
@media screen and (max-width: 1300px) {
#branding {
@ -2454,22 +2614,13 @@ button.collapsible.active:focus {
width: 95%;
}
ul#alpha-browse-individuals {
font-size: 1.2rem;
font-size: 1.3rem;
}
ul#browse-classes {
width: 24%;
}
.elenph_articles >div#searchRightpanel {
width: 95%;
}
.excerpts >div#searchRightpanel {
width: 95%;
}
.elenph_articles >div#searchRightpanel > section#search > div.search-form-container > form#custom-search {
width: 70%;
}
.excerpts > div#searchRightpanel > section#search > div.search-form-container > form#custom-search {
width: 70%;
ul#browse-classes li {
font-size: 1.1rem;
}
}
@ -2486,14 +2637,14 @@ button.collapsible.active:focus {
ul#alpha-browse-individuals a:hover, ul#alpha-browse-individuals a.selected {
background: none;
}
.elenph_articles >div#searchRightpanel > section#search > div.search-form-container > form#custom-search {
width: 80%;
ul#main-nav {
font-size: 1rem;
}
.excerpts >div#searchRightpanel {
width: 95%;
#simple-search-container {
width: 70%;
}
.elenph_articles >div#searchRightpanel > section#search > div.search-form-container > form#custom-search {
width: 80%;
#switch-to-extended-searchform {
width: 100%;
}
}
@media screen and (max-width: 900px) {
@ -2625,15 +2776,6 @@ button.collapsible.active:focus {
ul#alpha-browse-individuals a {
padding-left: 1px;
}
.rubrics > div#searchRightpanel > section#search > div.search-form-container > form#custom-search {
width: 80%;
}
.excerpts > div#searchRightpanel > section#search > div.search-form-container > form#custom-search {
width: 80%;
}
.excerpts >div#searchRightpanel {
width: 95%;
}
}
@media screen and (max-width: 720px) {
@ -2665,16 +2807,4 @@ button.collapsible.active:focus {
font-size: 0.8rem;
line-height: 1.2em;
}
.elenph_articles >div#searchRightpanel {
width: 95%;
}
.elenph_articles #searchRightpanel > section#search > div.search-form-container {
width: 70%;
}
.excerpts >div#searchRightpanel {
width: 95%;
}
.excerpts >div#searchRightpanel > section#search > div.search-form-container {
width: 80%;
}
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 170 B

After

Width:  |  Height:  |  Size: 75 B

View file

@ -45,7 +45,7 @@
<legend>${i18n().search_form}</legend>
</fieldset>
<#include "searchSelector.ftl">
</section> <!-- #search-home -->
</section>
<div id="wrapperDescription">
<div id="Titleproject">О проекте</div>

View file

@ -11,13 +11,25 @@
<body class="${bodyClasses!}" onload="${bodyOnload!}">
<#include "identity.ftl">
<#include "menu.ftl">
<#if !querytext?? >
<div id="searchRightpanel">
<div id="articleWrapper">
<#if individual?? >
<div id="searchRightpanel">
<#include "customsearchpanel.ftl" >
</div>
</#if>
<#include "contentWrapper.ftl">
<#include "contentWrapper.ftl">
<#if currentServlet != "individual" && currentServlet != "login">
<section id="search-home" role="region">
<h3><span class="search-filter-selected">filteredSearch</span></h3>
<fieldset>
<legend>${i18n().search_form}</legend>
</fieldset>
<#include "searchSelector.ftl">
</section>
</#if>
<#-- VIVO OpenSocial Extension by UCSF -->
<#if openSocial??>
<#if openSocial.visible>
@ -26,7 +38,7 @@
</#if>
${body}
</div>
<#include "footer.ftl">
</body>
</html>