Add "new publication" button.
This commit is contained in:
@@ -1,4 +1,12 @@
|
|||||||
<h1>Your publications</h1>
|
<h1>Your publications</h1>
|
||||||
|
|
||||||
|
<a [routerLink]="['/publications/new']"
|
||||||
|
class="new-publication"
|
||||||
|
matTooltip="Add a new publication"
|
||||||
|
matTooltipPosition="left">
|
||||||
|
+
|
||||||
|
</a>
|
||||||
|
|
||||||
@if ((isLoading$ | async) === true) {
|
@if ((isLoading$ | async) === true) {
|
||||||
<h2>Publication loading...</h2>
|
<h2>Publication loading...</h2>
|
||||||
<mat-spinner></mat-spinner>
|
<mat-spinner></mat-spinner>
|
||||||
|
|||||||
@@ -1,5 +1,29 @@
|
|||||||
|
$newPublicationButtonSize: 1.7em;
|
||||||
|
|
||||||
:host {
|
:host {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
|
.new-publication {
|
||||||
|
position: fixed;
|
||||||
|
border-radius: 10em;
|
||||||
|
background-color: #14A44D;
|
||||||
|
color: white;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
bottom: $newPublicationButtonSize;
|
||||||
|
right: $newPublicationButtonSize;
|
||||||
|
width: $newPublicationButtonSize;
|
||||||
|
height: $newPublicationButtonSize;
|
||||||
|
text-decoration: none;
|
||||||
|
box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
|
||||||
|
transition: background-color .2s ease-in-out;
|
||||||
|
font-size: 2.2em;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #0e7a3a;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@@ -5,6 +5,8 @@ import { Observable } from "rxjs";
|
|||||||
import { PublicationListComponent } from "../../components/publication-list/publication-list.component";
|
import { PublicationListComponent } from "../../components/publication-list/publication-list.component";
|
||||||
import { Publication } from "../../core/rest-services/publications/model/publication";
|
import { Publication } from "../../core/rest-services/publications/model/publication";
|
||||||
import { CommonModule } from "@angular/common";
|
import { CommonModule } from "@angular/common";
|
||||||
|
import { RouterModule } from "@angular/router";
|
||||||
|
import { MatTooltipModule } from "@angular/material/tooltip";
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
@@ -12,7 +14,13 @@ import { CommonModule } from "@angular/common";
|
|||||||
standalone: true,
|
standalone: true,
|
||||||
templateUrl: './my-publications.component.html',
|
templateUrl: './my-publications.component.html',
|
||||||
styleUrl: './my-publications.component.scss',
|
styleUrl: './my-publications.component.scss',
|
||||||
imports: [CommonModule, MatProgressSpinnerModule, PublicationListComponent],
|
imports: [
|
||||||
|
CommonModule,
|
||||||
|
MatProgressSpinnerModule,
|
||||||
|
PublicationListComponent,
|
||||||
|
MatTooltipModule,
|
||||||
|
RouterModule
|
||||||
|
],
|
||||||
providers: [MyPublicationsService]
|
providers: [MyPublicationsService]
|
||||||
})
|
})
|
||||||
export class MyPublicationsComponent implements OnInit {
|
export class MyPublicationsComponent implements OnInit {
|
||||||
|
|||||||
Reference in New Issue
Block a user