Skip to content
New issue

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

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add addon and evolution callout #4230

Merged

Conversation

muffinresearch
Copy link
Contributor

@muffinresearch muffinresearch commented Jan 5, 2017

Fixes mozilla/addons#3865

I still need to add the ladder image, but I think this is mostly ready otherwise.

Full spec tightening + cleanups can be a follow-up too.

Looks like this:

developer_hub____add-ons_for_firefox

developer_hub____add-ons_for_firefox

developer_hub____add-ons_for_firefox

developer_hub____add-ons_for_firefox

@medium: ~"only screen and (min-width: 700px)";
@large: ~"only screen and (min-width: 1024px)";
@retina: ~"only screen and (min-device-pixel-ratio: 2)";
@retina: ~"only screen and (min-resolution: 1.5dppx)";
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is the proper way to do resolution queries since min-device-pixel-ratio is old hat.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Heh, I keep learning :)

Copy link
Contributor

@EnTeQuAk EnTeQuAk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Feel free to ignore the nitpicks, we can do a full "fixes csslint issues" pr later

@medium: ~"only screen and (min-width: 700px)";
@large: ~"only screen and (min-width: 1024px)";
@retina: ~"only screen and (min-device-pixel-ratio: 2)";
@retina: ~"only screen and (min-resolution: 1.5dppx)";
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Heh, I keep learning :)


.DevHub-content-copy {
position: relative;
z-index: 4;
}

.DevHub-callout-box {
border: 8px solid #FDC900;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I wonder if this color code should be extracted into a variable.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, we're going to need this more. I'll sort that.

margin: 0 -20px -20px;

@media @medium {
box-shadow: 8px 8px 0 0 rgba(0,0,0,0.15);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whitespaces after comma in rgba section?


.DevHub-content-container--manage {
flex-direction: column;
background-image: url(../../../img/developers/new-landing/manage-addon.png);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Interesting that the highlighting doesn't work but I don't see any syntax problem.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah a lot of CSS syntax grammar seems to trail, I have similar issues with the newer stuff.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Devhub Landing] Implement Manage Your Add-on and Evolution block (signed-out)
2 participants