Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

css: Use SCSS nesting for `.tour .carousel-inner img`.

This commit is contained in:
SiddharthVarshney 2020-07-19 14:31:50 +05:30 committed by Tim Abbott
parent fdf893c0af
commit 9a67565c12
1 changed files with 45 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

85
static/styles/portico/landing-page.scss
View File

@ -1441,12 +1441,38 @@ nav {
.tour .carousel-inner img {
border: 1px solid hsl(210, 8%, 95%);
&.centered-image {
display: block;
margin: 0 auto;
}
&.zulip-streams {
width: 200px;
}
&.slack-streams {
width: 200px;
}
&.zulip-topic {
margin: -10px 0 0 50px;
width: 800px;
}
&.slack-overwhelming {
border: none;
width: 750px;
margin: -30px 0 0 50px;
}
&.zulip-easy {
border: none;
width: 700px;
margin-left: 50px;
}
}
.tour .carousel-inner img.centered-image {
display: block;
margin: 0 auto;
}
.tour .carousel-inner .mobile-hide,
.tour .carousel-inner img.mobile-hide,
@ -1464,36 +1490,11 @@ nav {
margin: 0;
}
.tour .carousel-inner img.zulip-streams {
width: 200px;
}
.tour .carousel-inner img.slack-streams {
width: 200px;
}
.tour .carousel-inner img.zulip-topic {
margin: -10px 0 0 50px;
width: 800px;
}
.tour .carousel-inner img.slack-overwhelming {
border: none;
width: 750px;
margin: -30px 0 0 50px;
}
.tour .carousel-inner .comparison-slack img.slack-unreads {
width: 250px;
margin: 15px 0 0 -10px;
}
.tour .carousel-inner img.zulip-easy {
border: none;
width: 700px;
margin-left: 50px;
}
.tour .carousel-inner .other-resources {
text-align: left;
margin: 30px auto;
@ -2910,13 +2911,15 @@ nav {
}
@media (max-width: 1100px) {
.tour .carousel-inner img.zulip-topic,
.tour .carousel-inner img.slack-overwhelming,
.tour .carousel-inner img.zulip-easy {
width: 85%;
left: 0;
margin-left: auto;
margin-right: auto;
.tour .carousel-inner img {
&.zulip-topic,
&.slack-overwhelming,
&.zulip-easy {
width: 85%;
left: 0;
margin-left: auto;
margin-right: auto;
}
}
.tour .carousel-inner .tour-item-header {
@ -3099,10 +3102,12 @@ nav {
width: calc(25% - 44px);
}
.tour .carousel-inner img.slack-overwhelming,
.tour .carousel-inner img.zulip-easy {
width: 80%;
left: 0;
.tour .carousel-inner img {
&.slack-overwhelming,
&.zulip-easy {
width: 80%;
left: 0;
}
}
.portico-landing.hello .hero {