diff --git a/templates/corporate/apps.html b/templates/corporate/apps.html index a652e17237..e332460688 100644 --- a/templates/corporate/apps.html +++ b/templates/corporate/apps.html @@ -26,13 +26,13 @@

Zulip for

-

For download instructions, go to the desktop app install guide.

- - - + + + +

diff --git a/web/src/portico/landing-page.js b/web/src/portico/landing-page.js index c30adae598..177ad0530f 100644 --- a/web/src/portico/landing-page.js +++ b/web/src/portico/landing-page.js @@ -15,25 +15,30 @@ const apps_events = function () { windows: { alt: "Windows", description: - "Zulip for Windows is even better than Zulip on the web, with a cleaner look, tray integration, native notifications, and support for multiple Zulip accounts.", + "The Zulip desktop app comes with native desktop notifications, support for multiple Zulip accounts, and a dedicated tray icon.", download_link: "/apps/download/windows", show_instructions: true, install_guide: "/help/desktop-app-install-guide", app_type: "desktop", + download_instructions: + 'For help or to install offline, see our installation guide.', }, mac: { alt: "macOS", description: - "Zulip on macOS is even better than Zulip on the web, with a cleaner look, tray integration, native notifications, and support for multiple Zulip accounts.", + "The Zulip desktop app comes with native desktop notifications, support for multiple Zulip accounts, and a dedicated tray icon.", download_link: "/apps/download/mac", mac_arm64_link: "/apps/download/mac-arm64", show_instructions: true, install_guide: "/help/desktop-app-install-guide", app_type: "desktop", + download_instructions: + 'For help or to install via Homebrew, see our installation guide.', }, android: { alt: "Android", - description: "Zulip's native Android app makes it easy to keep up while on the go.", + description: + "Zulip's native Android app makes it easy to keep up while on the go, with fully customizable mobile notifications.", show_instructions: false, play_store_link: "https://play.google.com/store/apps/details?id=com.zulipmobile", download_link: "https://github.com/zulip/zulip-mobile/releases/latest", @@ -41,7 +46,8 @@ const apps_events = function () { }, ios: { alt: "iOS", - description: "Zulip's native iOS app makes it easy to keep up while on the go.", + description: + "Zulip's native iOS app makes it easy to keep up while on the go, with fully customizable mobile notifications.", show_instructions: false, app_store_link: "https://itunes.apple.com/us/app/zulip/id1203036395", app_type: "mobile", @@ -49,11 +55,13 @@ const apps_events = function () { linux: { alt: "Linux", description: - "Zulip on the Linux desktop is even better than Zulip on the web, with a cleaner look, tray integration, native notifications, and support for multiple Zulip accounts.", + "The Zulip desktop app comes with native desktop notifications, support for multiple Zulip accounts, and a dedicated tray icon.", download_link: "/apps/download/linux", show_instructions: true, install_guide: "/help/desktop-app-install-guide", app_type: "desktop", + download_instructions: + 'For help or to install via a package manager, see our installation guide.', }, }; @@ -85,13 +93,13 @@ const apps_events = function () { const version_info = info[version]; $(".info .platform").text(version_info.alt); - $(".info .description").text(version_info.description); + $(".info .description").html(version_info.description); $desktop_download_link.attr("href", version_info.download_link); $download_from_google_play_store.attr("href", version_info.play_store_link); $download_from_apple_app_store.attr("href", version_info.app_store_link); - $download_android_apk.attr("href", version_info.download_link); - $download_mac_arm64.attr("href", version_info.mac_arm64_link); - $download_instructions.find("a").attr("href", version_info.install_guide); + $download_android_apk.find("a").attr("href", version_info.download_link); + $download_mac_arm64.find("a").attr("href", version_info.mac_arm64_link); + $download_instructions.html(version_info.download_instructions); $download_instructions.toggle(version_info.show_instructions); diff --git a/web/styles/portico/landing_page.css b/web/styles/portico/landing_page.css index f4b1a1bb36..f5c1bea220 100644 --- a/web/styles/portico/landing_page.css +++ b/web/styles/portico/landing_page.css @@ -1041,7 +1041,7 @@ button { hsl(197deg 100% 16%), hsl(166deg 45% 49%) ); - height: 600px; + height: 450px; color: hsl(0deg 0% 100%); @@ -1082,10 +1082,11 @@ button { .portico-landing.apps .hero .info .cta { text-shadow: 0 0 60px hsl(0deg 0% 0% / 30%); + text-align: center; } .portico-landing.apps .hero .info .flex { - height: 500px; + height: 300px; min-height: 0; } @@ -2155,10 +2156,23 @@ button { #download-from-microsoft-store, #download-android-apk, #download-mac-arm64 { - display: inline-block; + display: block; color: hsl(0deg 0% 100%); font-size: 13px; padding-left: 10px; + + & a { + color: hsl(0deg 0% 100%); + } +} + +#download-from-microsoft-store, +#download-mac-arm64 { + margin-top: 10px; +} + +.download-instructions { + margin-top: 30px; } .feature-container { @@ -2888,3 +2902,8 @@ button { } } } + +.apps .apps-page-link { + text-decoration: underline; + color: hsl(0deg 0% 100%); +}