Questions tagged [angular-material-15]
27 questions
18
votes
4 answers
Angular Material v15 Theme + Typography, default text not styled
When I customize the theme to set a font...
some text gets properly styled (e.g. etc)
but some other does not (e.g.
Julien
- 3,613
- 2
- 23
- 25
5
votes
1 answer
Overwrite CSS variables from Angular Material 15
The new Angular Material 15 has some "breaking" changes in regards of the colors and spacing. Therefore I need to overwrite the default values of the CSS variables. I define in my styles.scss
:root {
--mdc-typography-button-letter-spacing:…
LeO
- 4,238
- 4
- 48
- 88
2
votes
0 answers
Angular Material Theme not wroking after update from 14 to 15
Can anyone help me to understand what happened with my theme when I am update Angular & Angular Material from 14 to 15. The way I am using to create theme in Angular Material 14 I use the same way to create theme in Angular Material 15 with some…
prashant kushwah
- 121
- 1
- 3
- 15
2
votes
1 answer
Angular Material 15: How to customize the styling of buttons and input fields?
I would like to override the font width in Angular Material 15 buttons and input fields.
Material docs say here that I should do this in my stylesheet:
@use '@angular/material' as mat;
$my-custom-level: mat.define-typography-level(
$font-family:…
wogri
- 23
- 1
- 5
2
votes
1 answer
Migration to Angular Material from 14 to 15 fails
Following the migration guide i try to run
ng generate @angular/material:mdc-migration
This is the output i get:
? Limit the migration to a specific directory? (Enter the relative path such as 'src/app/shared' or leave blank for all directories)…
Juri
- 1,531
- 2
- 20
- 43
1
vote
0 answers
How to disable Ripple + hover effect from a mat-button in Angular Material 15
I'm using Angular 15 with Material 15 and trying to add a button without ripple effect / any hover effect's.
This used to work in angular material 12:
But now it's still showing ripple /…
Kenny vm
- 31
- 2
1
vote
0 answers
Angular 15 Material - CSS for Disabled Form Fields
Since our update to Angular 15, end users have been upset about the opacity of disabled form fields. I have been trying without success to access the class structure in css.
I have tried everything from:
.mat-mdc-form-field,…
Adam Raetz
- 61
- 5
1
vote
0 answers
err:NG 8001 mat-paginator is not known element in Angular 16
I am trying to add angular/material into the angular 16 project
For that i have created app.module.ts and mycomponent.module.ts & mycomponent.component.html.
Trying to run the 'ng serve' giving below err-
l:3:9 - error NG8001: 'mat-paginator' is not…
Anushweta
- 21
- 5
1
vote
1 answer
Angular 15 Material legacy components missing style
After upgrading my app from Angular 14 to 15 and adapted my Material components to the legacy ones, I have some style issues on some components. My mat-autocomplete and mat-select have imcomplete css on their mat-autocomplete-panel and…
Bamboozled
- 91
- 9
1
vote
1 answer
Angular Material 15: How to resize focused components such as autocomplete or datepicker?
i updated to material 15, i want ask how i can change height, or overall size of focused component such as autocomplete or datepicker,
https://m2.material.io/design/layout/applying-density.html#usage ,
this page is telling me i can't use density on…
matistikoff
- 11
- 3
1
vote
1 answer
Angular 15 (MDC) tooltip background color (via theme)
With Angular14 I was able to define the mat-tooltips background color via
$theme: (
color: (
...
background: (
...,
tooltip: red
)
)
)
@include mat.all-component-colors($theme);
Now a property…
tris
- 863
- 4
- 9
- 22
1
vote
0 answers
How to add mask for angular material date range picker?
Hello I am using angular material date range picker. (angular material 14).
John Doe
- 80
- 1
- 11
0
votes
0 answers
Adjust line-height of a button when upgrading from angular material 14 to 15
In my Angular 14 application (with Angular Material) I defined a custom line-height to all the buttons.
Then I updated from angular 14 to 15 (including angular material) and setting line-height in a button doesn't work anymore, i.e. it doesn't…
André
- 1,602
- 2
- 12
- 26
0
votes
1 answer
Remove hover and focus color on material form field in angular material 16?
A simple form like this
i like to be…
Juri
- 1,531
- 2
- 20
- 43
0
votes
0 answers
Angular 15 mat-checkbox, use own logic to check
I am using Angular 15 and also with it the Material Components. I wanted to use the material checkbox and implement my own function (the click function) where I set the checkItem.start to true/false and where I would expect that the checkbox should…
reti18
- 1