Skip to content

feat(add angular) #68

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Conversation

twerske
Copy link

@twerske twerske commented May 6, 2022

closes #38

Add export template for Angular Material theming based off of the CSS var exports (similar to the Web CSS option).

Thanks @rodydavis!

@Fitzchev
Copy link

Hi @twerske,

I was giving a try to the template (I'm using @angular/material 16.0.1) and I think I found 2 issues (if not mistaken) :

  • you can remove line 413, mat-core does not allow any parameters on v15 and so it's throwing an error. Maybe it is worth adding @include mat.typography-hierarchy($core-theme) instead ?

  • I have another issue with the define-typography-config: I had first to add the mat prefix to the define-typography-level but got another compile error to finally find out that the correct list should be the following (found @angular\material\core\typography_all-typography.scss) :

$font-family
$headline-1
$headline-2
$headline-3
$headline-4
$headline-5
$headline-6
$subtitle-1
$subtitle-2
$body-1
$body-2
$caption
$button
$overline

Really not sure of myself but wanted to let you know.

Would be cool also if the theme could be generated also via @material/material-color-utilities

A100: var(--md-sys-color-primary-light),
A200: var(--md-sys-color-primary-light),
A400: var(--md-sys-color-primary-light),
A700: var(--md-sys-color-primary-light),
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@twerske I am wondering if it is ok to use the same color for different tones and shouldn't we use something like this?

        50: var(--md-ref-palette-primary95),
        100: var(--md-ref-palette-primary90),
        200: var(--md-ref-palette-primary80),
        300: var(--md-ref-palette-primary70),
        400: var(--md-ref-palette-primary60),
        500: var(--md-ref-palette-primary40),
        600: var(--md-ref-palette-primary40),
        700: var(--md-ref-palette-primary30),
        800: var(--md-ref-palette-primary20),
        900: var(--md-ref-palette-primary10),

@singatias
Copy link

Hello any update on this? The issue #38 was closed but the PR was never merge.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Export for angular-material
4 participants