fix: minor visual bug fixes after angular 15 migration

* added user style to defaultConfig.json in apps it was missing, since it now won't load without it * fixed mailing lists checkbox misalignment * added the visibility icon to the form field in settings-samba-password.component * fixed a bug that made password form jump when spinner was visible (global spinner margin was removed, it was added just for a slight visual change, I believe we can do without it)
CESNET · Mar 8, 2023 · a8449d9 · a8449d9
1 parent 7b0d55d
commit a8449d9
Show file tree

Hide file tree

Showing 10 changed files with 34 additions and 37 deletions.
diff --git a/apps/admin-gui/src/_styles.scss b/apps/admin-gui/src/_styles.scss
@@ -1682,11 +1682,6 @@ table .mdc-text-field--outlined {
   flex-wrap: wrap;
 }
 
-// extra spinner padding in dialog
-.mat-mdc-dialog-container .mat-mdc-progress-spinner {
-  margin: 24px;
-}
-
 .mat-mdc-checkbox label,
 .mat-mdc-radio-button label,
 .mat-mdc-slide-toggle label {

diff --git a/apps/consolidator/src/assets/config/defaultConfig.json b/apps/consolidator/src/assets/config/defaultConfig.json
@@ -80,6 +80,7 @@
     "footer_bg_color": "#263238",
     "footer_headers_text_color": "#ffffff",
     "footer_links_text_color": "#e0e0e0",
-    "footer_copyright_text_color": "#9e9e9e"
+    "footer_copyright_text_color": "#9e9e9e",
+    "user_color": "#00796b"
   }
 }
diff --git a/apps/linker/src/assets/config/defaultConfig.json b/apps/linker/src/assets/config/defaultConfig.json
@@ -15,6 +15,9 @@
   "mfa": {
     "url_en": "https://mfa.id.muni.cz/"
   },
+  "theme": {
+  "user_color": "#00796b"
+  },
   "application": "Linker",
   "document_title": "Linker",
   "support_mail": "[email protected]",

diff --git a/apps/password-reset/src/_styles.scss b/apps/password-reset/src/_styles.scss
@@ -78,9 +78,16 @@ $password-reset-theme: mat.define-light-theme(
   $user-primary: mat.define-palette($user-dynamic-colors, 500);
   $user-accent: mat.define-palette(mat.$green-palette, 600);
 
-  $user-theme: mat.define-light-theme($user-primary, $user-accent);
+  $user-theme: mat.define-light-theme(
+    (
+      color: (
+        primary: $user-primary,
+        accent: $user-accent,
+      ),
+    )
+  );
 
-  @include mat.all-component-themes($user-theme);
+  @include mat.all-component-colors($user-theme);
 }
 
 .mat-mdc-unelevated-button {

diff --git a/apps/password-reset/src/assets/config/defaultConfig.json b/apps/password-reset/src/assets/config/defaultConfig.json
@@ -100,7 +100,8 @@
     "footer_bg_color": "#263238",
     "footer_headers_text_color": "#ffffff",
     "footer_links_text_color": "#e0e0e0",
-    "footer_copyright_text_color": "#9e9e9e"
+    "footer_copyright_text_color": "#9e9e9e",
+    "user_color": "#00796b"
   },
   "password_help": {
     "default": "Password must be at least 8 characters long. Please <b>avoid using accented characters</b>. It might not be supported by all backend components and services.",

diff --git a/apps/publications/src/_styles.scss b/apps/publications/src/_styles.scss
@@ -436,11 +436,6 @@ mat-form-field mat-icon {
   letter-spacing: normal;
 }
 
-// extra spinner padding in dialog
-.mat-mdc-dialog-container .mat-mdc-progress-spinner {
-  margin: 24px;
-}
-
 .mat-mdc-checkbox label,
 .mat-mdc-radio-button label,
 .mat-mdc-slide-toggle label {

diff --git a/apps/user-profile/src/_styles.scss b/apps/user-profile/src/_styles.scss
@@ -325,11 +325,6 @@ mat-list-item .mat-mdc-form-field-subscript-wrapper {
   flex-wrap: wrap;
 }
 
-// extra spinner padding in dialog
-.mat-mdc-dialog-container .mat-mdc-progress-spinner {
-  margin: 24px;
-}
-
 .mat-mdc-checkbox label,
 .mat-mdc-radio-button label,
 .mat-mdc-slide-toggle label {

diff --git a/...rc/app/pages/settings-page/settings-samba-password/settings-samba-password.component.html b/...rc/app/pages/settings-page/settings-samba-password/settings-samba-password.component.html
@@ -9,21 +9,20 @@ <h1 class="page-title">{{'SAMBA_PASSWORD.TITLE' | customTranslate | translate}}<
 <mat-form-field class="input-width">
   <mat-label>{{'SAMBA_PASSWORD.INPUT_PLACEHOLDER'|customTranslate | translate}}</mat-label>
   <input [formControl]="sambaControl" [type]="showPassword ? 'text': 'password'" matInput />
+  <mat-icon matIconSuffix (click)="showPassword = !showPassword">
+    {{showPassword ? "visibility_off": "visibility"}}
+  </mat-icon>
 </mat-form-field>
-<button
-  (click)="showPassword = !showPassword"
-  [matTooltip]="showPassword ? hidePwdTooltip : showPwdTooltip"
-  disableRipple
-  mat-icon-button>
-  <mat-icon>{{showPassword ? 'visibility_off' : 'visibility'}}</mat-icon>
-</button>
-<button
-  (click)="setSambaPassword()"
-  [disabled]="sambaControl.value.length === 0 || sambaControl.invalid"
-  color="accent"
-  mat-flat-button>
-  {{'SAMBA_PASSWORD.SET_PASSWORD'|customTranslate | translate}}
-</button>
+
+<div>
+  <button
+    (click)="setSambaPassword()"
+    [disabled]="sambaControl.value.length === 0 || sambaControl.invalid"
+    color="accent"
+    mat-flat-button>
+    {{'SAMBA_PASSWORD.SET_PASSWORD'|customTranslate | translate}}
+  </button>
+</div>
 
 <perun-web-apps-alert
   *ngIf="sambaControl.invalid"

diff --git a/...rc/app/pages/settings-page/settings-samba-password/settings-samba-password.component.scss b/...rc/app/pages/settings-page/settings-samba-password/settings-samba-password.component.scss
@@ -0,0 +1,3 @@
+.input-width {
+  min-width: 500px;
+}
diff --git a/libs/perun/components/src/lib/settings-mailing-lists/mailing-lists.component.html b/libs/perun/components/src/lib/settings-mailing-lists/mailing-lists.component.html
@@ -35,12 +35,10 @@ <h1 class="page-title">
           </mat-expansion-panel-header>
           <div class="row">
             <mat-checkbox
-              class="ms-3 me-2"
               [checked]="optOutAttribute && optOutAttribute.value !== null"
-              (change)="setOptOut()"></mat-checkbox>
-            <p>
+              (change)="setOptOut()">
               {{'SHARED_LIB.PERUN.COMPONENTS.OPT_OUT_MAILING_LISTS.OPT_OUT_LABEL' | customTranslate | translate}}
-            </p>
+            </mat-checkbox>
           </div>
         </mat-expansion-panel>
       </mat-accordion>