diff --git a/base-theme/assets/images/LinkedIn.png b/base-theme/assets/images/LinkedIn.png deleted file mode 100644 index d5cacda2a..000000000 Binary files a/base-theme/assets/images/LinkedIn.png and /dev/null differ diff --git a/base-theme/assets/images/Twitter.png b/base-theme/assets/images/Twitter.png deleted file mode 100644 index 73109004f..000000000 Binary files a/base-theme/assets/images/Twitter.png and /dev/null differ diff --git a/base-theme/assets/images/linkedin-black.png b/base-theme/assets/images/linkedin-black.png new file mode 100644 index 000000000..d07fec7df Binary files /dev/null and b/base-theme/assets/images/linkedin-black.png differ diff --git a/base-theme/assets/images/x-formerly-twitter-black.png b/base-theme/assets/images/x-formerly-twitter-black.png new file mode 100644 index 000000000..4187f9b08 Binary files /dev/null and b/base-theme/assets/images/x-formerly-twitter-black.png differ diff --git a/base-theme/layouts/partials/footer-v2-social-icons.html b/base-theme/layouts/partials/footer-v2-social-icons.html index c2af213e7..f891c7891 100644 --- a/base-theme/layouts/partials/footer-v2-social-icons.html +++ b/base-theme/layouts/partials/footer-v2-social-icons.html @@ -11,7 +11,7 @@
- twitter + twitter
@@ -21,7 +21,7 @@
- LinkedIn + linkedin
diff --git a/base-theme/layouts/partials/footer.html b/base-theme/layouts/partials/footer.html index c7246688a..7ac9cffe5 100644 --- a/base-theme/layouts/partials/footer.html +++ b/base-theme/layouts/partials/footer.html @@ -81,7 +81,7 @@
  • - twitter + twitter
  • @@ -101,8 +101,8 @@ > LinkedIn
    • diff --git a/tests-e2e/ocw-ci-test-www/homepage.spec.ts b/tests-e2e/ocw-ci-test-www/homepage.spec.ts index 56706e420..f28c0d9da 100644 --- a/tests-e2e/ocw-ci-test-www/homepage.spec.ts +++ b/tests-e2e/ocw-ci-test-www/homepage.spec.ts @@ -1,9 +1,40 @@ import { test, expect } from "@playwright/test" -import { siteUrl } from "../util" +import { WwwPage, siteUrl } from "../util" -test("Course page have title in ", async ({ page }) => { +test("Home page has title in ", async ({ page }) => { await page.goto(siteUrl("www")) await expect(page).toHaveTitle( "MIT OpenCourseWare | Free Online Course Materials" ) }) + +test("Social links exist and open correct social media pages", async ({ + page +}) => { + const SOCIAL_LINKS = [ + ["facebook", /https:\/\/www.facebook.com\/MITOCW\/?/], + ["instagram", /https:\/\/www.instagram.com\/mitocw\/?/], + ["twitter", /https:\/\/twitter.com\/MITOCW\/?/], + ["youtube", /https:\/\/www.youtube.com\/mitocw\/?/], + ["linkedin", /https:\/\/www.linkedin.com\/company\/mit-opencourseware\/?/] + ] + + const www = new WwwPage(page) + await www.goto() + + for (const [name, url] of SOCIAL_LINKS) { + for (const location of [".social-icon-row", "#footer-container"]) { + const popupPromise = page.waitForEvent("popup") + + const link = page + .locator(location) + .getByRole("link", { name, exact: true }) + await expect(link).toBeVisible() + await link.click() + + const popup = await popupPromise + await popup.waitForURL(url, { timeout: 10000, waitUntil: "commit" }) + await popup.close() + } + } +}) diff --git a/www/assets/css/home.scss b/www/assets/css/home.scss index cb8175949..ccd7d1c07 100644 --- a/www/assets/css/home.scss +++ b/www/assets/css/home.scss @@ -251,7 +251,7 @@ $searchbox-height: 50px; } .social-icon-row { - width: 225px; + width: 270px; } > div { diff --git a/www/layouts/home.html b/www/layouts/home.html index 5e1d23983..133099b6f 100644 --- a/www/layouts/home.html +++ b/www/layouts/home.html @@ -128,11 +128,14 @@

    Your Donation Makes a Difference

    instagram - twitter + twitter youtube + + linkedin + diff --git a/www/static/images/social-linkedin-blue.svg b/www/static/images/social-linkedin-blue.svg new file mode 100644 index 000000000..8ca78a67c --- /dev/null +++ b/www/static/images/social-linkedin-blue.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/www/static/images/social-twitter-blue.svg b/www/static/images/social-twitter-blue.svg deleted file mode 100644 index f711b20f3..000000000 --- a/www/static/images/social-twitter-blue.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/www/static/images/social-x-formerly-twitter-blue.svg b/www/static/images/social-x-formerly-twitter-blue.svg new file mode 100644 index 000000000..f79fb28bf --- /dev/null +++ b/www/static/images/social-x-formerly-twitter-blue.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + +