New homepage [firebreak] (#565)

Co-authored-by: Marcel Kornblum <[email protected]> Co-authored-by: Sam Dudley <[email protected]> Co-authored-by: marcelkornblum <[email protected]>
uktrade · Apr 25, 2024 · 640f7ea · 640f7ea
1 parent 40c01d2
commit 640f7ea
Show file tree

Hide file tree

Showing 46 changed files with 880 additions and 161 deletions.
diff --git a/.env.ci b/.env.ci
@@ -13,12 +13,6 @@ AWS_ACCESS_KEY_ID=test
 AWS_SECRET_ACCESS_KEY=test
 NEW_ASSET_PATH=test
 OPENSEARCH_URL=http://opensearch:9200
-TWITTER_ACCESS_TOKEN=test
-TWITTER_ACCESS_SECRET=test
-TWITTER_OAUTH_CONSUMER_KEY=test
-TWITTER_OAUTH_CONSUMER_SECRET=test
-TWITTER_DEPT_USER=
-TWITTER_PERM_SEC_USER=
 CLAM_AV_USERNAME=test
 CLAM_AV_PASSWORD=test
 CLAM_AV_DOMAIN=test.com

diff --git a/.env.example b/.env.example
@@ -44,14 +44,6 @@ OLD_ASSET_PATHS=
 GTM_CODE=GTM-xxx
 GTM_AUTH=xx1
 
-# Social connections
-TWITTER_ACCESS_TOKEN=test
-TWITTER_ACCESS_SECRET=test
-TWITTER_OAUTH_CONSUMER_KEY=test
-TWITTER_OAUTH_CONSUMER_SECRET=test
-TWITTER_DEPT_USER=
-TWITTER_PERM_SEC_USER=
-
 # Elastic APM
 ELASTIC_APM_SECRET_TOKEN=xxx
 ELASTIC_APM_SERVER_URL=xxx

diff --git a/Makefile b/Makefile
@@ -129,11 +129,9 @@ su-all: # Makes all users a superuser
 
 migrations: # Run Django makemigrations command
 	$(wagtail) python manage.py makemigrations
-	$(chown) */migrations/*
 
 empty-migration: # Run Django makemigrations command with `--empty` flag
 	$(wagtail) python manage.py makemigrations --empty $(app)
-	$(chown) */migrations/*
 
 checkmigrations: # Run Django makemigrations command with `--check` flag
 	$(wagtail) python manage.py makemigrations --check

diff --git a/assets/stylesheets/application.scss b/assets/stylesheets/application.scss
@@ -28,6 +28,7 @@ $moj-assets-path: "/static/moj-frontend/";
 @import "components/content_page";
 @import "components/cookie_bar";
 @import "components/home";
+@import "components/home_new";
 @import "components/layout";
 @import "components/news_article";
 @import "components/news_article_comments";

diff --git a/assets/stylesheets/components/_home.scss b/assets/stylesheets/components/_home.scss
@@ -1,4 +1,3 @@
-
 .ws-home-wrapper {
   margin-top: 16px;
   ul {
@@ -60,7 +59,8 @@
     }
   }
 
-  .how-do-i, .govuk-news {
+  .how-do-i,
+  .govuk-news {
     li {
       margin: 0 0 12px 0;
     }
@@ -209,3 +209,68 @@
     }
   }
 }
+
+.new-home {
+  margin-top: 0;
+
+  .main-news-item {
+    .frame {
+      //   aspect-ratio: 21/9;
+
+      img {
+        inline-size: 100%;
+        block-size: 100%;
+        object-fit: cover;
+      }
+    }
+  }
+
+  .ws-news-grid-items {
+    .home-news-item {
+      display: flex;
+      flex-flow: row nowrap;
+      gap: 10px;
+
+      .frame {
+        flex: none none 30%;
+      }
+
+      .home-news-item-text-content {
+        flex: none none 70%;
+
+        h4.govuk-heading-s {
+          margin-bottom: 10px;
+        }
+      }
+    }
+  }
+
+  .ws-whats-popular {
+    column-count: unset;
+
+    li.ws-whats-popular-item {
+      margin-bottom: 20px;
+
+      img {
+        width: 300px;
+        height: 100px;
+      }
+    }
+  }
+
+  @media only screen and (min-width: 768px) {
+    .ws-news-grid-items {
+      display: grid;
+      grid-template-columns: repeat(2, 1fr);
+      gap: 20px;
+    }
+  }
+}
+
+.ws-secondary-content {
+  .new-home {
+    li {
+      margin-bottom: 10px;
+    }
+  }
+}
diff --git a/assets/stylesheets/components/_home_new.scss b/assets/stylesheets/components/_home_new.scss
@@ -0,0 +1,171 @@
+.new-home {
+  margin-top: 0;
+
+  section {
+    border-bottom: 1px solid $brand-color-grey50;
+
+    .header-with-action {
+      display: flex;
+      justify-content: space-between;
+      align-items: baseline;
+    }
+  }
+
+  section.homepage-site-alert {
+    margin: 0 0 20px 0;
+    border: none;
+
+    &:empty {
+      margin: 0;
+      padding: 0 !important;
+    }
+  }
+
+  .updates {
+    li::marker {
+      content: "⇨";
+    }
+
+    li {
+      list-style-position: outside;
+      margin-left: 1rem;
+      padding-left: 0.3rem;
+
+      p {
+        display: inline;
+      }
+    }
+  }
+
+  //   NEWS
+  .home-news-item {
+    position: relative;
+
+    .home-news-item-text-content {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      background-color: rgba(255, 255, 255, 0.85);
+      width: 100%;
+      padding: 10px;
+    }
+
+    a:hover {
+      text-decoration: underline;
+    }
+  }
+
+  .main-news-item {
+    .home-news-item {
+      margin-bottom: 10px;
+
+      .frame {
+        img {
+          inline-size: 100%;
+          block-size: 100%;
+          object-fit: cover;
+        }
+      }
+    }
+  }
+
+  .ws-news-grid-items {
+    margin-bottom: 20px;
+
+    h4.govuk-body-s {
+      font-weight: bold;
+      margin-bottom: 10px;
+    }
+
+    h4 > a {
+      text-decoration: none;
+
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+  }
+
+  .govuk-news {
+    h2 {
+      column-span: all;
+    }
+
+    li {
+      display: inline-block;
+    }
+
+    a {
+      text-decoration: none;
+      font-weight: bold;
+
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+  }
+
+  @media only screen and (min-width: 768px) {
+    .ws-news-grid-items {
+      gap: 20px;
+      display: flex;
+      block-size: auto;
+      overflow-x: auto;
+      overflow-y: hidden;
+    }
+  }
+
+  .ws-whats-popular {
+    column-count: unset;
+
+    li.ws-whats-popular-item {
+      position: relative;
+      margin-bottom: 20px;
+
+      img {
+        width: 300px;
+        height: 100px;
+      }
+
+      p {
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        background-color: rgba(255, 255, 255, 0.85);
+        width: 100%;
+        padding: 10px !important;
+        margin: 0 !important;
+        font-weight: bold;
+
+        a {
+          text-decoration: none;
+
+          &:hover {
+            text-decoration: underline;
+          }
+        }
+      }
+    }
+  }
+
+  p.govuk-body-xs {
+    margin: 0 !important;
+  }
+}
+
+.ws-secondary-content {
+  .new-home {
+    li {
+      margin-bottom: 12px;
+
+      a {
+        text-decoration: none;
+        font-weight: bold;
+
+        &:hover {
+          text-decoration: underline;
+        }
+      }
+    }
+  }
+}
diff --git a/assets/stylesheets/components/_layout.scss b/assets/stylesheets/components/_layout.scss
@@ -20,12 +20,10 @@ html {
 }
 
 .ws-primary-content {
-  border-top: 1px solid govuk-colour("mid-grey");
   padding-top: 20px;
 }
 
 .ws-secondary-content {
-  border-top: 5px solid $brand-color-primary;
   padding-top: 20px;
 }
 

diff --git a/assets/stylesheets/govuk-overrides/main.scss b/assets/stylesheets/govuk-overrides/main.scss
@@ -12,6 +12,12 @@
   margin-bottom: 0;
 }
 
+.breadcrumb-bookmark {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
 .govuk-heading-m a,
 .govuk-heading-s a {
   text-decoration: none;
@@ -25,4 +31,8 @@
 
 .govuk-phase-banner__content {
   margin: 0 !important;
-}
+}
+
+.govuk-body-xs {
+  font-size: small;
+}
diff --git a/pii-ner-exclude.txt b/pii-ner-exclude.txt
@@ -455,7 +455,6 @@ TransitionHome
 Turks
 Tuvalu
 TW
-TWITTER_OAUTH_CONSUMER_KEY
 type="search"/
 UG
 United Arab Emirates
-Original file line number
+Diff line change
@@ Expand Up / @@ -455,7 +455,6 @@ TransitionHome @@
     Turks
     Tuvalu
     TW
-    TWITTER_OAUTH_CONSUMER_KEY
     type="search"/
     UG
     United Arab Emirates
@@ Expand Down @@