From ea68b9f602b3f6d4123da3499699230805d640b4 Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Mon, 16 Mar 2020 13:08:36 +0000 Subject: [PATCH] [Library | Trunk]: Merge Library assets from landing redesign branch git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/assets@58274 d315682c-612b-4755-9ff5-7f18f6832af3 --- graph.svg | 1 + library.css | 352 ++++++++++++++++++++++++++++++++++++++++++--- under_curation.svg | 15 ++ 3 files changed, 351 insertions(+), 17 deletions(-) create mode 100644 graph.svg create mode 100644 under_curation.svg diff --git a/graph.svg b/graph.svg new file mode 100644 index 0000000..65a861e --- /dev/null +++ b/graph.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/library.css b/library.css index ff5bfda..e824af5 100644 --- a/library.css +++ b/library.css @@ -1,3 +1,6 @@ +body { + overflow: unset !important; +} .custom-footer { position: relative; @@ -88,6 +91,7 @@ h2 .custom-external { .clickable { cursor: pointer; + user-select: none; } .search-filters .uk-accordion-title { @@ -286,7 +290,15 @@ h2 .custom-external { /*.uk-tab{ border-bottom: 1px #cbcbcb solid; }*/ - +.label-classified { + border-radius: 4px; + padding: 1px 8px; + background-color: #ABABAB; + color: white; + text-transform: uppercase; + margin-bottom: 5px; + margin-right: 5px; +} .label-blue, .label-compatibility { background: #d4f3ff; @@ -318,11 +330,6 @@ h2 .custom-external { color: #00a0de; } -.label-orange, .label-sc39 { - background: #fef5d2; - color: #f0506e; -} - .label-publication { background: #4687E6; color: #fff @@ -364,6 +371,7 @@ h2 .custom-external { .label-funder, .label-language, .label-country, +.label-type, .label-orange, .label-sc39, .label-language, .label-publication, .label-publication, @@ -844,14 +852,11 @@ dd:last-child { } .sideInfoTitle { - - font-weight: 500; - border-bottom: 1px solid var(--portal-main-color); - /* background-color: var(--portal-main-color); */ - /* color:var(--portal-main-contrast) !important; */ - padding-top: 5px; - padding-left: 3px; - + font-weight: normal !important; + border-radius: 4px; + background-color: #F0F0F0; + padding: 5px 12px; + font-size: 12px; } /*.linkButtonsBox{ @@ -893,7 +898,10 @@ box-shadow: 0 -3px 10px 0 rgba(0,0,0,.0785); .portal-background-color { background-color: var(--portal-main-color) !important; - color: var(--portal-main-contrast) !important; +} + +.portal-background-color * { + color: var(--portal-main-contrast); } .portal-button,.portal-button-reverse:hover, .portal-button-reverse:active, .portal-button-reverse:focus { @@ -1162,7 +1170,7 @@ showTitle h2 { .portal-hr { border-bottom: 1px solid var(--portal-main-color) !important; - padding: 5px 0px; + padding: 5px 0; } .tm-toolbar .uk-subnav-line li:hover, .tm-toolbar .uk-subnav li:hover { @@ -1356,6 +1364,7 @@ textarea { .default-dropdown { background: white; + max-width: 500px; } [class*="uk-animation-"] { @@ -1431,7 +1440,316 @@ input[name="code"] { white-space: nowrap; background: #f9f9f9; border: 1px solid #ededed; - border-radius: 1px + border-radius: 1px; +} + +ul.portalTabs.uk-tab > .uk-active > a, ul.portalTabs.uk-tab > * > a:focus, ul.portalTabs.uk-tab > * > a:hover { + color: var(--portal-main-color) !important; + border-color: var(--portal-main-color) !important; + /*font-family: Roboto, sans-serif !important;*/ +} +ul.portalTabs.uk-tab > .uk-active > a{ + font-weight: bold; +} + +ul.portalTabs.uk-tab::before { + border-bottom: 1px solid var(--portal-main-color); +} + +.quickSelectionsBox{ + border: 1px solid #E6E6E6; + border-top:0px; + background-color: white; +} + +.selectedFilterLabel { + background-color: #E5E5E5 !important; + border-color: #E5E5E5 !important; + border-radius: 2px !important; + color: inherit !important; + line-height: 15px !important; + padding: 3px 10px !important; +} + +.searchFilterItem { + margin-bottom: 5px; +} + +.range-button > button{ + padding: 5px 10px !important; + text-transform: none !important; +} + +.portal-box .mat-select-value, .portal-box .mat-select-arrow{ + color: var(--portal-main-contrast) !important; + +} +.entitiesSelection{ + width: 150px; + padding:10px; + display: inline-block +} +.entitiesSelectionPanel, .matSelectionPanel{ + margin-top: 30px !important; +} + + +.selectedFilterLabel { + background-color: #E5E5E5; + border-color: #E5E5E5; + border-radius: 2px; + color: inherit; + line-height: 15px; + padding: 3px 10px; +} + +.searchFilterItem { + margin-bottom: 5px; +} + +.range-button > button{ + padding: 5px 10px; + text-transform: none; +} + +/* Landing gradient title section*/ +.title-section { + background-image: linear-gradient(to right, #FFFFFF , #F0F0F0); + padding-right: 10px; + padding-top: 5px; + padding-bottom: 5px; + border-radius: 4px; + position: relative; +} + +.title-section .under-curation{ + background-image: url("./under_curation.svg"); + height: 17px; + width: 13px; + display: inline-block; +} + +.uk-modal .title-section h1, .feedback-page .title-section h1{ + font-size: 18px; + font-family: "Open Sans"; + font-weight: 400; +} + +/* Landing Download from section*/ +.landing .download-from > div { + padding: 10px; + border-bottom: 1px solid rgba(0, 0, 0, 0.09); +} + +.landing .download-from > div:last-child { + border-bottom: none; +} + +.landing .download-from > div:hover { + background-color: #F0F0F0; + border-radius: 4px; +} + +.landing .download-from > div .title { + color: black; + font-weight: 700; +} + +.landing .download-from > div a.title:hover { + text-decoration: underline; +} + +.landing .download-from .provider > a { + color: #666; + text-decoration: underline; +} + +/* 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 #feedback-pos { + position:-webkit-sticky; + position: sticky; + bottom: 20px; +} + +.landing .feedback { + border-radius: 4px; + border: 1px solid #DCDCDC; + box-shadow: 0 2px 4px #0000001A; + background-color: white; + padding: 5px 15px; + font-size: 12px; + z-index: 1; +} + +.matSelection .mat-select-value, .matSelection .mat-select-arrow { + color: inherit !important; +} + +.matSelection.mat-select { + padding-bottom: 4px; + border-bottom: 1px solid rgba(0, 0, 0, 0.42); +} + +.matSelection.mat-select:focus { + border-color: #222080; +} + +.matSelectionFormField .mat-form-field-underline, .matSelectionFormField .mat-form-field-ripple { + height: 0 !important; +} + +.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; +} + +svg #statistics-bars { + fill: var(--portal-main-color); +} + +.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) , #F37A53); +} + +.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; +} + +.space { + margin-left: 4px; +} + +.uk-modal .uk-modal-dialog { + border-radius: 4px; +} + +.uk-tooltip.under-curation-tooltip { + background-color: white; + display: block; + border-radius: 4px; + padding: 15px 15px 0; + border: 1px solid #DEDEDE; + color: #6c6c6c; + z-index: 10000; } ul.portalTabs.uk-tab > .uk-active > a, ul.portalTabs.uk-tab > * > a:focus, ul.portalTabs.uk-tab > * > a:hover { diff --git a/under_curation.svg b/under_curation.svg new file mode 100644 index 0000000..f062efc --- /dev/null +++ b/under_curation.svg @@ -0,0 +1,15 @@ + + + + + + + + +