Menu icon Foundation
Round timer in Orbit

Does anyone know how to get the round (old style?) timer icon in Orbit?

I'm using Foundation 5 and the timer displays as a flat bar. That's fine -- but I'd like the round one and if it's an easy fix all the better.

Is it a simple css change? Or is it an option I am missing?

OrbitFoundation 5timerslider

Does anyone know how to get the round (old style?) timer icon in Orbit?

I'm using Foundation 5 and the timer displays as a flat bar. That's fine -- but I'd like the round one and if it's an easy fix all the better.

Is it a simple css change? Or is it an option I am missing?

Rafi Benkual over 5 years ago

The Orbit timer is made with JS for now, but will be CSS in the future. The round one you are referring to is from Foundation 3.

So there is a way to hide the timer with css and create your own. We have not done that before.

Char Zango over 5 years ago

Thanks Rafi,

Not the answer I was hoping for but now at least I know where I'm starting. If it helps anyone else, here are some other (jquery) timers that I might try

https://github.com/aterrien/jQuery-Knob
http://blakek.us/labs/jquery/css3-pie-graph-timer/

Rafi Benkual over 5 years ago

Thanks for sharing those! We like a css option to keep the cpu load low.

Char Zango over 5 years ago

I looked briefly at a few css options too (timers exist -- timer controls would be even worse), but they were incomplete for this purpose (e.g., didn't work in a responsive environment), or mainly: would take me too long to implement in a reliable fashion.

Time is money :)