[Library & Common-Assets | new-theme]: 1st version of restructure of result landing page according to redesign | Bug fix in method "hasMetrics".

1. landing-header.component.ts: Remove from <showTitle>, isH1 input.
2. metrics.component.ts: On metrics error, emit also "pageViews: 0".
3. showTitle.component.ts: Remove "isH1" input property and add in title class uk-h5 always.
4. resultLanding.component.html: Redesign (currently broken) of result landing page.
5. orcid-work.component.ts: Remove label "Add to / Remove from ORCID".
6. import.css: Import "landing-utils.css".
7. landing-utils.css: Comment all existing css rules and add new.
This commit is contained in:
Konstantina Galouni 2022-04-04 12:14:53 +03:00
parent bbad5016c9
commit 77d3480a05
2 changed files with 313 additions and 297 deletions

View File

@ -4,7 +4,7 @@
/*@import "labels.css";*/
@import "utils.css";
@import "search.css";
/*@import "landing-utils.css";*/
@import "landing-utils.css";
/*@import "tabs.css";*/
/*@import "breadcrumbs.css";*/
/*@import "material.css";*/

View File

@ -1,302 +1,318 @@
/* Landing title section*/
.title-section h1 {
font-size: 28px;
font-weight: 400;
/*!* Landing title section*!*/
/*.title-section h1 {*/
/* font-size: 28px;*/
/* font-weight: 400;*/
/*}*/
/*.title-section .under-curation {*/
/* color: var(--portal-main-color);*/
/* opacity: 0.8;*/
/*}*/
/*.uk-modal .title-section h1, .uk-modal .title-section h2, .feedback-page .title-section h1 {*/
/* font-size: 18px;*/
/* font-weight: 400;*/
/*}*/
/*!* Landing Main content*!*/
/*input[name="code"] {*/
/* font-family: Consolas, monaco, monospace;*/
/* font-size: .875rem;*/
/* color: #222080;*/
/* white-space: nowrap;*/
/* background: #f9f9f9;*/
/* border: 1px solid #ededed;*/
/* border-radius: 1px;*/
/*}*/
/*.landing ul.basic-info li {*/
/* margin-bottom: 6px;*/
/*}*/
/*!* Landing Related Organizations*!*/
/*.landing ul.organizations > li {*/
/* border: 1px solid #E8E8E8;*/
/* border-radius: 2px;*/
/* color: #A4A4A4;*/
/* padding: 10px;*/
/* width: 100%;*/
/*}*/
/*.landing ul.organizations > li > a {*/
/* color: #000000;*/
/* font-weight: 700;*/
/*}*/
/*.landing ul.organizations > li > a:hover {*/
/* text-decoration: underline;*/
/*}*/
/*!* Landing Download from section*!*/
/*.landing .download-from > * {*/
/* padding: 10px;*/
/* color: #A4A4A4;*/
/* border-bottom: 1px solid rgba(0, 0, 0, 0.09);*/
/*}*/
/*.landing .download-from > *:last-child {*/
/* border-bottom: none;*/
/*}*/
/*.landing .download-from .title {*/
/* color: black;*/
/* word-wrap: break-word;*/
/* font-weight: 700;*/
/* text-decoration: underline;*/
/*}*/
/*.landing .download-from a {*/
/* color: #A4A4A4;*/
/*}*/
/*.landing .download-from a:hover {*/
/* color: #578ede;*/
/*}*/
/*!* Landing Relations section*!*/
/*.landing .simple-buttons > div {*/
/* font-size: 16px;*/
/* padding: 15px 30px;*/
/* border-radius: 4px;*/
/* background-color: white;*/
/* border: 1px solid #DEDEDE;*/
/*}*/
/*.landing .simple-buttons > div:hover {*/
/* background-color: #F0F0F0;*/
/* box-shadow: 0 1px 6px #00000033;*/
/*}*/
/*.landing .advanced-buttons > div > div {*/
/* border-radius: 4px;*/
/* font-size: 16px;*/
/* border: 1px solid #DEDEDE;*/
/*}*/
/*.landing .advanced-buttons > div > div:hover {*/
/* box-shadow: 0 1px 6px #00000033;*/
/*}*/
/*.landing .advanced-buttons > div > div .header {*/
/* padding: 15px;*/
/* min-height: 60px;*/
/* color: var(--portal-main-color);*/
/* text-overflow: ellipsis;*/
/*}*/
/*.landing .advanced-buttons > div > div .icon {*/
/* z-index: 1;*/
/* color: var(--portal-main-color);*/
/*}*/
/*.landing .advanced-buttons > div > div .icon > svg {*/
/* width: 40px;*/
/* height: 40px;*/
/*}*/
/*.landing .advanced-buttons > div > div .footer {*/
/* padding: 15px;*/
/* min-height: 60px;*/
/* background-color: #F0F0F0;*/
/* font-size: 24px;*/
/* color: #666;*/
/*}*/
/*.landing .advanced-buttons > div > div:hover .footer {*/
/* color: black;*/
/*}*/
/*.landing .left-border {*/
/* border-left: 3px solid #EBEBEB;*/
/* padding-left: 20px;*/
/*}*/
/*.landing .sideInfoTitle {*/
/* font-weight: normal !important;*/
/* border-radius: 4px;*/
/* background-color: #F0F0F0;*/
/* color: #666;*/
/* padding: 12px;*/
/*}*/
/*!* Progress *!*/
/*.portal-progress.uk-progress, .green-progress.uk-progress {*/
/* background-color: #F0F0F0;*/
/* height: 10px;*/
/*}*/
/*!*firefox*!*/
/*.portal-progress.uk-progress::-moz-progress-bar {*/
/* background-color: var(--portal-main-color);*/
/*}*/
/*.green-progress.uk-progress::-moz-progress-bar {*/
/* background-color: #9ADC83 !important;*/
/*}*/
/*!*chrome*!*/
/*.portal-progress.uk-progress::-webkit-progress-value {*/
/* background-color: var(--portal-main-color);*/
/*}*/
/*.green-progress.uk-progress::-webkit-progress-value {*/
/* background-color: #9ADC83 !important;*/
/*}*/
/*!*internet explore & edge*!*/
/*.portal-progress.uk-progress::-ms-fill {*/
/* background-color: var(--portal-main-color);*/
/*}*/
/*.green-progress.uk-progress::-ms-fill {*/
/* background-color: #9ADC83 !important;*/
/*}*/
/*!* Bioentities *!*/
/*.bioentities-buttons > div > * {*/
/* border-radius: 4px;*/
/* font-size: 16px;*/
/* font-weight: 700;*/
/* border: 1px solid #DEDEDE;*/
/* padding: 40px 0;*/
/* width: 100%;*/
/* display: inline-block;*/
/* text-align: center;*/
/* text-transform: uppercase;*/
/* color: #666;*/
/*}*/
/*.bioentities-buttons > div > a:hover {*/
/* background-color: #F0F0F0;*/
/* color: black;*/
/* box-shadow: 0 1px 6px #00000033;*/
/*}*/
/*!* Feedback page*!*/
/*.feedback-page .title-section {*/
/* background-image: linear-gradient(to right, var(--portal-main-color), var(--portal-dark-color));*/
/* padding: 15px 0;*/
/* border-radius: 4px;*/
/*}*/
/*.feedback-page .uk-text-muted {*/
/* color: rgba(255, 255, 255, 0.7) !important;*/
/*}*/
/*.feedback-page .form {*/
/* margin-top: 5px;*/
/* border-radius: 4px;*/
/* border: 1px solid rgba(0, 0, 0, 0.2);*/
/* padding: 25px 25px 15px;*/
/*}*/
/*.feedback-sent {*/
/* border-radius: 4px;*/
/* background-color: var(--portal-main-color);*/
/* color: white;*/
/* padding: 50px 100px;*/
/* text-align: center;*/
/*}*/
/*.feedback-sent * {*/
/* color: white;*/
/*}*/
/*!* B2note*!*/
/*.b2note ul {*/
/* color: #1D3454;*/
/*}*/
/*.b2note button {*/
/* border-radius: 500px;*/
/* border: 1px solid #DEDEDE;*/
/* line-height: 17px;*/
/* background-color: #DEDEDE;*/
/* color: #515151;*/
/* padding: 5px 15px;*/
/* text-transform: uppercase;*/
/* font-size: 12px;*/
/*}*/
/*.b2note button:not(.disabled):hover {*/
/* box-shadow: 0 1px 6px #00000033;*/
/*}*/
/*.b2note button.disabled {*/
/* cursor: unset;*/
/*}*/
/*.b2note button:focus {*/
/* outline-color: transparent;*/
/*}*/
/*.b2note ul > li {*/
/* word-wrap: break-word;*/
/*}*/
/*.b2note ul > li > .type {*/
/* border-radius: 4px;*/
/* color: white;*/
/* font-size: 12px;*/
/* padding: 1px 9px;*/
/* text-transform: uppercase;*/
/* width: 80px;*/
/* text-align: center;*/
/*}*/
/*.b2note ul > li > .type.semantic {*/
/* background-color: #22356E;*/
/*}*/
/*.b2note ul > li > .type.keyword {*/
/* background-color: #596FB5;*/
/*}*/
/*.b2note ul > li > .type.comment {*/
/* background-color: #AFB3D4;*/
/*}*/
/*svg #statistics-bars {*/
/* fill: var(--portal-main-color);*/
/*}*/
/*.landing-modal-header {*/
/* background: transparent linear-gradient(35deg, #FFFFFF 0%, #F0F0F0 100%) no-repeat padding-box;*/
/* padding: 20px 40px;*/
/*}*/
/*.landing-modal .modal-title {*/
/* font-weight: bold;*/
/* font-size: 22px;*/
/* margin: 0;*/
/*}*/
/*.square-button {*/
/* border-radius: 0;*/
/*}*/
/*.title-grey-background {*/
/* background: transparent linear-gradient(17deg, #FFFFFF 0%, #F0F0F0 100%) no-repeat padding-box;*/
/* padding: 15px 0;*/
/* border-radius: 4px;*/
/*}*/
:root {
--landing-header-height: var(--navbar-height);
}
.title-section .under-curation {
color: var(--portal-main-color);
opacity: 0.8;
.landing-column-height {
height: calc(100vh - var(--landing-header-height));
}
.uk-modal .title-section h1, .uk-modal .title-section h2, .feedback-page .title-section h1 {
font-size: 18px;
font-weight: 400;
.landing-background-light-color {
background-color: var(--light-color);
}
/* Landing Main content*/
input[name="code"] {
font-family: Consolas, monaco, monospace;
font-size: .875rem;
color: #222080;
white-space: nowrap;
background: #f9f9f9;
border: 1px solid #ededed;
border-radius: 1px;
}
.landing ul.basic-info li {
margin-bottom: 6px;
}
/* Landing Related Organizations*/
.landing ul.organizations > li {
border: 1px solid #E8E8E8;
border-radius: 2px;
color: #A4A4A4;
padding: 10px;
width: 100%;
}
.landing ul.organizations > li > a {
color: #000000;
font-weight: 700;
}
.landing ul.organizations > li > a:hover {
text-decoration: underline;
}
/* Landing Download from section*/
.landing .download-from > * {
padding: 10px;
color: #A4A4A4;
border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}
.landing .download-from > *:last-child {
border-bottom: none;
}
.landing .download-from .title {
color: black;
word-wrap: break-word;
font-weight: 700;
text-decoration: underline;
}
.landing .download-from a {
color: #A4A4A4;
}
.landing .download-from a:hover {
color: #578ede;
}
/* Landing Relations section*/
.landing .simple-buttons > div {
font-size: 16px;
padding: 15px 30px;
border-radius: 4px;
background-color: white;
border: 1px solid #DEDEDE;
}
.landing .simple-buttons > div:hover {
background-color: #F0F0F0;
box-shadow: 0 1px 6px #00000033;
}
.landing .advanced-buttons > div > div {
border-radius: 4px;
font-size: 16px;
border: 1px solid #DEDEDE;
}
.landing .advanced-buttons > div > div:hover {
box-shadow: 0 1px 6px #00000033;
}
.landing .advanced-buttons > div > div .header {
padding: 15px;
min-height: 60px;
color: var(--portal-main-color);
text-overflow: ellipsis;
}
.landing .advanced-buttons > div > div .icon {
z-index: 1;
color: var(--portal-main-color);
}
.landing .advanced-buttons > div > div .icon > svg {
width: 40px;
height: 40px;
}
.landing .advanced-buttons > div > div .footer {
padding: 15px;
min-height: 60px;
background-color: #F0F0F0;
font-size: 24px;
color: #666;
}
.landing .advanced-buttons > div > div:hover .footer {
color: black;
}
.landing .left-border {
border-left: 3px solid #EBEBEB;
padding-left: 20px;
}
.landing .sideInfoTitle {
font-weight: normal !important;
border-radius: 4px;
background-color: #F0F0F0;
color: #666;
padding: 12px;
}
/* Progress */
.portal-progress.uk-progress, .green-progress.uk-progress {
background-color: #F0F0F0;
height: 10px;
}
/*firefox*/
.portal-progress.uk-progress::-moz-progress-bar {
background-color: var(--portal-main-color);
}
.green-progress.uk-progress::-moz-progress-bar {
background-color: #9ADC83 !important;
}
/*chrome*/
.portal-progress.uk-progress::-webkit-progress-value {
background-color: var(--portal-main-color);
}
.green-progress.uk-progress::-webkit-progress-value {
background-color: #9ADC83 !important;
}
/*internet explore & edge*/
.portal-progress.uk-progress::-ms-fill {
background-color: var(--portal-main-color);
}
.green-progress.uk-progress::-ms-fill {
background-color: #9ADC83 !important;
}
/* Bioentities */
.bioentities-buttons > div > * {
border-radius: 4px;
font-size: 16px;
font-weight: 700;
border: 1px solid #DEDEDE;
padding: 40px 0;
width: 100%;
display: inline-block;
text-align: center;
text-transform: uppercase;
color: #666;
}
.bioentities-buttons > div > a:hover {
background-color: #F0F0F0;
color: black;
box-shadow: 0 1px 6px #00000033;
}
/* Feedback page*/
.feedback-page .title-section {
background-image: linear-gradient(to right, var(--portal-main-color), var(--portal-dark-color));
padding: 15px 0;
border-radius: 4px;
}
.feedback-page .uk-text-muted {
color: rgba(255, 255, 255, 0.7) !important;
}
.feedback-page .form {
margin-top: 5px;
border-radius: 4px;
border: 1px solid rgba(0, 0, 0, 0.2);
padding: 25px 25px 15px;
}
.feedback-sent {
border-radius: 4px;
background-color: var(--portal-main-color);
color: white;
padding: 50px 100px;
text-align: center;
}
.feedback-sent * {
color: white;
}
/* B2note*/
.b2note ul {
color: #1D3454;
}
.b2note button {
border-radius: 500px;
border: 1px solid #DEDEDE;
line-height: 17px;
background-color: #DEDEDE;
color: #515151;
padding: 5px 15px;
text-transform: uppercase;
font-size: 12px;
}
.b2note button:not(.disabled):hover {
box-shadow: 0 1px 6px #00000033;
}
.b2note button.disabled {
cursor: unset;
}
.b2note button:focus {
outline-color: transparent;
}
.b2note ul > li {
word-wrap: break-word;
}
.b2note ul > li > .type {
border-radius: 4px;
color: white;
font-size: 12px;
padding: 1px 9px;
text-transform: uppercase;
width: 80px;
text-align: center;
}
.b2note ul > li > .type.semantic {
background-color: #22356E;
}
.b2note ul > li > .type.keyword {
background-color: #596FB5;
}
.b2note ul > li > .type.comment {
background-color: #AFB3D4;
}
svg #statistics-bars {
fill: var(--portal-main-color);
}
.landing-modal-header {
background: transparent linear-gradient(35deg, #FFFFFF 0%, #F0F0F0 100%) no-repeat padding-box;
padding: 20px 40px;
}
.landing-modal .modal-title {
font-weight: bold;
font-size: 22px;
margin: 0;
}
.square-button {
border-radius: 0;
}
.title-grey-background {
background: transparent linear-gradient(17deg, #FFFFFF 0%, #F0F0F0 100%) no-repeat padding-box;
padding: 15px 0;
border-radius: 4px;
}
.landing-background-default-color {
background-color: var(--default-color);
}