-
Notifications
You must be signed in to change notification settings - Fork 535
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
Add addon and evolution callout #4230
Conversation
@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)"; |
There was a problem hiding this comment.
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.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Heh, I keep learning :)
There was a problem hiding this 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)"; |
There was a problem hiding this comment.
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; |
There was a problem hiding this comment.
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.
There was a problem hiding this comment.
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); |
There was a problem hiding this comment.
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); |
There was a problem hiding this comment.
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.
There was a problem hiding this comment.
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.
e0f92e5
to
3e717c5
Compare
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: