Changing border radius of metro theme boxes

The recommended method of customizing your AppGini-generated application is through hooks. But sometimes you might need to add functionality not accessible through hooks. You can discuss this here.
Post Reply
User avatar
shasta59
AppGini Super Hero
AppGini Super Hero
Posts: 231
Joined: 2013-01-08 19:40
Location: Calgary, Alberta, Canada

Changing border radius of metro theme boxes

Post by shasta59 » 2013-01-19 22:49

If you wish to change the border radius of the metro theme boxes it is very easy to do by modify the css code found in metro.css

Here is the code to look for in metro.css. (The radius code I have highlighted in red)

.tile{-webkit-perspective:0;-webkit-transform-style:preserve- 3 d;-webkit-transition:-webkit-transform 0.2s;float:left;margin-right:10px;margin-bottom:10px;text-align:center;padding:5px;opacity:0.75;overflow:hidden;cursor:pointer;border-radius:5px}

Change the 5px to whatever number you want. If you want a rounder box then increase this number. If less round decrease. Numbers below 3 do not display well. Too large a number, in my opinion, looks silly.
Once you have modified the metro.css file just upload it to your server.

Enjoy

Alan
Calgary, Alberta, Canada - Using Appgini 5.50 -

Post Reply