refactoring: Another minor changes of homepage

Vizzuality · Sep 4, 2024 · d06c44e · d06c44e
1 parent 9606908
commit d06c44e
Show file tree

Hide file tree

Showing 10 changed files with 46 additions and 62 deletions.
diff --git a/app/assets/stylesheets/tpi/pages/home.scss b/app/assets/stylesheets/tpi/pages/home.scss
@@ -120,10 +120,18 @@
         height: 100px;
         line-height: 70px;
 
+        br {
+          display: none;
+        }
+
         @include from($tablet) {
           height: 200px;
           line-height: 170px;
 
+          br {
+            display: block;
+          }
+
           span {
             display: inline-block;
             vertical-align: middle;
@@ -160,6 +168,10 @@
       }
     }
 
+    .at-glance-note {
+      font-size: $size-6;
+    }
+
     .at-glance-container:before {
       content: "";
       border: 1px $blue-ribbon solid;

diff --git a/app/javascript/components/tpi/MqBetaModal.jsx b/app/javascript/components/tpi/MqBetaModal.jsx
@@ -66,7 +66,7 @@ const MqBetaModal = ({ enabled, page }) => {
           <div className="modal-title">Management Quality methodology</div>
           <div className="content">
             <p>
-              The TPI Centre has developed an update to its Management Quality
+              TPI Centre has developed an update to its Management Quality
               (MQ) methodology, which is displayed here as a BETA methodology.
             </p>
             <p>
@@ -80,7 +80,8 @@ const MqBetaModal = ({ enabled, page }) => {
             </p>
             <p>
               A report detailing what’s new in the BETA MQ methodology,
-              and a review of its impact on company scoring, can be found <a href={MQ_REPORT_PUBLICATION_LINK} rel="noreferrer" target="_blank">here</a>.
+              and a review of its impact on company scoring, can be found
+              <a href={MQ_REPORT_PUBLICATION_LINK} rel="noreferrer" target="_blank"> here</a>.
             </p>
             <p>
               Carbon Performance assessments are not affected by using this

diff --git a/app/javascript/components/tpi/Navbar.js b/app/javascript/components/tpi/Navbar.js
@@ -112,8 +112,8 @@ function renderMenuItem(menuItem, index) {
   );
 }
 
-const NavbarComponent = ({ items, openSearchMode }) => {
-  const [tpi, publications, about, newsletter, search] = items;
+const NavbarComponent = ({ items }) => {
+  const [tpi, publications, about, contactUs] = items;
   const [isOpen, setIsOpen] = useState(false);
   return (
     <div className="navbar" role="navigation" aria-label="main navigation">
@@ -122,14 +122,6 @@ const NavbarComponent = ({ items, openSearchMode }) => {
           <a href="/" className="navbar-item logo">
             <img src={Logo} alt="Transition Pathway Initiative logo" />
           </a>
-          <a
-            className="navbar-item"
-            aria-label={search.entry}
-            role="button"
-            onClick={openSearchMode}
-          >
-            {search.hasIcon && <span className="icon icon__search" />}
-          </a>
           <a
             role="button"
             className={classnames('navbar-burger', {'is-active': isOpen})}
@@ -192,20 +184,10 @@ const NavbarComponent = ({ items, openSearchMode }) => {
 
           <div className="navbar-end">
             <a
-              href={newsletter.path}
-              className={classnames('navbar-item', {
-                'is-active': newsletter.active
-              })}
-            >
-              {newsletter.entry}
-            </a>
-            <a
-              className="navbar-item is-hidden-touch"
-              aria-label={search.entry}
-              role="button"
-              onClick={openSearchMode}
+              href={contactUs.path}
+              className="navbar-item"
             >
-              {search.hasIcon && <span className="icon icon__search" />}
+              {contactUs.entry}
             </a>
           </div>
 
@@ -250,8 +232,7 @@ NavbarComponent.propTypes = {
       hasIcon: PropTypes.bool,
       className: PropTypes.string
     })
-  ).isRequired,
-  openSearchMode: PropTypes.func.isRequired
+  ).isRequired
 };
 
 const Navbar = ({ items, controls }) => {

diff --git a/app/views/layouts/tpi/_footer.html.erb b/app/views/layouts/tpi/_footer.html.erb
@@ -7,11 +7,8 @@
     </div>
     <div class="columns footer__menu">
       <div class="column is-9 footer__menu-list">
-        <button class="button is-primary is-hidden-mobile">
-          <a href="mailto:[email protected]" class="footer-link">Contact Us</a>
-        </button>
         <div>
-          <a href="/use-of-the-centre-s-data" class="link is-large" target="_blank">Use of the Centre's data</a>
+          <a href="/use-of-the-centre-s-data" class="link is-large" target="_blank">Use of TPI Centre data</a>
         </div>
         <div>
           <a href="https://www.lse.ac.uk/lse-information/terms-of-use" class="link is-large is-hidden-touch" target="_blank">LSE Terms of use</a>

diff --git a/app/views/layouts/tpi/_header.html.erb b/app/views/layouts/tpi/_header.html.erb
@@ -50,15 +50,9 @@
       active: active_menu_page?(@about_pages_paths)
     },
     {
-      entry: 'Newsletter',
-      path: tpi_newsletter_path,
-      active: active_menu_page?(tpi_newsletter_path)
-    },
-    {
-      entry: 'Search',
-      hasIcon: true,
-      path: tpi_search_path,
-      active: active_menu_page?(tpi_search_path)
+      entry: 'Contact Us',
+      path: 'mailto:[email protected]',
+      active: false
     },
   ],
   controls: {

diff --git a/app/views/tpi/banks/index.html.erb b/app/views/tpi/banks/index.html.erb
@@ -5,13 +5,13 @@
   <div class="banks-index-page__info">
     <div class="container">
       <div class="title">Introduction</div>
-      <p class="description">The banking project at the TPI Centre seeks to evaluate and compare the level of progress that banks are making in the transition to a low-carbon economy. This year, the TPI Centre assessed 26 major international banks, 10 US super-regional banks, and 2 custodian banks on two elements:</p>
+      <p class="description">Our goal is to provide high-quality data to evaluate and compare the progress banks are making in aligning their financing activities with the goals of the Paris Agreement. In 2024, the TPI Centre assessed 26 major international banks, 10 US super-regional banks, and two custodian banks on two elements:</p>
       <ol>
         <li>
-          <strong>Net Zero Banking Assessment Framework (NZBAF)</strong>, a granular framework evaluating banks on 72 sub-indicators across ten areas, such as their decarbonisation strategy, climate governance, or exposure and emissions disclosure.
+          <strong>Net Zero Banking Assessment Framework (NZBAF)</strong>, an investor-led framework developed in consultation with IIGCC and Ceres evaluating banks on 72 sub-indicators across ten areas, such as their decarbonisation strategy, climate governance, or exposure and emissions disclosure.
         </li>
         <li>
-          <strong>Carbon Performance</strong>, an in-depth quantitative assessment of which sectors and business activities are covered by banks’ decarbonisation targets over different timeframes and their level of alignment with low carbon benchmarks (1.5°C, Below&nbsp;2°C, International and National Pledges).
+          <strong>Carbon Performance</strong>, an in-depth quantitative assessment of which sectors and business activities are covered by banks’ decarbonisation targets over different timeframes and their level of alignment with low carbon benchmarks (1.5°C, Below 2°C, International and National Pledges).
         </li>
       </ol>
     </div>

diff --git a/app/views/tpi/home/_sector_cluster_stat.html.erb b/app/views/tpi/home/_sector_cluster_stat.html.erb
@@ -4,7 +4,8 @@
       <div class="stat-box__icon"><%= image_tag icon %></div>
       <div class="stat-box__content">
         <div class="stat-box__number"><%= cluster.sectors.count %></div>
-        <div class="stat-box__title"><%= cluster.name.titleize %></div>
+        <div class="stat-box__number"><%= cluster.name.titleize %></div>
+
       </div>
     </div>
     <div class="stat-box__sectors"><%= cluster.sectors.map(&:name).join(', ')  %></div>

diff --git a/app/views/tpi/home/corporate_bond_issuers.html.erb b/app/views/tpi/home/corporate_bond_issuers.html.erb
@@ -7,6 +7,6 @@
   </h1>
 
   <div class="corporate-bond-box">
-    The TPI Centre assesses the top 30 corporate bond issuers by the market value of issued debt in electricity and oil & gas sectors. Bond issuers in other high-emitting sectors will be added in the future. Bond issuers are assessed using the same MQ and CP scoring methodologies used for publicly listed equities. Many of the largest bond issuers are also among the largest companies by market capitalisation, so there is a significant overlap in the listed equities and corporate bonds company universes. The full dataset of bond issuers you can find in <a href="/tpi/static/Summary - top 30 OG and Electricity bond issuers.xlsx">the attached spreadsheet</a>. Their MQ and CP scores are available <%= link_to "here", tpi_sector_path('oil-gas') %>
+    TPI Centre assesses the top 30 corporate bond issuers by the market value of issued debt in electricity and oil & gas sectors. Bond issuers in other high-emitting sectors will be added in the future. Bond issuers are assessed using the same MQ and CP scoring methodologies used for publicly listed equities. Many of the largest bond issuers are also among the largest companies by market capitalisation, so there is a significant overlap in the listed equities and corporate bonds company universes. The full dataset of bond issuers you can find in <a href="/tpi/static/Summary - top 30 OG and Electricity bond issuers.xlsx">the attached spreadsheet</a>. Their MQ and CP scores are available <%= link_to "here", tpi_sector_path('oil-gas') %>
   </div>
 </section>
diff --git a/app/views/tpi/home/index.html.erb b/app/views/tpi/home/index.html.erb
@@ -29,16 +29,16 @@
     <div class="container">
       <div class="section-description">
         <%= link_to tpi_sectors_path, class: 'assessment-box' do %>
-          <div class="assessment-box__title"><span>Corporates: CP&nbsp;&&nbsp;MQ</span></div>
+          <div class="assessment-box__title"><span>Corporates <br />CP&nbsp;&&nbsp;MQ</span></div>
         <% end %>
         <%= link_to tpi_corporate_bond_issuers_path, class: 'assessment-box' do %>
-          <div class="assessment-box__title"><span>Corporates: CA100+</span></div>
+          <div class="assessment-box__title"><span>Corporates <br />CA100+</span></div>
         <% end %>
         <%= link_to tpi_banks_path, class: 'assessment-box' do %>
           <div class="assessment-box__title"><span>Banks</span></div>
         <% end %>
         <%= link_to tpi_ascor_index_path, class: 'assessment-box' do %>
-          <div class="assessment-box__title"><span>Sovereigns: ASCOR</span></div>
+          <div class="assessment-box__title"><span>Sovereigns <br />ASCOR</span></div>
         <% end %>
       </div>
     </div>
@@ -115,17 +115,21 @@
       </div>
       <div class="tpi-home__stats-news__stats">
         <h3>
-          CP Sectoral Benchmarks
+          Carbon Performance Sectoral Benchmarks
         </h3>
 
         <div class="stat-boxes">
           <%= render 'sector_cluster_stat', cluster: @sector_clusters['energy'], icon: 'tpi/home/energy.png' %>
           <%= render 'sector_cluster_stat', cluster: @sector_clusters['transport'], icon: 'tpi/home/transport.png' %>
           <%= render 'sector_cluster_stat', cluster: @sector_clusters['industry'], icon: 'tpi/home/industry.png' %>
-          <%= render 'sector_cluster_stat', cluster: @sector_clusters['consumer-goods'], icon: 'tpi/home/food.png' %>
+          <%= render 'sector_cluster_stat', cluster: @sector_clusters['food-producers'], icon: 'tpi/home/food.png' %>
         </div>
       </div>
     </div>
+
+    <div class="at-glance-note">
+      Assets Under Management (and Advice) are subject to market-price and foreign-exchange fluctuations. As the sum of self-reported data by TPI supporters, they may double-count assets.
+    </div>
   </div>
 </section>
 
@@ -140,7 +144,7 @@
         <ul>
           <li>Be part of a global investor community</li>
           <li>Better inform your investment research</li>
-          <li>Help shape our future direction</li>
+          <li>Help shape the future direction of TPI</li>
           <li>Show your commitment in the transition to a low carbon economy</li>
         </ul>
       </div>
@@ -158,7 +162,7 @@
 <section class="section tpi-home__latest-research">
   <div class="container">
     <h2 class="section-title is-size-5-mobile is-size-2">
-      In The Press
+      Featured News and Analysis
     </h2>
 
     <div class="section-description">
@@ -197,18 +201,12 @@
       Funding Partners
     </h2>
     <div class="section-description">
-      <div class="subtitle">The TPI Centre is supported by</div>
+      <div class="subtitle">TPI Centre is supported by</div>
       <div class="images">
         <img src="<%= asset_path 'tpi/funders/climate-arc.png' %>" />
+        <img src="<%= asset_path 'tpi/funders/fte-russell.png' %>" />
         <img src="<%= asset_path 'tpi/funders/lseg-foundation.png' %>" />
         <img src="<%= asset_path 'tpi/funders/tpi.png' %>" />
-        <img src="<%= asset_path 'tpi/funders/fte-russell.png' %>" />
-      </div>
-      <br />
-      <div class="subtitle">The TPI Centre also receives support towards ASCOR from</div>
-      <div class="images">
-        <img src="<%= asset_path 'tpi/funders/laudes-foundation.png' %>" />
-        <img src="<%= asset_path 'tpi/funders/climateworks.png' %>" />
       </div>
       <br />
       <div class="info">If you would like to discuss funding the TPI Centre's work, please <a href="mailto:[email protected]" class="footer-link">Contact Us</a></div>

diff --git a/app/views/tpi/home/newsletter.html.erb b/app/views/tpi/home/newsletter.html.erb
@@ -33,8 +33,8 @@
           <input type="text" value="" name="LNAME" class="required" id="mce-LNAME">
         </div>
         <div class="mc-field-group">
-          <label for="mce-ORGANIZATION">Affiliated Organization  <span class="asterisk">*</span></label>
-          <input type="text" value="" name="ORGANIZATION" class="required" id="mce-ORGANIZATION">
+          <label for="mce-ORGANISATION">Affiliated Organisation  <span class="asterisk">*</span></label>
+          <input type="text" value="" name="ORGANISATION" class="required" id="mce-ORGANISATION">
         </div>
         <div id="mce-responses" class="clear">
           <div class="response" id="mce-error-response" style="display:none"></div>