From a0f3100b7e533c3eb266e38ef0e747dfd2adb2ae Mon Sep 17 00:00:00 2001
From: Klaus Quibeldey-Cirkel <klaus-dieter.quibeldey-cirkel@mni.thm.de>
Date: Tue, 3 Aug 2021 16:18:49 +0200
Subject: [PATCH] wording & styling
---
.../create-comment.component.html | 48 +++++++++++++------
.../create-comment.component.scss | 9 ++--
src/assets/i18n/creator/de.json | 2 +-
src/assets/i18n/creator/en.json | 2 +-
src/assets/i18n/participant/de.json | 2 +-
src/assets/i18n/participant/en.json | 2 +-
6 files changed, 41 insertions(+), 24 deletions(-)
diff --git a/src/app/components/shared/_dialogs/create-comment/create-comment.component.html b/src/app/components/shared/_dialogs/create-comment/create-comment.component.html
index 66e9ee29f..650b336c1 100644
--- a/src/app/components/shared/_dialogs/create-comment/create-comment.component.html
+++ b/src/app/components/shared/_dialogs/create-comment/create-comment.component.html
@@ -1,18 +1,24 @@
<ars-row ars-flex-box>
<ars-row>
<div class="lang-selection">
- <button class="lang-btn" mat-button (click)="select.open()"
+ <button class="lang-btn"
+ mat-button
+ (click)="select.open()"
matTooltip="{{ 'spacy-dialog.lang-button-hint' | translate }}"
matTooltipShowDelay="750">
<i class="material-icons">language</i>
<span *ngIf="!(grammarChecker.selectedLang === 'auto')">
{{'spacy-dialog.' + (languagetoolService.mapLanguageToSpacyModel(grammarChecker.selectedLang)) | translate}}
</span>
- <span *ngIf="(grammarChecker.selectedLang === 'auto')" id="langSelect">
+ <span *ngIf="(grammarChecker.selectedLang === 'auto')"
+ id="langSelect">
auto
</span>
- <mat-select class="select-list" #select [(ngModel)]="grammarChecker.selectedLang">
- <mat-option *ngFor="let lang of grammarChecker.languages" [value]="lang">
+ <mat-select class="select-list"
+ #select
+ [(ngModel)]="grammarChecker.selectedLang">
+ <mat-option *ngFor="let lang of grammarChecker.languages"
+ [value]="lang">
<span *ngIf="lang == 'de-DE'">{{ 'spacy-dialog.de' | translate }}</span>
<span *ngIf="lang == 'en-US'">{{ 'spacy-dialog.en' | translate }}</span>
<span *ngIf="lang == 'fr'">{{ 'spacy-dialog.fr' | translate }}</span>
@@ -23,15 +29,21 @@
</div>
<div class="anchor-wrp">
<div class="anchor-right">
- <mat-form-field *ngIf="tags" class="tag-form-field">
+ <mat-form-field *ngIf="tags"
+ class="tag-form-field">
<mat-label>
- <mat-icon class="icon-svg" svgIcon="comment_tag"></mat-icon>
+ <mat-icon class="icon-svg"
+ svgIcon="comment_tag"></mat-icon>
{{'comment-page.tag' | translate}}
</mat-label>
<label for="tagSelect">{{selectedTag}}</label>
- <mat-select [(ngModel)]="selectedTag" class="tag-select" id="tagSelect" style="display: inline">
+ <mat-select [(ngModel)]="selectedTag"
+ class="tag-select"
+ id="tagSelect"
+ style="display: inline">
<mat-option>{{'comment-page.tag-reset' | translate}}</mat-option>
- <mat-option *ngFor="let tag of tags" value="{{tag}}">{{tag}}</mat-option>
+ <mat-option *ngFor="let tag of tags"
+ value="{{tag}}">{{tag}}</mat-option>
</mat-select>
</mat-form-field>
</div>
@@ -43,9 +55,11 @@
<mat-divider></mat-divider>
</ars-row>
<ars-row [height]="12"></ars-row>
- <ars-row [overflow]="'visible'" style="max-height:calc( 100vh - 250px )">
+ <ars-row [overflow]="'visible'"
+ style="max-height:calc( 100vh - 250px )">
<mat-form-field style="width:100%;">
- <input [disabled]="true" matInput>
+ <input [disabled]="true"
+ matInput>
<div
(document:click)="grammarChecker.onDocumentClick($event)"
[contentEditable]="true"
@@ -88,7 +102,10 @@
</ars-row>
<ars-row [height]="12"></ars-row>
<ars-row>
- <markdown katex emoji lineNumbers lineHighlight
+ <markdown katex
+ emoji
+ lineNumbers
+ lineHighlight
[data]="commentBody.innerText"></markdown>
</ars-row>
</mat-tab>
@@ -97,14 +114,17 @@
<ars-row style="margin-top:8px">
<mat-divider></mat-divider>
</ars-row>
- <ars-row ars-flex-box class="spellcheck">
+ <ars-row ars-flex-box
+ class="spellcheck">
<ars-col>
<button
[disabled]="this.commentBody.innerHTML.length < 4 "
- mat-flat-button class="spell-button"
+ mat-flat-button
+ class="spell-button"
(click)="grammarChecker.grammarCheck(commentBody)">
{{ 'comment-page.grammar-check' | translate}}
- <mat-icon *ngIf="grammarChecker.isSpellchecking" style="margin: 0;">
+ <mat-icon *ngIf="grammarChecker.isSpellchecking"
+ style="margin: 0;">
<mat-spinner diameter="20"></mat-spinner>
</mat-icon>
</button>
diff --git a/src/app/components/shared/_dialogs/create-comment/create-comment.component.scss b/src/app/components/shared/_dialogs/create-comment/create-comment.component.scss
index 71cdaac90..6dfd110ae 100644
--- a/src/app/components/shared/_dialogs/create-comment/create-comment.component.scss
+++ b/src/app/components/shared/_dialogs/create-comment/create-comment.component.scss
@@ -135,13 +135,10 @@ mat-hint {
}
.lang-confidence {
- color: var(--white);
- border: solid var(--red);
- border-width: thick;
- border-radius: 5px;
- background-color: var(--red);
- animation: shake 0.5s;
+ color: var(--on-cancel);
+ background-color: var(--cancel);
font-size: 16px;
+ padding: 5px;
}
@keyframes shake {
diff --git a/src/assets/i18n/creator/de.json b/src/assets/i18n/creator/de.json
index 8eca26db5..f72a36b04 100644
--- a/src/assets/i18n/creator/de.json
+++ b/src/assets/i18n/creator/de.json
@@ -93,7 +93,7 @@
"select-keyword-hint": "Dieses Wort als Stichwort auswählen",
"edit-keyword-hint": "Wort editieren",
"editing-done-hint": "Editieren beenden",
- "force-language-selection": "Die automatische Spracherkennung ist ungenau. Bitte überprüfe die erkannte Sprache.",
+ "force-language-selection": "Die Sprache der Eingabe konnte nicht automatisch erkannt werden.",
"add-manually": "Gib ein Stichwort zu deiner Frage ein. Trenne mehrere Stichwörter mit einem Komma.",
"select-keywords": "Die Textanalyse deiner Eingabe schlägt folgende Nomen als Stichwörter vor. Welche kennzeichnen deine Frage am besten?"
},
diff --git a/src/assets/i18n/creator/en.json b/src/assets/i18n/creator/en.json
index 302a1899a..8f719d162 100644
--- a/src/assets/i18n/creator/en.json
+++ b/src/assets/i18n/creator/en.json
@@ -94,7 +94,7 @@
"select-keyword-hint": "Select this keyword",
"edit-keyword-hint": "Edit keyword",
"editing-done-hint": "Finish editing",
- "force-language-selection": "Language detection inaccurate, please check language settings!",
+ "force-language-selection": "The language of the text input could not be detected automatically.",
"add-manually": "You can manually enter the keywords separated with a comma",
"select-keywords": "Choose the keywords for your question"
},
diff --git a/src/assets/i18n/participant/de.json b/src/assets/i18n/participant/de.json
index e3be2d4a0..bc605748a 100644
--- a/src/assets/i18n/participant/de.json
+++ b/src/assets/i18n/participant/de.json
@@ -99,7 +99,7 @@
"select-keyword-hint": "Dieses Wort als Stichwort auswählen",
"edit-keyword-hint": "Wort editieren",
"editing-done-hint": "Editieren beenden",
- "force-language-selection": "Die automatische Spracherkennung ist ungenau. Bitte überprüfe die erkannte Sprache.",
+ "force-language-selection": "Die Sprache der Eingabe konnte nicht automatisch erkannt werden.",
"add-manually": "Gib ein Stichwort zu deiner Frage ein. Trenne mehrere Stichwörter mit einem Komma.",
"select-keywords": "Die Textanalyse deiner Eingabe schlägt folgende Nomen als Stichwörter vor. Welche kennzeichnen deine Frage am besten?"
},
diff --git a/src/assets/i18n/participant/en.json b/src/assets/i18n/participant/en.json
index 6cf464454..f655d620b 100644
--- a/src/assets/i18n/participant/en.json
+++ b/src/assets/i18n/participant/en.json
@@ -109,7 +109,7 @@
"select-keyword-hint": "Select this keyword",
"edit-keyword-hint": "Edit keyword",
"editing-done-hint": "Finish editing",
- "force-language-selection": "Language detection inaccurate, please check language settings!",
+ "force-language-selection": "The language of the text input could not be detected automatically.",
"add-manually": "You can manually enter the keywords separated with a comma",
"select-keywords": "Choose the keywords for your question"
},
--
GitLab