Forum Discussion

MarkShnier__You's avatar
MarkShnier__You
Icon for Qrew Legend rankQrew Legend
2 years ago

Code to make a colored circle with a number inside it

Does anyone have any code to dynamically make a circle with a number inside it? Or a rectangle box with a number inside similar to the Dashboard widgets Gauge charts on a New Style dashboard.    Thin...
MarkShnier__You's avatar
MarkShnier__You
Icon for Qrew Legend rankQrew Legend
2 years ago

Chayce, how do I control the font size, so I can scale the circle larger and increase the font size?



------------------------------
Mark Shnier (Your Quickbase Coach)
mark.shnier@gmail.com
------------------------------
ChayceDuncan's avatar
ChayceDuncan
Qrew Captain
2 years ago

You can add font-size: 12px (or whatever font size in pt or px that you want) 

"<div style='font-size: 12px; font-weight:bold;margin:auto;line-height: 27px;text-align:center;height: 25px;width: 25px;background: #ffb205;color:white;border-radius: 50%'>1</div>"

Based on how big you want you may have to increase the size of the div to make it look good but otherwise adjust as you need. I believe the default QB font-size ends up being 12px as a reference point to adjust from. 



------------------------------
Chayce Duncan
------------------------------