andi/perfdb
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Activity

add preview for markup

Browse Source
This commit is contained in:
Andreas Huber
2023-04-04 18:46:34 +02:00
parent 75f45c4d87
commit 3386f0994f
4 changed files with 49 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
pdb-js/src/app/dashboard-page/dashboard/add-text-dialog/add-text-dialog.component.html
View File

@@ -1,15 +1,36 @@
<style>
markdown {
--mdc-dialog-supporting-text-color: black;
}
.mat-mdc-dialog-content {
display: flex;
justify-content: center;
height: 22em;
}
.mat-mdc-dialog-content > div {
width:50%;
}
.preview {
margin-left: 0.5em;
overflow: auto;
}
mat-form-field textarea {
height: 20em;
}
</style>
<h1 mat-dialog-title>Add Text</h1>
<div mat-dialog-content>
<mat-form-field class="pdb-form-full-width">
<mat-label>Text</mat-label>
<textarea matInput [(ngModel)]="text" #textElement focus></textarea>
</mat-form-field>
<div>Text field supports <a href="https://spec.commonmark.org/" class="external-link" target="_blank" rel="noopener">Markdown</a>.</div>
<div>
<mat-form-field class="pdb-form-full-width">
<mat-label>Text</mat-label>
<textarea matInput [(ngModel)]="text" #textElement focus ></textarea>
</mat-form-field>
<div>Text field supports <a href="https://spec.commonmark.org/" class="external-link" target="_blank" rel="noopener">Markdown</a>.</div>
</div>
<div class="preview">
<markdown [data]="this.text"></markdown>
</div>
</div>
<div mat-dialog-actions align="end">
<button mat-button mat-dialog-close (click)="close()">Cancel</button>