Каков наилучший способ стиля с использованием углового дизайна материала 2

Question

Я новичок в дизайне материала с угловым 2, который я вижу, был основным, акцентом и предупреждением, который дает соответствующие цвета элементу, это только те вещи, которые мы может стилизовать приложение, используя угловой материал 2? есть и другой класс? так что мы можем модифицировать и использовать его для нашей цели, или нам нужно стилизовать наше приложение с нуля, производя классы и прикрепляясь к элементу,

Также я хочу использовать темы, но я не знаю, как их использовать в угловых 2 проекта, Im следуя официальной документации this

Я включил эту линию в style.css, но ничего не произошло

@import '~@angular/material/core/theming/prebuilt/deeppurple-amber.css' 

что такое понятие темы кстати

Answer 1

Если вы используете угловую-CLI , который я рекомендую вам сделать.

Создайте «custom-theme.scss» в папке вашего приложения.

@import '~@angular/material/core/theming/all-theme'; 
// Plus imports for other components in your app. 

// Include the base styles for Angular Material core. We include this here so that you only 
// have to load a single css file for Angular Material in your app. 
@include md-core(); 

// Define the palettes for your theme using the Material Design palettes available in palette.scss 
// (imported above). For each palette, you can optionally specify a default, lighter, and darker 
// hue. 
$primary: md-palette($md-indigo); 
$accent: md-palette($md-pink, A200, A100, A400); 

// The warn palette is optional (defaults to red). 
$warn: md-palette($md-red); 

// Create the theme object (a Sass map containing all of the palettes). 
$theme: md-light-theme($primary, $accent, $warn); 

// Include theme styles for core and each component used in your app. 
// Alternatively, you can import and @include the theme mixins for each component 
// that you are using. 
@include angular-material-theme($theme); 

В вашем угловом-cli.json добавить пользовательский стиль стили:

app/custom-theme.scss