css: Use SCSS nesting for `.portico-landing.hello .screen`.

This commit is contained in:
SiddharthVarshney 2020-07-18 14:42:22 +05:30 committed by Tim Abbott
parent ba4709b000
commit 7f5f61267e
1 changed files with 51 additions and 50 deletions

View File

@ -1144,7 +1144,25 @@ nav {
}
}
.portico-landing.hello .screen.hero-screen {
.portico-landing.hello .screen {
position: relative;
margin: -300px auto 0px auto;
width: 600px;
background-color: hsl(0, 0%, 98%);
height: 350px;
padding: 10px 30px 10px 30px;
border-radius: 12px;
box-shadow: 0px 0px 50px hsla(0, 0%, 0%, 0.2);
background-color: hsl(0, 0%, 27%);
z-index: 1;
&.hero-screen {
padding: 95px 170px;
height: 385px;
@ -1166,25 +1184,7 @@ nav {
}
}
.portico-landing.hello .screen {
position: relative;
margin: -300px auto 0px auto;
width: 600px;
background-color: hsl(0, 0%, 98%);
height: 350px;
padding: 10px 30px 10px 30px;
border-radius: 12px;
box-shadow: 0px 0px 50px hsla(0, 0%, 0%, 0.2);
background-color: hsl(0, 0%, 27%);
z-index: 1;
}
.portico-landing.hello .screen::before {
&::before {
content: " ";
position: absolute;
top: calc(50% - 5px);
@ -1197,7 +1197,7 @@ nav {
background-color: hsl(0, 0%, 13%);
}
.portico-landing.hello .screen::after {
&::after {
content: " ";
position: absolute;
top: calc(50% - 12.5px);
@ -1210,7 +1210,7 @@ nav {
background-color: hsl(0, 0%, 73%);
}
.portico-landing.hello .screen .main-page {
.main-page {
display: inline-block;
height: calc(100% - 30px);
@ -1222,6 +1222,7 @@ nav {
background-color: hsl(0, 0%, 98%);
}
}
.portico-landing.hello .features {
padding: 50px 0px 100px 0px;