Material から Fluent テーマへの切り替え
バージョン 8.2 以降、インフラジスティックスのコンポーネントでは、Microsoft Fluent デザイン システム に基づいて構築された新しいテーマが含まれます。
Material から Fluent に切り替えるには、theme 組み込みのミキシンを使用します。
Word および Excel パレットもサポートしています。これらを使用するには、2 つの light マップ $light-fluent-excel-palette、$light-fluent-word-palette のいずれか、または 2 つの dark マップ dark-fluent-excel-palette、$light-fluent-word-palette のいずれかを theme ミックスインに渡すだけです。
Fluent Light テーマ
@use "igniteui-angular/theming" as *;
// IMPORTANT: Prior to Ignite UI for Angular version 13 use:
// @import '~igniteui-angular/lib/core/styles/themes/index';
@include core();
@include theme(
$palette: $light-fluent-palette,
$schema: $light-fluent-schema
);
// We can also include the Indigo font and font scaling
@include typography(
$font-family: $fluent-typeface,
$type-scale: $fluent-type-scale
);Fluent Dark テーマ
@use "igniteui-angular/theming" as *;
// IMPORTANT: Prior to Ignite UI for Angular version 13 use:
// @import '~igniteui-angular/lib/core/styles/themes/index';
@include core();
@include theme(
$palette: $dark-fluent-palette,
$schema: $dark-fluent-schema
);
@include typography(
$font-family: $fluent-typeface,
$type-scale: $fluent-type-scale
);