如何将 PrimeIcons 与自定义或 'none' 主题一起使用

Question

我将一个小型应用程序从 JSF 1.2 RF 3.3.3 迁移到 JSF 2.1 和 PF 7.0。（2.1 的原因是 JBoss EAP 6.1 只允许 java 7）

外观应该不会改变，所以我没有使用主题（web.xml中的主题none）。大多数问题可以用一些 CSS 来解决，但是对于 p:dataTable 我需要排序图标，主题 =none 有 none 存在。

有没有办法在不向应用程序添加一些图标的情况下使用 primefaces 中的一些默认排序图标？如果是，我该如何使用它？我用 PrimeIcons 尝试了一些东西，但没有让它工作。

Answer 1

图标是bundled with PrimeFaces，您可以像这样手动加载：

<h:outputStylesheet library="primefaces" name="primeicons/primeicons.css" />

这将允许您使用如下图标：

<i class="pi pi-xxx"></i>

但这不是 PrimeFaces 组件使用的。组件基于 jQuery UI icons, so classes like ui-icon ui-icon-xxx. So you need to create a custom style sheet taking care of the UI icons. You don't need to start from scratch, because you can find all of them in (for example) the Nova Light theme.

在上面链接的主题中，找到所有包含 .ui-icon 的规则，尤其是像这样的规则：

.ui-icon-xxx:before {
  content: "...";
}

（content 定义使用 PrimeIcons 字体中的哪个字形）然后将其合并到您的样式中 sheet。不幸的是，没有您可以复制和粘贴的部分，因此这将是一项艰巨的任务。

如何将 PrimeIcons 与自定义或 'none' 主题一起使用

How to use PrimeIcons with a custom or 'none' theme

jsf

primefaces