Page 1 of 2
New input focus animation feature: specify line colors
Posted: 12 Apr 2018, 10:09
by joerg
Hi,
I have a question regarding the new 1.1.1 new input focus animation feature. On some of my themes there is no "bottom-line" of the fields when they don't have focus. I guess that's because that line has the same color as the background, but I can't find where to adjust that. It seems not as simple as changing the border-bottom-color.
Could you help me out there how to specify the color for that line in focused and non-focused state?
Thanks,
Jörg.
Re: New input focus animation feature: specify line colors
Posted: 12 Apr 2018, 13:34
by kubrasulukan
We'll check and get back to you.
Regards
Re: New input focus animation feature: specify line colors
Posted: 13 Apr 2018, 15:46
by mert.sincan
Could you please attach a screenshot for us?
Re: New input focus animation feature: specify line colors
Posted: 13 Apr 2018, 18:12
by joerg
Thanks, I found it now. The invisible line was because I removed too many borders when playing around with the styles, my mistake. And I found out how to adjust the color of the line, not as easy as setting border-bottom:
Code: Select all
body .ui-inputfield {
background: white no-repeat;
background-image: linear-gradient(to bottom, #3F51B5, #3F51B5), linear-gradient(to bottom, #bdbdbd, #bdbdbd);
...
I guess the first color(#3F51B5) is the focus color, the second one the unfocused color (#bdbdbd).
Re: New input focus animation feature: specify line colors
Posted: 16 Apr 2018, 07:50
by mert.sincan
I guess the first color(#3F51B5) is the focus color, the second one the unfocused color (#bdbdbd).
- Yes, perfect! Also, I made some changes in next version.
Code: Select all
.ui-inputfield {
background: transparent no-repeat;
background-image: linear-gradient(to bottom, $primaryColor, $primaryColor), linear-gradient(to bottom, $inputBorderColor, $inputBorderColor);
...
//_variables.scss
$inputBorderColor:#bdbdbd;
Re: New input focus animation feature: specify line colors
Posted: 16 Apr 2018, 20:00
by joerg
Great, thanks! I've replaced the color codes with variables too. Will change them with the next version.
Re: New input focus animation feature: specify line colors
Posted: 25 Apr 2018, 09:14
by mert.sincan
Glad to hear, thanks a lot for the update!
Re: New input focus animation feature: specify line colors
Posted: 08 May 2018, 09:28
by asesovici
joerg wrote: ↑16 Apr 2018, 20:00
Great, thanks! I've replaced the color codes with variables too. Will change them with the next version.
Any idea when will the next version be released?
Re: New input focus animation feature: specify line colors
Posted: 08 May 2018, 12:47
by mert.sincan
Ultima 1.1.2 released now. You can download it from store.
Regards,
Re: New input focus animation feature: specify line colors
Posted: 08 May 2018, 18:01
by asesovici
aragorn wrote: ↑08 May 2018, 12:47
Ultima 1.1.2 released now. You can download it from store.
Regards,
Thank you for the update @aragorn. The initial problem is solved, however I have a small point of concern in regards to the change made in _theme.scss for .ui-widget-header .ui-inputfield background-image:
Code: Select all
.ui-widget-header .ui-inputfield {
background-image: linear-gradient(to bottom, #ffffff, #ffffff), linear-gradient(to bottom, desaturate(lighten($primaryColor,25%), 25%), desaturate(lighten($primaryColor,25%), 25%));
}
}
The white color of the linear gradient makes the table's header column filters look odd when focused (white on white).