gportela85/DateTimeField

Time background in DateTimePicker is transparent

Closed this issue · 8 comments

hakimio commented

When using classic theme, time label background in DateTimePicker is transparent. As a result, time becomes unreadable when there is some other text behind it.

gportela85 commented

Hi,
I create this fiddle: https://fiddle.sencha.com/#fiddle/n4c
Can you make changes to it so I can fix the issue you are talking about?

Thanks,

hakimio commented

Click on the date/time picker to see the issue:
https://fiddle.sencha.com/#fiddle/n58

hakimio commented

Also, while you are at it you might want to fix following issues found by PhpStorm/WebStorm static analyzer:

  • mimicBlur in DateTimeField class seems to be unused
  • "me.callParent(arguments);" on line 36 in DateTimeField class gives warning when building production version of the app with latest version of sencha cmd
  • There doesn't seem to be any need for 'Ext.form.field.Time' require in DateTimePicker
  • There is no need to initialize hourPrefix on line 144 in DateTimePicker
  • Comma is missing on line 145 in DateTimePicker
  • Semicolon is missing on line 155 in DateTimePicker
  • "auxDate" on line 148 is unused in DateTimePicker
  • "el" variable unused on line 202 in DateTimePicker
  • "timePicker" variable unused on line 243 in DateTimePicker
  • Missing comma on line 279 in DateTimePicker
hakimio commented

One more thing, I have slightly adjusted styling of time picker to suit my taste a bit better. Here is the result:
time-picker

And here is what I did to achieve this:

  • Adjusted hourSlider padding to '0 0 10 17'
  • Adjusted minuteSlider padding to '0 10 10 0'
  • Removed margin from those sliders (specified on line 212)
  • Set time label style to 'padding-top: 5px'
gportela85 commented

Hi,

Issue was fixed in the latest update, check your fiddle: https://fiddle.sencha.com/#fiddle/n58

Thanks,

hakimio commented

Looks good now.

hakimio commented

Just one issue with your fix: now upper part of time picker no longer has rounded corners and shadow while the lower part still has it. If you want, I get suggest a fix where the upper part stays with rounded corners and shadow.

gportela85 commented

Hi,
The fix pretty much removes the 'ui: footer' config from the toolbar. This is how the panel would look like with a regular toolbar.