Merge pull request #29900 from overleaf/td-ciam-login

Implement unified access login page

GitOrigin-RevId: 9973565099e1e88dd9d6b232d8f5c545dc73e6f7

services/web/frontend/js/shared/components/layouts/ciam-layout.tsx

@@ -1,22 +1,43 @@
 import React, { FC, ReactNode } from 'react'
+import { Trans } from 'react-i18next'
+import dsLogo from '@/shared/svgs/digital-science.svg'
 
 type Props = { children: ReactNode }
 
 const CiamLayout: FC<Props> = ({ children }: Props) => (
   <div className="ciam-layout ciam-enabled">
     <header className="ciam-logo">
-      <a href="/" className="brand overleaf-ds-logo">
+      <a href="/" className="brand overleaf-ds-logo ciam-image-link">
         <span className="visually-hidden">Overleaf</span>
       </a>
     </header>
     <div className="ciam-container">
       <main className="ciam-card" id="main-content">
         {children}
+        <section className="ciam-card-footer">
+          <hr className="ciam-card-separator" />
+          <div className="ciam-footer-ds-logo">
+            <img src={dsLogo} alt="Digital Science — home" />
+          </div>
+          <p>
+            <Trans
+              i18nKey="advancing_research_with"
+              components={[
+                // eslint-disable-next-line jsx-a11y/anchor-has-content,react/jsx-key
+                <a href="https://www.overleaf.com" />,
+                // eslint-disable-next-line jsx-a11y/anchor-has-content,react/jsx-key
+                <a href="https://www.papersapp.com/" />,
+              ]}
+            />
+          </p>
+        </section>
       </main>
     </div>
     <footer>
-      <a href="https://www.overleaf.com/legal#Privacy">Privacy</a>
-      <a href="https://www.overleaf.com/legal#Terms">Terms</a>
+      <div className="footer-links">
+        <a href="https://www.overleaf.com/legal#Privacy">Privacy</a>
+        <a href="https://www.overleaf.com/legal#Terms">Terms</a>
+      </div>
     </footer>
   </div>
 )