From db49740f57b1a77530f6f54c4e1a9ea28caa05d0 Mon Sep 17 00:00:00 2001 From: jenhadfield-dfe <119432491+jenhadfield-dfe@users.noreply.github.com> Date: Fri, 19 Apr 2024 18:21:48 +0000 Subject: [PATCH] Sorted image fitting in css. Added inline margin to some pages. Campus changed to pink / yellow. --- .../get-the-most-from-events/_steps.html.erb | 2 +- .../_article.html.erb | 4 +- .../computing/_article.html.erb | 2 +- .../engineers-teach-physics/_article.html.erb | 2 +- .../maths/_article.html.erb | 2 +- .../landing/campus-advisers/_header.html.erb | 2 +- .../campus-mailing-list/_header.html.erb | 2 +- app/webpacker/styles/sections/hero.scss | 51 ++++++++++++------- 8 files changed, 41 insertions(+), 26 deletions(-) diff --git a/app/views/content/events/get-the-most-from-events/_steps.html.erb b/app/views/content/events/get-the-most-from-events/_steps.html.erb index 3639bd578b..f2a782184e 100644 --- a/app/views/content/events/get-the-most-from-events/_steps.html.erb +++ b/app/views/content/events/get-the-most-from-events/_steps.html.erb @@ -1,4 +1,4 @@ -
As a secondary computing teacher you'll help pupils become responsible and confident users of information and technology in an increasingly digital world.
Whether it's teaching your pupils about artificial intelligence (AI) or creating apps, you could inspire them to look at a future role in tech.
diff --git a/app/views/content/is-teaching-right-for-me/engineers-teach-physics/_article.html.erb b/app/views/content/is-teaching-right-for-me/engineers-teach-physics/_article.html.erb index 83ea087f78..a7052c94c6 100644 --- a/app/views/content/is-teaching-right-for-me/engineers-teach-physics/_article.html.erb +++ b/app/views/content/is-teaching-right-for-me/engineers-teach-physics/_article.html.erb @@ -1,4 +1,4 @@ -If maths is your passion, you'll know that it's not just learning formulas or solving equations. It's a way of thinking and problem solving that’s important in every walk of life. diff --git a/app/views/content/landing/campus-advisers/_header.html.erb b/app/views/content/landing/campus-advisers/_header.html.erb index 385fb60352..9f8b0462dc 100644 --- a/app/views/content/landing/campus-advisers/_header.html.erb +++ b/app/views/content/landing/campus-advisers/_header.html.erb @@ -1,5 +1,5 @@ <%= render Content::LandingHeroComponent.new( title: "Sign up for an adviser", - colour: "pink-blue", + colour: "pink-yellow", image: @front_matter["image"], ) %> diff --git a/app/views/content/landing/campus-mailing-list/_header.html.erb b/app/views/content/landing/campus-mailing-list/_header.html.erb index b08e230628..8ed8a90e8d 100644 --- a/app/views/content/landing/campus-mailing-list/_header.html.erb +++ b/app/views/content/landing/campus-mailing-list/_header.html.erb @@ -1,6 +1,6 @@ <%= render Content::LandingHeroComponent.new( title: "Sign up for emails", - colour: "pink-blue", + colour: "pink-yellow", background_colour: "test", image: @front_matter["image"], ) %> diff --git a/app/webpacker/styles/sections/hero.scss b/app/webpacker/styles/sections/hero.scss index 6de654c68e..2bbc93aec8 100644 --- a/app/webpacker/styles/sections/hero.scss +++ b/app/webpacker/styles/sections/hero.scss @@ -281,8 +281,6 @@ $mobile-cutoff: 800px; .landing-hero { display: flex; flex-direction: row-reverse; - justify-content: center; - align-items: center; margin: auto; width: 100%; max-width: 2000px; @@ -307,23 +305,23 @@ $mobile-cutoff: 800px; } } - &.blue-pink { - background-color: $blue; - + &.pink-green { + background-color: $pink; + h1 span { - background: $pink; + background: $green; } - + &.pastel { - background-color: rgba($blue, 0.4); + background-color: rgba($pink, 0.4); } } - &.pink-green { + &.pink-yellow { background-color: $pink; h1 span { - background: $green; + background: $yellow; } &.pastel { @@ -331,6 +329,18 @@ $mobile-cutoff: 800px; } } + &.blue-pink { + background-color: $blue; + + h1 span { + background: $pink; + } + + &.pastel { + background-color: rgba($blue, 0.4); + } + } + &.green-pink { background-color: $green; @@ -380,6 +390,7 @@ $mobile-cutoff: 800px; } .content { + align-self:center; padding: 90px; z-index: 1; @@ -413,14 +424,18 @@ $mobile-cutoff: 800px; } } - picture img { - -o-object-fit: cover; - object-fit: cover; - -o-object-position: 100% 30%; - object-position: 100% 30%; - width: 100%; - height: 100%; - vertical-align: bottom; + picture { + align-self:stretch; + + img { + -o-object-fit: cover; + object-fit: cover; + -o-object-position: 100% 30%; + object-position: 100% 30%; + width: 100%; + height: 100%; + vertical-align: bottom; + } } & > * {