[INFO REQ] Date Control CSS

[sheetalveer]

Hi team,
I am using Date type widget with following code:

 bryntum.scheduler.WidgetHelper.append([{
 type: 'date',
 placeholder: 'Select Date',
 id: '1',
 onChange: function onChange(_ref2) {
 my custome code
  }
 }], { appendTo: document.body });

My problem is, if User wants to change month or year, in the dropdown entire text is not visible. It is not readable. Same I have observed on https://www.bryntum.com/docs/scheduler/#Core/widget/DateField. Attaching screenshot.

[mats]

Can you reproduce this in our demos?

[sheetalveer]

No, in demo it is working fine. Am I missing any CSS property?

[mats]

No but probably you have some CSS of your own which affects our CSS. Can you please upload a simple test case of what you have?

[sheetalveer]

This is my custom CSS

html, body {
    height: 100%;
}
.b-field-inner {
    background-color: white;
    border-color: white;
}

.b-field-inner, .b-textfield:not(.b-disabled):hover .b-field-inner {
    border-color: white;
}

.b-widget.b-textfield.b-bright {
    margin: 2em;
}

.b-textfield input {
    color: black;
}

.b-widget.b-textfield.b-bright .b-field-inner .b-fieldtrigger {
    color: black;
}

& I am using scheduler.material.css as well.
Is this enough?

[mats]

No, please upload the full runnable test case as a ZIP. What browser are you using?

[sheetalveer]

I am using Chrome Browser. Refer attachment. Can we remove those arrows circled in Red? Because, in your demos they are not appearing https://www.bryntum.com/examples/scheduler/vertical/
If yes, how to do that?

[mats]

Most likely the CSS issues you are seeing is due to your own CSS. Maybe try to inspect the CSS rules yourself and see what's conflicting? If you cannot get it working, please upload a real runnable test case so we can inspect.