Question
Synechron
US
Last activity: 21 Mar 2018 6:30 EDT
Calendar control, spinner is not visible after upgrading to 7.3.1v
Hi All,
we have upgraded our application to 7.3.1v, after upgrade, the calendar control spinner is not visible. Did anyone face the similar issue ?. please let me know how to fix the same.
Thanks
Amarnath
Accepted Solution
Pegasystems Inc.
US
Hi,
Can you try putting the below CSS in userworkform and let me know if this is working.
<style>
.pi-caret-solid-up:before{
transform : rotate(270deg) !important;
}
</style>
Synechron
US
Hi Kakul,
Thank you for your reply.
I have checked the UI Gallery, there its showing perfectly fine. And i have even compared the pxDateControls from the UI Gallery to the control we were using in our application.All the settings seems are similar. Please let me know what needs to be done in order to fix this. One more thing is that , we upgraded our application from 7.1.8v to 7.3.1v.
Thanks and Regards
Amarnath
Pegasystems Inc.
IN
Check the DOM elements once by inspecting the element from browser debugger tools. See if the elements are present or not. See if some CSS is overriding. Compare with the working scenario
Synechron
US
Hi Kakul,
Thank you for your time. I have checked DOM elements just like you said, i was unable to find the root cause, and also i believe no CSS is overridung our implementation. Is rising an SR is the only solution for this ?.
Regards
Amarnath
Pegasystems Inc.
IN
In DOM, do you see the corresponding elements and value? You can actually compare the DOM with the working env and do little more investigation. It is also a good idea to raise the SR for better investigation.
Pegasystems Inc.
US
Hi,
Can you check if in DOM if <i> tag is present or not. Also, check the check the color of this <button> tag.May the color used is transparent/white.
Also, check the UI-KIT you are using in your application. BTW, there is OOTB "py-icons" text file. Check this as well. Please let me know if this helps.
Regards,
Rachit
Synechron
US
Hi Rachit,
Thank you, I have checked the DOM and found out that the background color is put as white and thats causing it to be invisible on the screen. I have changed the color using DOM, then spinner was visible. Now my question is do i need to raise an SR for the issue to be fixed, as the upward arrow symbol is messed up.Please see the snapshot attached.
Regards
Amarnath
Accepted Solution
Pegasystems Inc.
US
Hi,
Can you try putting the below CSS in userworkform and let me know if this is working.
<style>
.pi-caret-solid-up:before{
transform : rotate(270deg) !important;
}
</style>
Pegasystems Inc.
IN
Hi Amarnath,
Script provided by Rachit should work. Kindly view the attached screen shot of correct and incorrect symbol. Only change I made is in degree of transform. Please check your DOM, something else is overriding your CSS change. Inspect "::Before" in DOM and add inline style as
transform: rotate(270deg);
Kindly test these changes and let us know, if this helps.
Thanks:
Gurpreet
Synechron
US
Hi Gurpreet,
Thank you and Rachit for providing the script, Its working as expected now. But is there an efficient way to check where its being overridden?, If so please let me know ho w to check for the root cause.
Thanks and Regards
Amarnath
Synechron
US
Hi Rachit,
Thank you. After removing those lines form py-Icons and including the scripts in UserWorkForm, Its behaving correctly.
Thank you so much for your help.
Regards
Amarnath
HCL
IN
Hi Amar,
Could you please let us know the summary of what changes done in default css and customised css.As the changes mentioned in this post is not working for us
Regards,
Gowthami
Pegasystems Inc.
US
Did you change the color. I think you cannot view the orientation with white color. Please use the below script in userworkform to chnage it to black
<style>
.spinner-group .spin-button{
color: rgb(51, 51, 51) !important;
}
</style>
For me I have given as red and it reflected as below. Please verify and confirm.
Synechron
US
Hi Rachit,
Thanks for the script, i have updated the same in UserWorkForm, and got the expected Result, but the upward arrow is messed up, May i know how can i change that ?
Thanks in advance.
Regards
Amarnath Reddy Sagili
Pegasystems Inc.
IN
Hi Amarnath,
Is the upward arrow symbol is not proper in UI Gallary too? If it is improper in both kindly raise the SR otherwise compare the DOM and CSS for working and non-working scenario.
Thanks:
Gurpreet
HCL
IN
Hi,
If the content for pi-caret is e07b it is not working.
We added the below in custom style sheet and it is working fine now.
.pi-caret-solid-down::before {
content: "\25bc" !important;
transform: rotate(360deg) !important;
}
.pi-caret-solid-up::before {
transform: rotate(360deg) !important;
content: "\25b2" !important;
}
Regards,
Gowthami