[Trunk | Library]:

1. common-assets/library.css: Rename class 'lines-11' to 'lines-10' (is applied only on <p> element) & apply classes 'multi-line-ellipsis' and 'lines-10' only on <p> element.
2. curved-bottom.svg: Add background color (#FAFAFA) with <rect> element.
3. explore-custom.css: In class 'numbers-background' add 'no-repeat' style & remove 'homePageGrayBackground' class & in class 'graph-background-bottom' add 'background-color: #FAFAFA'.
4. home.component.html: 
	Use 'lines-10' class instead of 'lines-11' & 
	don't use 'homePageGrayBackground' class & 
	seperate section for numbers - add 'numbers-background' class only on second section - adjust margins and paddings.


git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-portal/trunk@57512 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
konstantina.galouni 2019-11-05 14:57:16 +00:00
parent 29305c6a1c
commit 11b108ce0f
3 changed files with 19 additions and 17 deletions

View File

@ -175,9 +175,9 @@
<img src="assets/explore-banner.png"> <img src="assets/explore-banner.png">
</div> </div>
<div> <div>
<div [class.lines-11]="!readMore" class="uk-margin-bottom multi-line-ellipsis"> <div [class.lines-10]="!readMore" class="uk-margin-bottom multi-line-ellipsis">
<helper *ngIf="pageContents && pageContents['right'] && pageContents['right'].length > 0" <helper [texts]="pageContents['right']" ></helper>
[texts]="pageContents['right']"></helper>
<!-- If no help text, uncomment from here--> <!-- If no help text, uncomment from here-->
<!-- <div class="uk-h2" style="color: white !important;">--> <!-- <div class="uk-h2" style="color: white !important;">-->
<!-- Extracted <b>Metadata Combined.</b>--> <!-- Extracted <b>Metadata Combined.</b>-->
@ -226,9 +226,10 @@
</div> </div>
</div> </div>
</div> </div>
<div *ngIf="pageContents && pageContents['right'] && pageContents['right'].length > 0" class="homePageGrayBackground"> <!-- <div class="homePageGrayBackground">-->
<div class="graph-background-bottom uk-background-norepeat uk-background-top-center uk-height-small"></div> <div *ngIf="pageContents && pageContents['right'] && pageContents['right'].length > 0"
</div> class="graph-background-bottom uk-background-norepeat uk-background-top-center uk-height-small"></div>
<!-- </div>-->
<!-- If no help text, uncomment from here--> <!-- If no help text, uncomment from here-->
<!-- <div class="uk-section uk-section-small">--> <!-- <div class="uk-section uk-section-small">-->
<!-- <div class="uk-container uk-container-large">--> <!-- <div class="uk-container uk-container-large">-->
@ -414,15 +415,15 @@
<!-- If no help text, uncomment to here--> <!-- If no help text, uncomment to here-->
<!-- For old numbers section, comment from here--> <!-- For old numbers section, comment from here-->
<div class="uk-section-default uk-section numbers-background"> <div class="uk-section-default uk-section uk-padding-remove-bottom">
<div class="uk-container uk-text-center"> <div class="uk-container uk-text-center uk-margin-medium-bottom">
<div class="uk-margin-medium uk-flex-center"> <div class="uk-margin-medium uk-flex-center">
<div class="uk-first-column"> <div class="uk-first-column">
<div class="uk-panel"> <div class="uk-panel">
<h2 class="uk-margin uk-h2 uk-text-center"> <h2 class="uk-margin uk-h2 uk-text-center">
Our growing <span class="uk-text-bold">Community</span> Our growing <span class="uk-text-bold">Community</span>
</h2> </h2>
<div class="uk-margin-large-top"> <div class="uk-margin-medium-top">
<div class="uk-grid uk-child-width-1-3@m"> <div class="uk-grid uk-child-width-1-3@m">
<p *ngIf="showProjects && fundersSize"> <p *ngIf="showProjects && fundersSize">
<span class="portal-color emphasis"> <span class="portal-color emphasis">
@ -453,8 +454,9 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="uk-container uk-margin-large-top"> <div class="uk-section-default uk-section numbers-background uk-padding-remove-top">
<div class="uk-container uk-margin-medium-top">
<div class="uk-grid uk-flex uk-flex-center"> <div class="uk-grid uk-flex uk-flex-center">
<div class="uk-margin-large-right"> <div class="uk-margin-large-right">
<div *ngIf="showPublications && publicationsSize" class="uk-margin-medium-bottom"> <div *ngIf="showPublications && publicationsSize" class="uk-margin-medium-bottom">

View File

@ -1 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="2589.757" height="64.343" viewBox="0 0 2589.757 64.343"><path d="M0,521.966H1978.151a.887.887,0,0,1,0,.881c-240.592,0-232.9,20.119-332.308,32.318s-279.843,0-279.843,0-332.25-31.658-599-15-244,44-432,46-264.28-32.058-357.23-46S-184.5,522.987-279.812,522.24s-331.688,0-331.688,0v-.274H0Z" transform="translate(611.5 -521.907)" fill="#d95f2d"/></svg> <svg xmlns="http://www.w3.org/2000/svg" width="2589.757" height="64.343" viewBox="0 0 2589.757 64.343">
<rect width="100%" height="100%" fill="#FAFAFA"/>
<path d="M0,521.966H1978.151a.887.887,0,0,1,0,.881c-240.592,0-232.9,20.119-332.308,32.318s-279.843,0-279.843,0-332.25-31.658-599-15-244,44-432,46-264.28-32.058-357.23-46S-184.5,522.987-279.812,522.24s-331.688,0-331.688,0v-.274H0Z" transform="translate(611.5 -521.907)" fill="#d95f2d"/>
</svg>

Before

Width:  |  Height:  |  Size: 395 B

After

Width:  |  Height:  |  Size: 455 B

View File

@ -126,7 +126,7 @@
} }
.numbers-background { .numbers-background {
background: transparent url('numbers_background_pattern.svg') 0% 0% no-repeat padding-box; background: transparent url('explore-assets/numbers_background_pattern.svg') 0% 0% no-repeat padding-box;
background-size: cover; background-size: cover;
} }
@ -158,10 +158,6 @@
transition-duration:0.3s; transition-duration:0.3s;
} }
.homePageGrayBackground {
background: #FAFAFA 0% 0% no-repeat padding-box;
}
.graph-background { .graph-background {
background: var(--portal-main-color) 0 0 no-repeat padding-box; background: var(--portal-main-color) 0 0 no-repeat padding-box;
color: white; color: white;
@ -170,6 +166,7 @@
.graph-background-bottom { .graph-background-bottom {
margin-top: -1.5px; margin-top: -1.5px;
background-image: url("curved-bottom.svg"); background-image: url("curved-bottom.svg");
background-color: #FAFAFA;
} }
.custom-explore-toggle { .custom-explore-toggle {