Commit d13447f4 authored by Laura Kalbag's avatar Laura Kalbag
Browse files

More progress styling feature images

parent 742bdd66
......@@ -313,19 +313,21 @@ main * {
grid-column: 1 / 20; /* full width */
display: grid;
grid-template-columns: var(--grid-columns-main);
grid-template-rows: 1em auto auto 1em;
z-index: 1; /* put behind subtitle */
}
.home .feature {
padding: 0.5em 0 4.33em;
padding: 0.5em 0 0;
position: relative; /* enable positioning on pseudo selectors */
}
.home .feature:before, .home .feature:after {
content: "";
display: block;
height: 14.5em;
margin-top: -1em;
width: 150%;
grid-row: 1 / 6;
margin-top: -2em; /* pull Aral's head above feature box */
object-fit: cover;
}
.home .feature:before {
......@@ -335,7 +337,7 @@ main * {
}
.home .feature:after {
background: url('/images/laura-listening-2.png') center right no-repeat;
background: url('/images/laura-listening-2.png') center left no-repeat;
background-size: 100%;
grid-column: 17 / 20;
}
......@@ -343,8 +345,9 @@ main * {
.feature h1 {
color: #422D50;
display: block;
grid-column: 4 / 17; /* centred */
margin: 0;
grid-column: 3 / 18; /* centred */
grid-row: 2 / 4;
margin: 1em 0 1em 0; /* margin provides space for subtitle below to fill */
}
.feature .title-small-tech {
......@@ -352,7 +355,7 @@ main * {
background-size: 100%;
display: block;
height: 0;
padding: 1.6em 0 0 0;
padding: 1.8em 0 0 0; /* top padding is height of image */
overflow: hidden; /* hide text, only show image */
width: 100%;
}
......@@ -369,6 +372,7 @@ main * {
grid-template-columns: var(--grid-columns-subgrid);
margin: -2em 0 1.5em 0;
padding: 1.5em 0;
z-index: 2; /* pull in front of feature */
}
.subtitle p {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment