next-ucap-messenger/projects/ucap-webmessenger-ui-chat/src/lib/components/form.component.html
2019-11-25 09:05:35 +09:00

70 lines
1.6 KiB
HTML

<div
class="container"
fxFlex="0 0 auto"
fxLayout="row"
fxLayoutAlign="center center"
>
<div class="add-option">
<button mat-icon-button class="material-icons" (click)="onClickFileInput()">
<mat-icon>attach_file</mat-icon>
</button>
<input
type="file"
#fileInput
style="display: none"
multiple
(change)="onChangeFileInput()"
/>
<button
mat-icon-button
class="material-icons"
(click)="onClickStickerSelector()"
>
<mat-icon>sentiment_satisfied_alt</mat-icon>
</button>
<!-- <button mat-icon-button class="material-icons">
<mat-icon>g_translate</mat-icon>
</button> -->
</div>
<form
#replyForm="ngForm"
(ngSubmit)="onSend($event)"
(keydown.enter)="onSend($event)"
fxFlex
fxLayout="row"
fxLayoutAlign="start center"
>
<mat-form-field
class="message-text"
fxFlex
floatLabel="never"
appearance="standard"
>
<textarea
matInput
#replyInput
placeholder="Type your message"
ngModel
name="message"
[matTextareaAutosize]="true"
[matAutosizeMinRows]="1"
[matAutosizeMaxRows]="20"
></textarea>
</mat-form-field>
<button
class="send-message-button bg-primary-darkest"
mat-icon-button
type="submit"
aria-label="Send message"
>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="butt" stroke-linejoin="round">
<path d="M12 19V6M5 12l7-7 7 7" /></svg>
</button>
</form>
</div>