[Silk UI Web] [Bug] Select2 in a form shows icons incorrectly

[Silk UI Web] [Bug] Select2 in a form shows icons incorrectly

  
Forge Component
(50)
Published on 7 Aug (13 days ago) by OutSystems R&D
50 votes
Published on 7 Aug (13 days ago) by OutSystems R&D

Hi,

I want to use select2 in a form, simply because it's more friendlier than a normal listbox.

however, when using it, it shows an extra edit-pencil on the right, which makes it horrible looking.

If there is an easy workaround, I really want to know, because I tried to kill it with css, but no luck so far.

and it would be great if it would be fixed ofcourse :)

(not to mention, if select2 is in a form with above-input labels, there is a extra indent only for the select2's which makes it also horrible)


This is actually a seperate style that comes with silk.  We hid it using this css

.Form a.SmartInput_Undo:after { content: ""; }
.Form input.SmartInput_Changed.ReadOnly + a.SmartInput_Undo, .Form textarea.SmartInput_Changed.ReadOnly + a.SmartInput_Undo, .Form select.SmartInput_Changed.ReadOnly + a.SmartInput_Undo { display: none; }
/* pencil should be after input (possibly with undo between) */ .Form:not(.WithTouchEvents) input.ReadOnly:hover:not(.SmartInput_Changed) + .SmartInput_Undo + .FormEditPencil, .Form:not(.WithTouchEvents) textarea.ReadOnly:hover:not(.SmartInput_Changed) + .SmartInput_Undo + .FormEditPencil, .Form:not(.WithTouchEvents) select.ReadOnly:hover:not(.SmartInput_Changed) + .SmartInput_Undo + .FormEditPencil { display: none; }

not working so far sadly.. but will toy with it..


Hi J.

There is my suggestion to hide pencil icon:

.select2-search .FormEditPencil {
    display: none;
}


I hope this helps you.

Regards