topleft
topright

Topics

ServoyCamp Login



New Users

                 

Online Users

No users online!
Tip: Servoy webclient the sexy way!
Tips
Written by Harjo Kompagnie | Thursday, 09 September 2010 21:40   

Hi there,

ever wanted to get rid of those ugly blue servoy-webclient tabpanels?

resulting in this sexy looking tabpanels:

this can be done, solution-wide in a few simple steps, want to know more? Read on.... :-)

Please login or register to see the full article
 

Comments  

 
0 #6 Harjo Kompagnie 2010-09-10 16:26
Chuck, very true!! this was just an quick & dirty example, that it CAN be done. I hope indeed also, that we can style this, inside Servoy, instead of searching always for workarounds. I have filed many cases. Let's keep our fingers crossed!
 
 
0 #5 Chuck Amata 2010-09-10 14:47
Can the same thing be done to eliminate the ugly blue text in the treeview component? I would be very interested in some CSS to accomplish this. Since it appears that the webclient CAN be styled dynamically, I am not sure why Servoy does not include CSS provisions to make all of the webclient controls more closely match the smart client. In most cases, developers seem to want the web and smart client to match and are going through great pains to work around the styling differences in their code. Why doesn't Servoy t provide a matching set of control styles for web and smart client and then expose the settings to developers so either or both can be restyled as desired? These styles should also be read out of the resources css file of the solution (verses a directory that must be installed in the app server) to maximize developer flexibility (this way, different apps can have different styles without having to install a mycss directory for each solution. Just a thought.
 
 
0 #4 Chuck Amata 2010-09-10 14:46
Great job. One change I would suggest after reviewing your css though. Change the absolute path to your .png background image from "/servoy-webclient/templates/directmanager/table_header.png" to a relative path "./table_header2.png" and add the missing table_header244 .png file. This enables the background image and also highlights the tab (just lighten up the table_header2.png image a little and save it back out as table_header244 .png. Now the tabs have gradient background and highlighting just like the smart client! The CSS could also be modified to make the tabs less rectangular but it would require more css coding.
 
 
0 #3 Harjo Kompagnie 2010-09-10 11:12
Rick, you are right, already filed a feature request for that!
 
 
0 #2 Rick Bonkestoter 2010-09-10 10:46
Harjo,

These tabs etc are much better then the default Servoy tabs.
Only to bad that the tabpanel-border still is blue.. Hope that Servoy makes this adjustable also trough CSS.
 
 
+2 #1 Ben Savignac 2010-09-10 03:11
Super cool, Harjo - thanks for sharing!

Ben