如何自定义农业网格图标？

Question

我正在尝试在农业网格中实现一些自定义，例如：

1. 更改网格标题的图标-排序图标，过滤器菜单图标，过滤器菜单中不同菜单项的图标，等等。
2. 更改图标的位置。

谁能指出我可能的解决方法？

Answer 1

根据docs，您可以在加载ag-grid.css（或scss）文件和ag-theme-<themename>.css文件后尝试使用此CSS。在我的示例中，该主​​题文件适用于Balham主题ag-theme-balham.css。该CSS会将图标从默认的黑色（使用SVG）更改为白色。

/*
 * The override should be placed after the import of the theme.
 * Alternatively, you can aso increase the selector's specificity.
 */
.ag-theme-balham .ag-icon-desc,
.ag-theme-balham .ag-icon-asc,
.ag-theme-balham .ag-icon-menu
{
    font-family: "Font Awesome 5 Free";
    /* FontAwesome uses font-weight bold */
    font-weight: bold;
}

.ag-theme-balham .ag-icon-desc::before
{
    content: '\f063';
    color: white;
}

.ag-theme-balham .ag-icon-asc::before
{
    content: '\f062';
    color: white;
}

.ag-theme-balham .ag-icon-menu::before
{
    content: '\f0c9';
    color: white;
}