to the top button
This commit is contained in:
parent
40afc348e1
commit
638868875b
@ -1,4 +1,4 @@
|
||||
<rb-full-header>
|
||||
<rb-full-header id="top">
|
||||
<nav *rbMainNavItems>
|
||||
<a routerLink="/home" routerLinkActive="active" rbLoadingLink>Home</a>
|
||||
<a routerLink="/samples" routerLinkActive="active" rbLoadingLink *ngIf="login.isLoggedIn">Samples</a>
|
||||
@ -45,6 +45,12 @@
|
||||
</div>
|
||||
</rb-full-header>
|
||||
|
||||
<div class="container">
|
||||
<router-outlet></router-outlet>
|
||||
<div class="to-the-top-container">
|
||||
<div class="container">
|
||||
<router-outlet></router-outlet>
|
||||
</div>
|
||||
|
||||
<div class="to-the-top">
|
||||
<rb-icon-button icon="up" mode="primary" iconOnly (click)="toTheTop()"></rb-icon-button>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -13,3 +13,21 @@
|
||||
.bug-textarea {
|
||||
width: 800px;
|
||||
}
|
||||
|
||||
.to-the-top-container {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.to-the-top {
|
||||
position: absolute;
|
||||
top: 100vh;
|
||||
bottom: 10px;
|
||||
right: 1rem;
|
||||
pointer-events: none;
|
||||
|
||||
rb-icon-button {
|
||||
position: sticky;
|
||||
pointer-events: all;
|
||||
top: calc(100vh - 3rem);
|
||||
}
|
||||
}
|
||||
|
@ -59,6 +59,10 @@ URL: ${window.location}%0D%0A%0D%0AWhat did you do?%0D%0A${encodeURIComponent(th
|
||||
closeBugReport(close) {
|
||||
setTimeout(() => close(), 1);
|
||||
}
|
||||
|
||||
toTheTop() {
|
||||
window.scroll(0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
@ -52,6 +52,7 @@ rb-table {
|
||||
}
|
||||
|
||||
.paging {
|
||||
height: 50px;
|
||||
rb-form-input {
|
||||
max-width: 50px;
|
||||
}
|
||||
|
@ -13,6 +13,10 @@ $rb-extended-breakpoints: false; // whether to use extended breakpoints xxl and
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
a, a:active, a:focus {
|
||||
outline: 0 !important;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user