UI: Clear SCSS styles

ui-ngx/src/app/modules/login/pages/login/create-password.component.html

@@ -15,8 +15,8 @@
     limitations under the License.
 
 -->
-<div class="tb-create-password-content mat-app-background tb-dark flex flex-row items-center justify-center" style="width: 100%;">
-  <mat-card appearance="raised" class="tb-create-password-card flex-initial">
+<div class="tb-password-content mat-app-background tb-dark flex flex-row items-center justify-center" style="width: 100%;">
+  <mat-card appearance="raised" class="tb-password-card flex-initial">
     <mat-card-header class="px-6 pt-6">
       <mat-card-title class="text-xl font-normal" translate>login.create-password</mat-card-title>
     </mat-card-header>

ui-ngx/src/app/modules/login/pages/login/create-password.component.ts

@@ -24,7 +24,7 @@ import { passwordsMatchValidator, passwordStrengthValidator } from '@shared/mode
 @Component({
   selector: 'tb-create-password',
   templateUrl: './create-password.component.html',
-  styleUrls: ['./create-password.component.scss']
+  styleUrls: ['./password.component.scss']
 })
 export class CreatePasswordComponent {
 

ui-ngx/src/app/modules/login/pages/login/create-password.component.scss → ui-ngx/src/app/modules/login/pages/login/password.component.scss

@@ -18,10 +18,10 @@
 :host {
   display: flex;
   flex: 1 1 0;
-  .tb-create-password-content {
+  .tb-password-content {
     background-color: #eee;
     --mdc-elevated-card-container-elevation: none;
-    .tb-create-password-card {
+    .tb-password-card {
       @media #{$mat-gt-xs} {
         width: 450px !important;
       }

ui-ngx/src/app/modules/login/pages/login/reset-password-request.component.html

@@ -15,9 +15,9 @@
     limitations under the License.
 
 -->
-<div class="tb-request-password-reset-content mat-app-background tb-dark flex flex-row items-center justify-center"
+<div class="tb-password-content mat-app-background tb-dark flex flex-row items-center justify-center"
      style="width: 100%;">
-  <mat-card appearance="raised" class="tb-request-password-reset-card flex flex-initial">
+  <mat-card appearance="raised" class="tb-password-card flex flex-initial">
     <mat-card-header class="px-6 pt-6">
       <mat-card-title class="text-xl font-normal" translate>login.request-password-reset</mat-card-title>
     </mat-card-header>

ui-ngx/src/app/modules/login/pages/login/reset-password-request.component.scss

@@ -1,30 +0,0 @@
-/**
- * Copyright © 2016-2025 The Thingsboard Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-@import '../../../../../scss/constants';
-
-:host {
-  display: flex;
-  flex: 1 1 0;
-  .tb-request-password-reset-content {
-    background-color: #eee;
-    --mdc-elevated-card-container-elevation: none;
-    .tb-request-password-reset-card {
-      @media #{$mat-gt-xs} {
-        width: 450px !important;
-      }
-    }
-  }
-}

ui-ngx/src/app/modules/login/pages/login/reset-password-request.component.ts

@@ -27,7 +27,7 @@ import { validateEmail } from '@app/core/utils';
 @Component({
   selector: 'tb-reset-password-request',
   templateUrl: './reset-password-request.component.html',
-  styleUrls: ['./reset-password-request.component.scss']
+  styleUrls: ['./password.component.scss']
 })
 export class ResetPasswordRequestComponent extends PageComponent {
 

ui-ngx/src/app/modules/login/pages/login/reset-password.component.html

@@ -15,8 +15,8 @@
     limitations under the License.
 
 -->
-<div class="tb-reset-password-content mat-app-background tb-dark flex flex-row items-center justify-center" style="width: 100%;">
-  <mat-card appearance="raised" class="tb-reset-password-card flex-initial">
+<div class="tb-password-content mat-app-background tb-dark flex flex-row items-center justify-center" style="width: 100%;">
+  <mat-card appearance="raised" class="tb-password-card flex-initial">
     <mat-card-header class="px-6 pt-6">
       <mat-card-title class="text-xl font-normal" translate>login.password-reset</mat-card-title>
       <mat-card-subtitle *ngIf="isExpiredPassword" class="mt-4 whitespace-pre-line text-sm font-normal" translate>

ui-ngx/src/app/modules/login/pages/login/reset-password.component.scss

@@ -1,30 +0,0 @@
-/**
- * Copyright © 2016-2025 The Thingsboard Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-@import '../../../../../scss/constants';
-
-:host {
-  display: flex;
-  flex: 1 1 0;
-  .tb-reset-password-content {
-    background-color: #eee;
-    --mdc-elevated-card-container-elevation: none;
-    .tb-reset-password-card {
-      @media #{$mat-gt-sm} {
-        width: 450px !important;
-      }
-    }
-  }
-}

ui-ngx/src/app/modules/login/pages/login/reset-password.component.ts

@@ -24,7 +24,7 @@ import { passwordsMatchValidator, passwordStrengthValidator } from '@shared/mode
 @Component({
   selector: 'tb-reset-password',
   templateUrl: './reset-password.component.html',
-  styleUrls: ['./reset-password.component.scss']
+  styleUrls: ['./password.component.scss']
 })
 export class ResetPasswordComponent {