[Validator | right-col-temp]: [WIP] oaipmh-validator.component: Updates in right sidebar of validation page.
This commit is contained in:
parent
e9c22bfe73
commit
36833e9879
|
@ -69,13 +69,14 @@
|
|||
<!-- </div>-->
|
||||
|
||||
<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">
|
||||
class="uk-width-1-3 uk-width-1-4@l uk-padding-remove uk-text-small uk-visible@m uk-background-primary">
|
||||
<div class="uk-sticky" uk-sticky="end: true" [attr.offset]="offset">
|
||||
<div #right_sidebar class="uk-height-1-1">
|
||||
<div class="uk-height-1-1">
|
||||
<div #right_sidebar_header class="uk-section uk-section-small uk-background-primary">
|
||||
<div #right_sidebar_header class="uk-section uk-section-small">
|
||||
<div class="uk-h5 uk-light uk-text-center">Help</div>
|
||||
</div>
|
||||
<div class="uk-card uk-card-default" [style]="'height: ' + right_sidebar_card_height + 'px;'">
|
||||
<div class="uk-overflow-auto uk-padding-remove-horizontal" [style]="'height: ' + right_sidebar_body_height + 'px;'">
|
||||
<div class="uk-card-body">
|
||||
<ul uk-accordion>
|
||||
|
@ -84,7 +85,7 @@
|
|||
<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">
|
||||
<text x="50%" y="50%" text-anchor="middle" dy=".2em" font-size="12" font-weight="200">
|
||||
1
|
||||
</text>
|
||||
</svg>
|
||||
|
@ -103,7 +104,7 @@
|
|||
<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">
|
||||
<text x="50%" y="50%" text-anchor="middle" dy=".2em" font-size="12" font-weight="200">
|
||||
2
|
||||
</text>
|
||||
</svg>
|
||||
|
@ -124,7 +125,7 @@
|
|||
<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">
|
||||
<text x="50%" y="50%" text-anchor="middle" dy=".2em" font-size="12" font-weight="200">
|
||||
3
|
||||
</text>
|
||||
</svg>
|
||||
|
@ -141,6 +142,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<a #right_sidebar_footer 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>
|
||||
|
|
|
@ -12,6 +12,13 @@
|
|||
height: @sidebar-height;
|
||||
}
|
||||
|
||||
.uk-card {
|
||||
border-top-left-radius: 25px;
|
||||
border-top-right-radius: 25px;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
//& > .uk-card {
|
||||
// height: @sidebar-height -
|
||||
//}
|
||||
|
|
|
@ -32,6 +32,7 @@ export class OaipmhValidatorComponent implements OnInit {
|
|||
public help: boolean = false;
|
||||
|
||||
public right_sidebar_body_height: number = 0;
|
||||
public right_sidebar_card_height: number = 0;
|
||||
|
||||
subscriptions = [];
|
||||
|
||||
|
@ -73,7 +74,8 @@ export class OaipmhValidatorComponent implements OnInit {
|
|||
console.log(this.right_sidebar.nativeElement.offsetHeight);
|
||||
console.log(this.right_sidebar_header.nativeElement.offsetHeight);
|
||||
console.log(this.right_sidebar_footer.nativeElement.offsetHeight);
|
||||
this.right_sidebar_body_height = this.right_sidebar.nativeElement.offsetHeight - this.right_sidebar_header.nativeElement.offsetHeight - this.right_sidebar_footer.nativeElement.offsetHeight;
|
||||
this.right_sidebar_card_height = this.right_sidebar.nativeElement.offsetHeight - this.right_sidebar_header.nativeElement.offsetHeight + 1;
|
||||
this.right_sidebar_body_height = this.right_sidebar_card_height - this.right_sidebar_footer.nativeElement.offsetHeight;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue