Add xsmall padding in graph_elements instread of margins because of uikit upgrade

This commit is contained in:
Konstantinos Triantafyllou 2023-08-23 11:43:07 +03:00
parent c0d4fd8ae7
commit befbfd071b
5 changed files with 27 additions and 19 deletions

View File

@ -48,7 +48,8 @@
<div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default"> <div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default">
<ng-template #graph_and_feedback_template> <ng-template #graph_and_feedback_template>
<div class="uk-container uk-container-xlarge uk-flex uk-flex-between uk-flex-wrap uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!dataProviderInfo"> <div class="uk-padding-xsmall">
<div class="uk-container uk-container-xlarge uk-flex uk-flex-between uk-flex-wrap" [class.uk-invisible]="!dataProviderInfo">
<!-- Last Index Info--> <!-- Last Index Info-->
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l"> <a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l">
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;"> <img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;">
@ -63,6 +64,7 @@
<a (click)="showFeedback = true; scroll()" class="uk-text-xsmall">Give us feedback</a> <a (click)="showFeedback = true; scroll()" class="uk-text-xsmall">Give us feedback</a>
</div> </div>
</div> </div>
</div>
</ng-template> </ng-template>
<div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m" <div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"

View File

@ -47,21 +47,23 @@
<!-- Graph and feedback --> <!-- Graph and feedback -->
<ng-template #graph_and_feedback_template> <ng-template #graph_and_feedback_template>
<div class="uk-container uk-container-xlarge uk-flex uk-flex-between uk-flex-wrap uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!organizationInfo"> <div class="uk-padding-xsmall">
<!-- Last Index Info--> <div class="uk-container uk-container-xlarge uk-flex uk-flex-between uk-flex-wrap uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!organizationInfo">
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l"> <!-- Last Index Info-->
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;"> <a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l">
</a> <img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;">
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta uk-width-1-1 uk-width-auto@l"> </a>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta uk-width-1-1 uk-width-auto@l">
Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}} Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span> </span>
<!--Feedback--> <!--Feedback-->
<div *ngIf="properties.reCaptchaSiteKey" class="uk-width-1-1 uk-width-auto@l"> <div *ngIf="properties.reCaptchaSiteKey" class="uk-width-1-1 uk-width-auto@l">
<span class="uk-text-meta uk-text-xsmall">Found an issue? </span> <span class="uk-text-meta uk-text-xsmall">Found an issue? </span>
<a (click)="showFeedback = true; scroll()" class="uk-text-xsmall">Give us feedback</a> <a (click)="showFeedback = true; scroll()" class="uk-text-xsmall">Give us feedback</a>
</div> </div>
</div> </div>
</div>
</ng-template> </ng-template>
<div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m" <div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"

View File

@ -85,7 +85,8 @@
<div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default"> <div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default">
<ng-template #graph_and_feedback_template> <ng-template #graph_and_feedback_template>
<div class="uk-container uk-container-xlarge uk-flex uk-flex-between uk-flex-wrap uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!projectInfo"> <div class="uk-padding-xsmall">
<div class="uk-container uk-container-xlarge uk-flex uk-flex-between uk-flex-wrap uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!projectInfo">
<!-- Last Index Info--> <!-- Last Index Info-->
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l"> <a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l">
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;"> <img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;">
@ -100,6 +101,7 @@
<a (click)="showFeedback = true; scroll()" class="uk-text-xsmall">Give us feedback</a> <a (click)="showFeedback = true; scroll()" class="uk-text-xsmall">Give us feedback</a>
</div> </div>
</div> </div>
</div>
</ng-template> </ng-template>
<div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m" <div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"

View File

@ -81,7 +81,8 @@
<div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default"> <div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default">
<ng-template #graph_and_feedback_template> <ng-template #graph_and_feedback_template>
<div class="uk-container uk-container-xlarge uk-flex uk-flex-between uk-flex-wrap uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!resultLandingInfo"> <div class="uk-padding-xsmall">
<div class="uk-container uk-container-xlarge uk-flex uk-flex-between uk-flex-wrap uk-margin-small-top uk-margin-small-bottom" [class.uk-invisible]="!resultLandingInfo">
<!-- Last Index Info--> <!-- Last Index Info-->
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l"> <a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@l">
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;"> <img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 15px;">
@ -96,6 +97,7 @@
<a (click)="feedbackClicked()" class="uk-text-xsmall">Give us feedback</a> <a (click)="feedbackClicked()" class="uk-text-xsmall">Give us feedback</a>
</div> </div>
</div> </div>
</div>
</ng-template> </ng-template>
<div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m" <div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"

View File

@ -39,9 +39,9 @@ declare var ResizeObserver;
</div> </div>
</div> </div>
<div *ngIf="divContents" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-fade; delay: 250"> <div *ngIf="divContents" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-fade; delay: 250">
<div id="graph_element" #graph_element class="uk-blur-background" uk-sticky="end: true" <div id="graph_element" #graph_element class="uk-blur-background uk-padding-xsmall" uk-sticky="end: true"
[attr.offset]="graph_offset"> [attr.offset]="graph_offset">
<div class="uk-container uk-container-large uk-margin-small-top uk-margin-small-bottom"> <div class="uk-container uk-container-large">
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@m"> <a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@m">
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 17px;"> <img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 17px;">
</a> </a>
@ -83,9 +83,9 @@ declare var ResizeObserver;
</div> </div>
</div> </div>
<div *ngIf="divContents" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-fade; delay: 250"> <div *ngIf="divContents" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-fade; delay: 250">
<div id="graph_element" #graph_element class="uk-blur-background" uk-sticky="end: true" <div id="graph_element" #graph_element class="uk-blur-background uk-padding-xsmall" uk-sticky="end: true"
[attr.offset]="graph_offset"> [attr.offset]="graph_offset">
<div class="uk-container uk-container-large uk-margin-small-top uk-margin-small-bottom uk-text-xsmall uk-text-right"> <div class="uk-container uk-container-large uk-text-xsmall uk-text-right">
<a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@m"> <a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@m">
<img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 17px;"> <img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 17px;">
</a> </a>