Globally set Material form field 'appearance' to 'outline'

ppaternostro · ppaternostro · commit 11f8a4378799 · 2026-02-12T14:10:58.000-05:00
Also set 'subscriptSizing' to 'dynamic' to only add spacing below the form fields when errors are triggered
diff --git a/src/app/app.config.ts b/src/app/app.config.ts
@@ -5,8 +5,9 @@ import {
 } from '@angular/core';
 import { provideRouter } from '@angular/router';
 
-import { routes } from './app.routes';
 import { provideHttpClient } from '@angular/common/http';
+import { MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
+import { routes } from './app.routes';
 import { GlobalErrorHandler } from './error-handler/error-handler';
 
 export const appConfig: ApplicationConfig = {
@@ -15,5 +16,9 @@ export const appConfig: ApplicationConfig = {
     provideZoneChangeDetection({ eventCoalescing: true }),
     provideRouter(routes),
     { provide: ErrorHandler, useClass: GlobalErrorHandler },
+    {
+      provide: MAT_FORM_FIELD_DEFAULT_OPTIONS,
+      useValue: { appearance: 'outline', subscriptSizing: 'dynamic' },
+    },
   ],
 };
