Add responsive download page #5

Closed
wants to merge 1 commit into
from

Conversation

Projects
None yet
4 participants
@tallowen
Member

tallowen commented Aug 25, 2012

Adjust css to allow the download buttons to collapse for smaller screen sizes.

This works to a degree right now. The bottom footers don't seem to be too happy to be compressed - are they specific to this site? They really need to be in a more mobile friendly format.

+ }
+
+ .build-group h3 {
+ height: auto !important;

This comment has been minimized.

Show comment Hide comment
@tofumatt

tofumatt Aug 30, 2012

Member

!important, eh? Was that my fault?

@tofumatt

tofumatt Aug 30, 2012

Member

!important, eh? Was that my fault?

This comment has been minimized.

Show comment Hide comment
@tallowen

tallowen Oct 14, 2012

Member

Its to override the base style.

@tallowen

tallowen Oct 14, 2012

Member

Its to override the base style.

+
+ .build-group h3 {
+ height: auto !important;
+ margin-right: 0;

This comment has been minimized.

Show comment Hide comment
@tofumatt

tofumatt Aug 30, 2012

Member

Any reason this isn't just in a margin declaration?

@tofumatt

tofumatt Aug 30, 2012

Member

Any reason this isn't just in a margin declaration?

This comment has been minimized.

Show comment Hide comment
@tallowen

tallowen Oct 14, 2012

Member

I didn't want to affect the the base margin styles for top/left/bottom. Is there a better way to do this?

@tallowen

tallowen Oct 14, 2012

Member

I didn't want to affect the the base margin styles for top/left/bottom. Is there a better way to do this?

@tofumatt

This comment has been minimized.

Show comment Hide comment
@tofumatt

tofumatt Aug 30, 2012

Member

The bottom things are taken from django-moz-header... I'm not sure if there's a responsive version. @potch? @Osmose?

Member

tofumatt commented Aug 30, 2012

The bottom things are taken from django-moz-header... I'm not sure if there's a responsive version. @potch? @Osmose?

@Osmose

This comment has been minimized.

Show comment Hide comment
@Osmose

Osmose Aug 30, 2012

Member

I don't think so. The footer in django-moz-header is rather outdated.

Isn't someone working on a One Mozilla Bootstrap of some kind? Perhaps they have a reusable responsive footer?

Member

Osmose commented Aug 30, 2012

I don't think so. The footer in django-moz-header is rather outdated.

Isn't someone working on a One Mozilla Bootstrap of some kind? Perhaps they have a reusable responsive footer?

@tofumatt

This comment has been minimized.

Show comment Hide comment
@tofumatt

tofumatt Sep 4, 2012

Member

Maybe @craigcook knows if the one-mozilla footer is responsive?

Member

tofumatt commented Sep 4, 2012

Maybe @craigcook knows if the one-mozilla footer is responsive?

@craigcook

This comment has been minimized.

Show comment Hide comment
@craigcook

craigcook Sep 4, 2012

Member

The One Mozilla/Sandstone footer is indeed responsive. You can swipe it from bedrock:

Template: https://github.com/mozilla/bedrock/blob/master/templates/base-resp.html#L123
Relevant CSS: https://github.com/mozilla/bedrock/blob/master/media/css/sandstone/sandstone-resp.less#L584

That's a LESS file so it references some variables that you'll have to follow back to their source in https://github.com/mozilla/bedrock/blob/master/media/css/sandstone/variables-resp.less

We're working on a style guide for Mozilla branding and from that I plan to develop a more portable framework, a la bootstrap, to provide a few basic templates and layout variations, common markup patterns, and all the global styles for forms and buttons etc, to make this kind of thing much easier. It just hasn't happened yet.

Member

craigcook commented Sep 4, 2012

The One Mozilla/Sandstone footer is indeed responsive. You can swipe it from bedrock:

Template: https://github.com/mozilla/bedrock/blob/master/templates/base-resp.html#L123
Relevant CSS: https://github.com/mozilla/bedrock/blob/master/media/css/sandstone/sandstone-resp.less#L584

That's a LESS file so it references some variables that you'll have to follow back to their source in https://github.com/mozilla/bedrock/blob/master/media/css/sandstone/variables-resp.less

We're working on a style guide for Mozilla branding and from that I plan to develop a more portable framework, a la bootstrap, to provide a few basic templates and layout variations, common markup patterns, and all the global styles for forms and buttons etc, to make this kind of thing much easier. It just hasn't happened yet.

@tofumatt

This comment has been minimized.

Show comment Hide comment
@tofumatt

tofumatt Sep 4, 2012

Member

Cool beans. @tallowen, can you take a crack at implementing the one-mozilla footer here or shall I pick things up from here?

Matthew Riley MacPherson | http://lonelyvegan.com
(Sent from mobile)

On 2012-09-04, at 15:12, Craig Cook notifications@github.com wrote:

The One Mozilla/Sandstone footer is indeed responsive. You can swipe it from bedrock:

Template: https://github.com/mozilla/bedrock/blob/master/templates/base-resp.html#L123
Relevant CSS: https://github.com/mozilla/bedrock/blob/master/media/css/sandstone/sandstone-resp.less#L584

That's a LESS file so it references some variables that you'll have to follow back to their source in https://github.com/mozilla/bedrock/blob/master/media/css/sandstone/variables-resp.less

We're working on a style guide for Mozilla branding and from that I plan to develop a more portable framework, a la bootstrap, to provide a few basic templates and layout variations, common markup patterns, and all the global styles for forms and buttons etc, to make this kind of thing much easier. It just hasn't happened yet.


Reply to this email directly or view it on GitHub.

Member

tofumatt commented Sep 4, 2012

Cool beans. @tallowen, can you take a crack at implementing the one-mozilla footer here or shall I pick things up from here?

Matthew Riley MacPherson | http://lonelyvegan.com
(Sent from mobile)

On 2012-09-04, at 15:12, Craig Cook notifications@github.com wrote:

The One Mozilla/Sandstone footer is indeed responsive. You can swipe it from bedrock:

Template: https://github.com/mozilla/bedrock/blob/master/templates/base-resp.html#L123
Relevant CSS: https://github.com/mozilla/bedrock/blob/master/media/css/sandstone/sandstone-resp.less#L584

That's a LESS file so it references some variables that you'll have to follow back to their source in https://github.com/mozilla/bedrock/blob/master/media/css/sandstone/variables-resp.less

We're working on a style guide for Mozilla branding and from that I plan to develop a more portable framework, a la bootstrap, to provide a few basic templates and layout variations, common markup patterns, and all the global styles for forms and buttons etc, to make this kind of thing much easier. It just hasn't happened yet.


Reply to this email directly or view it on GitHub.

Add responsive download page
Adjust css to allow the download buttons to collapse for smaller screen sizes.
@tallowen

This comment has been minimized.

Show comment Hide comment
@tallowen

tallowen Oct 14, 2012

Member

Sorry I didn't notice this thread for such a long time! @craigcook has there been any progress in breaking that code out into something that more sites can consume? If not, I'll try to turn that footer into something useable in this project. What about the header?

Member

tallowen commented Oct 14, 2012

Sorry I didn't notice this thread for such a long time! @craigcook has there been any progress in breaking that code out into something that more sites can consume? If not, I'll try to turn that footer into something useable in this project. What about the header?

@tallowen tallowen closed this Mar 15, 2013

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