Skip to content

GitLab

Commit 2bd7c91e authored by Megan McDermott's avatar Megan McDermott
Browse files

Fixed display of infographics to make heights consistent.

parent e23d27c8
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 25 additions and 21 deletions
css/rwd.css
View file @ 2bd7c91e
This diff is collapsed.
sass/rwd/modules/_highlighted_facts.scss
View file @ 2bd7c91e
......@@ -360,11 +360,15 @@ $highlighted-fact-color-shaded: mix(black, $highlighted-fact-color, 10%);
.highlighted-fact-infographic {
margin: 0 auto;
max-width: 250px;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
.number,
.timer {
font-family: $font-bg-cond-book;
color: $dark-gray;
color: #4e4e4e;
}
.timer {
font-size: 2.3em;
......@@ -384,11 +388,12 @@ $highlighted-fact-color-shaded: mix(black, $highlighted-fact-color, 10%);
}
&.infographic-vertical {
// Had to choose a grey with suitable contrast for faculty colours + background
background: $medium-gray;
height: 200px;
width: 80px;
position: relative;
.graph-wrapper {
background: $medium-gray;
height: 200px;
width: 80px;
position: relative;
}
.graph {
width: 80px;
......@@ -397,9 +402,7 @@ $highlighted-fact-color-shaded: mix(black, $highlighted-fact-color, 10%);
bottom: 1px;
}
.timer {
position: relative;
left: calc(100% + 0.2em);
top: calc(100px - 1rem);
margin-left: .5em;
}
.timer:after {
content: '%';
......@@ -408,22 +411,23 @@ $highlighted-fact-color-shaded: mix(black, $highlighted-fact-color, 10%);
}
&.infographic-horizontal {
background: $medium-gray;
height: 80px;
width: 100%;
width: calc(100% - 5em);
position: relative;
left: -2em;
margin-bottom: 1em;
margin: 0;
max-width: 100%;
padding: 0 1em;
.graph-wrapper {
background: $medium-gray;
height: 80px;
width: 100%;
width: calc(100% - 5em);
position: relative;
margin-bottom: 1em;
}
.graph {
height: 80px;
width: 1px;
margin-right: 1em;
}
.timer {
position: relative;
left: calc(100% - .5em);
top: calc(-1 * (40px + 1.5rem));
width: 3em;
}
.timer:after {
......
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