[Validator | right-col-temp]: [WIP] oaipmh-validator.component.less: Added styling rules for right column of validation page | oaipmh-validator.component.html: Updated margins & paddings and added content to the right column of validation page.
This commit is contained in:
parent
5ad74bceee
commit
259a5a8af6
|
@ -1 +1 @@
|
|||
Subproject commit 40ef9507150f90d9e50298adb23c29b3d5a9745b
|
||||
Subproject commit 821c4242bef1fc2725d40c32fc857052b2a15ab3
|
|
@ -1,10 +1,10 @@
|
|||
<div id="page_content">
|
||||
<div id="page_content_header" class="uk-blur-background" offset="65">
|
||||
<div class="uk-container uk-container-large uk-grid uk-margin-remove-left" uk-grid>
|
||||
<div id="page_content_header" class="uk-blur-background">
|
||||
<div class="uk-grid uk-margin-remove-left" uk-grid>
|
||||
<!-- <div id="landing-center-content" class="uk-width-expand uk-padding-remove uk-background-default">-->
|
||||
<!-- <div class="uk-section uk-width-expand" [formGroup]="form">-->
|
||||
<div id="center-content" class="uk-width-expand" [formGroup]="form">
|
||||
<ng-container>
|
||||
<div id="center-content" class="uk-width-2-3 uk-width-3-4@l" [formGroup]="form">
|
||||
<div class="uk-section uk-container uk-container-large">
|
||||
<div class="uk-margin-large-bottom">
|
||||
<h6><span class="uk-text-secondary uk-margin-right">1.</span> Select a data source (repository or journal)</h6>
|
||||
<div input class="uk-width-xlarge uk-margin-xsmall-left uk-margin-medium-top" inputClass="flat x-small" [formInput]="form.get('url')"
|
||||
|
@ -52,59 +52,100 @@
|
|||
<span>Start Validation</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
<div>aaaaaaaaaaaaaaaaaaaaaaaa oooooooooooooooooooo iiiiiiiiiiiiiiiiiiii</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div id="right-sidebar" *ngIf="help" class="uk-width-1-3 uk-width-1-4@l uk-padding-remove uk-background-primary">-->
|
||||
<!-- <div class="uk-sticky" uk-sticky="bottom: true" [attr.offset]="offset">-->
|
||||
<!-- <div class="uk-overflow-auto uk-height-1-1">-->
|
||||
<!-- <div class="uk-h5 uk-light uk-text-center">Help</div>-->
|
||||
<!--<!– <div class="uk-card uk-card-default">–>-->
|
||||
<!--<!– <div class="uk-card-body">test body</div>–>-->
|
||||
<!--<!– <div class="uk-card-footer">Dismiss Help</div>–>-->
|
||||
<!--<!– </div>–>-->
|
||||
<!-- <div class="uk-card uk-card-default">-->
|
||||
<!-- <div class="uk-card-body">test body</div>-->
|
||||
<!-- <div class="uk-card-footer">Dismiss Help</div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<div id="landing-right-sidebar" *ngIf="help" class="uk-width-1-3 uk-width-1-4@l uk-padding-remove uk-text-small uk-visible@m">
|
||||
<div class="uk-sticky" uk-sticky="bottom: true" [attr.offset]="offset">
|
||||
<div id="right-sidebar" *ngIf="help"
|
||||
class="uk-width-1-3 uk-width-1-4@l uk-padding-remove uk-text-small uk-visible@m uk-card uk-card-default">
|
||||
<div class="uk-sticky" uk-sticky="end: true" [attr.offset]="offset">
|
||||
<div class="uk-overflow-auto uk-height-1-1">
|
||||
test
|
||||
<div>
|
||||
<div class="uk-section uk-section-small uk-background-primary">
|
||||
<div class="uk-h5 uk-light uk-text-center">Help</div>
|
||||
</div>
|
||||
<div class="uk-card-body uk-padding-remove-horizontal">
|
||||
<ul uk-accordion>
|
||||
<li class="uk-open">
|
||||
<a class="uk-accordion-title uk-text-small uk-padding-small uk-padding-remove-vertical" href="#">
|
||||
<span class="accordion-title-num">
|
||||
<svg height="27" width="27">
|
||||
<circle cx="13" cy="13" r="13" stroke-width="1"></circle>
|
||||
<text x="50%" y="50%" text-anchor="middle" dy=".3em" font-size="14">
|
||||
1
|
||||
</text>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="uk-margin-small-left">Select Data source</span>
|
||||
</a>
|
||||
<div class="uk-accordion-content uk-text-small uk-padding-small uk-padding-remove-vertical">
|
||||
<p>
|
||||
Select from the list, or enter the base OAI URL of the repository/ journal.
|
||||
The repository's/ journal's published sets are exposed in a later stage and you may select one for the compatibility tests.
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<a class="uk-accordion-title uk-text-small uk-padding-small uk-padding-remove-vertical" href="#">
|
||||
<span class="accordion-title-num">
|
||||
<svg height="27" width="27">
|
||||
<circle cx="13" cy="13" r="13" stroke-width="1"></circle>
|
||||
<text x="50%" y="50%" text-anchor="middle" dy=".3em" font-size="14">
|
||||
2
|
||||
</text>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="uk-margin-small-left">Select Guidelines</span>
|
||||
</a>
|
||||
<div class="uk-accordion-content uk-text-small uk-padding-small uk-padding-remove-vertical">
|
||||
<p>You may apply two types of compatibility tests on your repository:</p>
|
||||
<ul>
|
||||
<li>Content: specific to the content/ format of the dc fields</li>
|
||||
<li>Usage: specific to the implementation of OAI-PMH</li>
|
||||
</ul>
|
||||
<p>You may select from a predefined set of rules (OpenAIRE for Literature Repositories, OpenAIRE for Data Archives) or customize them according to your needs.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<a class="uk-accordion-title uk-text-small uk-padding-small uk-padding-remove-vertical" href="#">
|
||||
<span class="accordion-title-num">
|
||||
<svg height="27" width="27">
|
||||
<circle cx="13" cy="13" r="13" stroke-width="1"></circle>
|
||||
<text x="50%" y="50%" text-anchor="middle" dy=".3em" font-size="14">
|
||||
3
|
||||
</text>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="uk-margin-small-left">Select Parameters</span>
|
||||
</a>
|
||||
<div class="uk-accordion-content uk-text-small uk-padding-small uk-padding-remove-vertical">
|
||||
<p>
|
||||
...
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<a uk-sticky="end: true" class="uk-sticky uk-card-footer uk-button-link uk-text-center" (click)="help=false">Dismiss Help</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div *ngIf="!help" class="quick-contact uk-align-right">
|
||||
<div *ngIf="!help" class="quick-contact uk-align-right uk-padding uk-padding-remove-vertical">
|
||||
<button class="uk-button uk-box-shadow-default uk-box-shadow-default-hover uk-button-secondary uk-flex uk-flex-middle"
|
||||
(click)="help = true">
|
||||
<icon name="lightbulb" [flex]="true"></icon>
|
||||
|
|
|
@ -23,3 +23,33 @@
|
|||
//right: 5vw;
|
||||
z-index: @global-z-index - 20;
|
||||
}
|
||||
|
||||
li.uk-open .accordion-title-num {
|
||||
& > * {
|
||||
color: @global-inverse-color;
|
||||
}
|
||||
|
||||
circle {
|
||||
fill: @global-primary-background;
|
||||
}
|
||||
|
||||
text {
|
||||
stroke: currentColor;
|
||||
fill: currentColor;
|
||||
}
|
||||
}
|
||||
|
||||
li:not(.uk-open) .accordion-title-num {
|
||||
& > * {
|
||||
color: @global-muted-color;
|
||||
}
|
||||
|
||||
circle {
|
||||
fill: @global-muted-background;
|
||||
}
|
||||
|
||||
text {
|
||||
stroke: currentColor;
|
||||
fill: currentColor;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1 +1 @@
|
|||
Subproject commit ae7e623418e7362e80cf9f65db7a004c0857d239
|
||||
Subproject commit 9e58421a1adf3fbeb361e21616feaea8c7f867af
|
|
@ -1 +1 @@
|
|||
Subproject commit 98077993a6eba7998b18fbfdee223409f0829ae6
|
||||
Subproject commit 5feca2d8457324999557feb662b4355d8cf0df4b
|
Loading…
Reference in New Issue