Question

尝试更改复选框颜色（由于更改强调色）会导致黑色复选框。

因此，我安装了node-sass并成功更改了其他各种样式，例如，使用$hover-color: cornsilk;的行的悬停颜色

但是以某种方式使用： $accent-color: #fffff1;或$ag-mat-accent: #fffff1; 只会将其从默认的粉红色更改为黑色。

$ag-icons-path: "~ag-grid-community/src/styles/ag-theme-material/icons/";

$accent-color: #fffff1;
$icon-color: #03a9f4;
$hover-color: cornsilk;

@import "~ag-grid-community/src/styles/ag-grid.scss";
@import "~ag-grid-community/src/styles/ag-theme-material/sass/ag-theme-material.scss";

我的预期结果是选中该复选框。相反，无论选择什么颜色，我都会得到黑色。

Answer 1

您可以尝试在scss中设置以下变量。希望对您有帮助！

@import '~ag-grid-community/src/styles/ag-grid';

// set the colors to the ones from the material theme
$ag-mat-accent: #fffff1;

// Import the ag-Grid material-next theme
@import '~ag-grid-community/src/styles/ag-theme-material/sass/ag-theme-material';

示例的源代码可以在这里找到：https://github.com/ag-grid/ag-grid-material/blob/master/angular-material/src/styles.scss#L22-L23

Answer 2

这很简单，只需转到node_module ---> ag-grid-community ---> dist ---> styles ---> ag-theme-material.css --->查找如下样式，并根据需要更改颜色。

.ag-theme-material .ag-icon-checkbox-checked {
color: #0076c6; }

Answer 3

将以下 CSS 添加到 style.scss 文件中：

.ag-theme-material .ag-checkbox-input-wrapper.ag-checked::after {
  color: #fffff1 !important;
}

如何更改复选框的颜色？ AG网格

3 个答案: