我正在尝试更改Clarity UI的数据网格过滤器下拉列表的位置,因为它们会降低我需要查看的信息 .
该位置采用内联样式,它允许我覆盖颜色,但位置不会改变 . 当我在开发人员工具样式面板中更改它时,它可以工作,但是当我尝试使用外部工作表覆盖它时 .
我也在寻找库生成这个div的地方但找不到它 . 任何帮助都会很棒,因为我想使用这个功能 .
Developer Tools Elements display
<div class="datagrid-filter ng-star-inserted"
style="position: absolute; top: 0px; bottom:
auto; left: 0px; right: auto;
transform: translateX(619.984px) translateY(329.172px);">
Developer Tools Styles display
代码--tag:value--表示删除线
element.style {
position: absolute;
--top: 0px--;
bottom: auto;
left: 0px;
right: auto;
transform: translateX(619.984px) translateY(329.172px);
}
.datagrid .datagrid-column .datagrid-filter, .datagrid .datagrid-head
.datagrid-row-actions .datagrid-filter {
--position: absolute--;
--top: 100%--;
--right: 0--;
margin-top: .2rem;
background: #fff;
padding: .75rem;
border: 1px solid #ccc;
---webkit-box-shadow: 0 1px 3px hsla(0,0%,45%,.25)--;
box-shadow: 0 1px 3px hsla(0,0%,45%,.25);
border-radius: .125rem;
font-weight: 400;
z-index: 1000;
}
.datagrid-filter {
top: -120px !important;
background-color: black !important;
}
My style usage
/deep/ .datagrid-filter {
top: -120px !important;
background-color:black !important;
}
我也试过/ deep / .datagrid-filter [style]无济于事 .
Visual example of dropdown