Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

Add Popovers and Links for Most of the Features on the Front Page #34

Merged
merged 5 commits into from Feb 1, 2013

Conversation

Projects
None yet
2 participants
Contributor

chase commented Jan 6, 2013

Addresses #18

@balupton Where should the Versioning feature link to?

Contributor

chase commented on ef83132 Jan 6, 2013

@balupton The captions for the popovers ought to be changed. Right now they are just rough placeholders.

Here is what it looks like on hover:
Screen Shot 2013-01-06 at 1 50 20 PM

Owner

balupton commented Jan 25, 2013

Looks good. I am concerned about the zoom changes though, what was the intention behind them?

As one thing to notice is that for iOS devices they have a minimum font size setting, so zoom is how we make sure the font is small enough.

Wish there was a way so we can see screenshots of this against all different platforms... @supersym do you know of a service that allows such a thing?

Also, sorry for the late reply on this - I've been fully worked out recently - I will endeavour to do whatever I can to offer more autonomy inside the community going forward, as things like this should never happen.

Contributor

chase commented Jan 25, 2013

Looks good. I am concerned about the zoom changes though, what was the intention behind them?

The zoom changes were made because they caused text distortion and made the website very hard to read on the Android devices I own.
Also, when resizing the window in Chrome on my MacBook Pro, it flows a lot better without the zoom when going from full size to the minimum possible window size.

Wish there was a way so we can see screenshots of this against all different platforms... @supersym do you know of a service that allows such a thing?

Did you ever get a chance to try the services provided by CrossBrowserTesting.com? I understand the pricing may be quite steep, but there is always the free trial.

Also, sorry for the late reply on this - I've been fully worked out recently - I will endeavour to do whatever I can to offer more autonomy inside the community going forward, as things like this should never happen.

Don't worry about it! It's the website for your project. Regardless, your earning a living should take priority.

Owner

balupton commented Jan 25, 2013

Cool. Will review now.

Owner

balupton commented Jan 25, 2013

Before: http://crossbrowsertesting.com/users/43777/screenshots/z0a63b44ae04894e92df/public

After: http://crossbrowsertesting.com/users/43777/screenshots/z52de30efe24c0f846c5/public

The only issue is with the iPhone it seems. The icons are two rows and crammed together, rather than utilising the space more intelligently. When that is fixed, we'll be good to go!

It's up on http://docpad-staging.herokuapp.com/

Contributor

chase commented Jan 25, 2013

Contributor

chase commented Jan 31, 2013

@balupton rather than reducing the size of the icons and the titles to a minimal, unreadable state, we could use a carousel. This would also allow us to present the description which would normally require a hover over.
Any thoughts on that?

Owner

balupton commented Jan 31, 2013

I think the size of them are fine. Just need more spacing between the icons.

Contributor

chase commented Jan 31, 2013

Hm, after giving more spacing between the icons, I noticed that even with just 1 em of spacing the icons and icon labels still made quite a bit of confusion. The spacing still led to the "Versioning Skeletons Agnostic" issue you mentioned to me.
Increasing the spacing any further led to 3 lines of icons with 2 icons on top, 1 icon in the center, and 2 icons on the bottom. Obviously, that will take up unnecessary vertical space.

The carousel approach solves this issue, while also making the page more suitable for touch-based devices where the descriptions would not be visible. Thus, I figured that the carousel approach would be fine for the smaller devices.

With the advent of CSS3, this would be a super-simple feat to accomplish. It would require any JavaScript tweening voodoo. In fact, I can probably make a functioning carousel tomorrow without even modifying the HTML.

Contributor

chase commented Feb 1, 2013

@balupton, I've fixed the spacing as requested. Feel free to merge it when you see fit!
As for the carousel, I'll put that into another feature branch later.

@balupton balupton merged commit 4e38b50 into master Feb 1, 2013

Contributor

chase commented on 4e38b50 Feb 1, 2013

Unfortunately, there is no support for zoom in Firefox.
The closest thing to it is transform: scale( ... )

Owner

balupton replied Feb 1, 2013

Yep tried it, but for some reason the positioning of the images goes whacked out, as if it doesn't adjust for the different sizes, like it center middle shrinks, rather than shrinks in the direction of the text align.

@chase chase deleted the feature-popover branch Aug 10, 2013

balupton added a commit that referenced this pull request Oct 23, 2013

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment