Vaadin Grid Drag&Drop 更改放置目标突出显示颜色
Vaadin Grid Drag&Drop change drop target highlighting color
我需要更改 Vaadin 14 Grid 中可能放置目标的突出显示颜色。为了说明,我正在使用“介于”之间的放置模式,这会产生一条紫色的线:
如何更改紫色线条的颜色?
Vaadin教程不易理解,建议using a CSS selector ending with -drag-center (Vaadin 8) or using .v-drag-over-target.card selector。但这似乎不起作用,也许我需要用其他东西替换第二个建议中的“v”?
由于紫色,我假设您使用的是 Material 主题。我还假设您设置了自定义主题,如 here 所述。如果没有,该页面将说明如何设置自定义主题。
自定义网格行拖动指示器的颜色:
- 在您的项目文件夹中,创建一个文件
frontend/themes/<your-custom-theme-name>/components/vaadin-grid.css
- 将以下内容添加到 CSS 文件中:
[part~='row'][dragover] [part~='cell']::after {
background: green; /* replace with the color you want */
}
我需要更改 Vaadin 14 Grid 中可能放置目标的突出显示颜色。为了说明,我正在使用“介于”之间的放置模式,这会产生一条紫色的线:
如何更改紫色线条的颜色?
Vaadin教程不易理解,建议using a CSS selector ending with -drag-center (Vaadin 8) or using .v-drag-over-target.card selector。但这似乎不起作用,也许我需要用其他东西替换第二个建议中的“v”?
由于紫色,我假设您使用的是 Material 主题。我还假设您设置了自定义主题,如 here 所述。如果没有,该页面将说明如何设置自定义主题。
自定义网格行拖动指示器的颜色:
- 在您的项目文件夹中,创建一个文件
frontend/themes/<your-custom-theme-name>/components/vaadin-grid.css
- 将以下内容添加到 CSS 文件中:
[part~='row'][dragover] [part~='cell']::after {
background: green; /* replace with the color you want */
}