0

In my project I have a custom style, created by previous devs. I can't remove it and put a "normal" style, because the project is mature and the client like this style.

I adjusted the style for p:selectonemenu, but if I filter, all the elements disappear. I checked with the inspector and it seems that simply to the other options is added display="none". So I do not understand why also the option that should be visible, disappear.

This is my custom style:

.ui-selectonemenu {
    margin: 5px;
    padding: 6px;
    font-size: 1em !important;
    /* The arrow */
    background-image: url(data:image/svg+xml;charset=utf-8,[...]]);
    background-position: right .5em center;
    background-repeat: no-repeat;
    background-size: .8em;
    display: inline-flex !important;
}

.ui-selectonemenu-trigger {
    display: none;
}

.ui-selectonemenu-panel {
    background-color: white !important;
}

.ui-selectonemenu-label {
    width: 100% !important;
    box-shadow: none !important;
    background: none;
}

.ui-selectonemenu-items {
    background: white;
}
Marco Sulla
  • 15,299
  • 14
  • 65
  • 100
  • 1
    Documented right here: https://primefaces.github.io/primefaces/10_0_0/#/components/selectonemenu?id=skinning – Melloware Jul 23 '21 at 11:05
  • Hi @Melloware! I updated the question with code :) – Marco Sulla Jul 23 '21 at 12:09
  • Did you read https://stackoverflow.com/questions/8768317/how-do-i-override-default-primefaces-css-with-custom-styles? – Jasper de Vries Jul 23 '21 at 12:28
  • @JasperdeVries: no, I have not read *before* https://stackoverflow.com/questions/8768317/how-do-i-override-default-primefaces-css-with-custom-styles . But I'm forced to put "!important" in sporadic cases by complicated rules of the css already present. And, as I said before, the project started with a custom style, we have no "official" style, so I have to work on what I have. Have you tested my custom style? – Marco Sulla Jul 23 '21 at 13:29

0 Answers0