melenaos / jquery-punchcard

Github punchcard inspired jQuery plugin

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Make css rensponsive

melenaos opened this issue · comments

The design is fixed but it would be nice if it was rensponsive

Ok, how do you image it? Github's punch cards are not responsive.

You can see a live example at: punchcard example

I know, I'll try to be more specific. How do you image responsive version? What should change on window resize?

The same way an image would be resized. The height to width ratio stays the same and everything srinks when the boundaries get smaller. The same way an <img style='width:100%' /> would respond to his parent resize. I cannot think of another implementable way, do you have any other idea?

Ok, it sounds like a plan. I'll try to do it at my free time. Thanks for explanation!

Hi, #7
Should resolve problem. Now on resize punchcard should behave like img tag. I've updated example.html to, so you can test it without any problem.

Its working but after going to 80% it becomes unreadable. Can you put a swi8tch if someone doesn't want this feature?

Yes, no problem. Do you prefer on/off switch or min-width like switch? Maybe both?

#8

Solution. Here https://gist.github.com/galczo5/9a2df391e625b08e1cfea0d1c5d5ad18 you can find example.html with tests. By default punchcard is not responsive. I can change it if you want.

works perfect, thank you