Updates to Anonymous Landing Page #2741

ciyer · 2023-08-16T09:57:02Z

An update to the landing page.

Fix #2681

/deploy renku=renku-ui/3.11-acceptance-tests #persist

ciyer · 2023-08-17T12:19:51Z

From the meeting today:

Buttons on first section should have translucent background with white text and outlines that turn green on hover
"Get Started" links to https://renku.readthedocs.io/en/stable/tutorials/01_firststeps.html
Leave the "Connecting dots" section unchanged
Drop the Explore column in the bottom nav
"Renku version" links to the the same page as the release number
"Why Renku" links to https://renku.readthedocs.io/en/stable/introduction/why.html
Remove "Features page" from the Help page

ciyer · 2023-08-18T13:36:18Z

Screenshots

RenkuBot · 2023-08-18T15:19:37Z

You can access the deployment of this PR at https://renku-ci-ui-2741.dev.renku.ch

ciyer · 2023-08-22T09:44:18Z

Testing: check that the new design matches Figma

leafty · 2023-08-22T11:22:52Z

client/src/landing/anonymousHomeNav.tsx

+          </Col>
+          <Col md={3}>
+            <BottomNavSection sectionTitle="Follow us">
+              <BottomNavExternalLink title="Twitter" url={Links.TWITTER} />


🤓

Suggested change

<BottomNavExternalLink title="Twitter" url={Links.TWITTER} />

<BottomNavExternalLink title="𝕏 (formerly Twitter)" url={Links.TWITTER} />

Some companies have already updated it actually. e.g. a marketing email I received:

lorenzo-cavazzi

This looks good! A couple of tiny changes before merging:

The buttons margin/spacing could be improved by removing the right margin and adding X margins, and adding either the bottom or Y margins. Currently, they have no bottom margin and the first 2 buttons have a right margin, making their borders collapse together on smaller screens and moving them into a non horizonatally centered position.
Bottom margins on the top container are inconsistent, depending on the browser size
See inline typos

client/src/landing/anonymousHomeNav.tsx

leafty

About styling: I would suggest avoiding global CSS definitions and using Bootstrap's utility classes as much as possible. For cases when custom styling is required, (S)CSS modules seem appropriate as they will not affect components outside of their scope.

leafty · 2023-08-22T11:46:22Z

client/src/styles/bootstrap_ext/_button.scss

@@ -135,6 +135,18 @@ $borderRadius: 1000px;
  }
 }

+.btn-outline-rk-white {


This class is generated by Bootstrap, I would prefer if we do not change its behavior globally. Would it be possible to override this in a (S)CSS module?

Also, overriding the color can be done with the bootstrap CSS variables (e.g. check the overrides from btn-danger or btn-outline-danger).

client/src/styles/components/_renku_home.scss

leafty · 2023-08-22T11:52:06Z

client/src/styles/components/_renku_home.scss

@@ -100,6 +114,17 @@ nav.rk-anon-home .nav-link {
  }
 }

+#rk-anon-home-bottom-nav {
+  @extend .section-content, .bg-primary;
+  color: $rk-white;


Use text-rk-white as a class name.

client/src/styles/components/_renku_home.scss

ciyer · 2023-08-23T07:28:10Z

Thanks for the reviews, it's important that this page be polished. I think I have addressed all requests.

leafty · 2023-08-23T07:16:52Z

client/src/styles/bootstrap_ext/_button.scss

@@ -176,6 +164,16 @@ $borderRadius: 1000px;
  --bs-btn-active-color: white;
 }

+.btn-rk-over-green {
+  --bs-btn-active-bg: #{$rk-green};


As a note, I think var(--bs-rk-green) would work too.

client/src/landing/anonymousHome.types.ts

leafty · 2023-08-23T08:41:16Z

client/src/landing/anonymousHomeNav.tsx

+          </Col>
+          <Col md={3}>
+            <BottomNavSection sectionTitle="Follow us">
+              <BottomNavExternalLink title="Twitter" url={Links.TWITTER} />


Some companies have already updated it actually. e.g. a marketing email I received:

Co-authored-by: Flora Thiebaut <johann.thiebaut@sdsc.ethz.ch>

lorenzo-cavazzi

Lgtm.
Keep using "Twitter" works fine for me since the new name is hard to relate to the product without the icon or specifying that it's actually what used to be Twitter

RenkuBot · 2023-08-24T07:27:33Z

Tearing down the temporary RenkuLab deplyoment for this PR.

ciyer force-pushed the ciyer/2681-landing branch 4 times, most recently from 16e59f2 to e493e22 Compare August 18, 2023 13:34

ciyer temporarily deployed to renku-ci-ui-2741 August 18, 2023 15:18 — with GitHub Actions Inactive

ciyer temporarily deployed to renku-ci-ui-2741 August 21, 2023 10:35 — with GitHub Actions Inactive

ciyer force-pushed the ciyer/2681-landing branch from 012b8a4 to 821fd7f Compare August 22, 2023 06:36

ciyer had a problem deploying to renku-ci-ui-2741 August 22, 2023 06:36 — with GitHub Actions Error

ciyer temporarily deployed to renku-ci-ui-2741 August 22, 2023 06:37 — with GitHub Actions Inactive

ciyer temporarily deployed to renku-ci-ui-2741 August 22, 2023 07:59 — with GitHub Actions Inactive

ciyer force-pushed the ciyer/2681-landing branch from 1775220 to 454bf7f Compare August 22, 2023 08:35

ciyer had a problem deploying to renku-ci-ui-2741 August 22, 2023 08:36 — with GitHub Actions Error

ciyer marked this pull request as ready for review August 22, 2023 08:36

ciyer requested a review from a team as a code owner August 22, 2023 08:36

ciyer temporarily deployed to renku-ci-ui-2741 August 22, 2023 08:36 — with GitHub Actions Inactive

ciyer marked this pull request as draft August 22, 2023 08:46

ciyer temporarily deployed to renku-ci-ui-2741 August 22, 2023 09:01 — with GitHub Actions Inactive

ciyer had a problem deploying to renku-ci-ui-2741 August 22, 2023 09:35 — with GitHub Actions Error

ciyer temporarily deployed to renku-ci-ui-2741 August 22, 2023 09:42 — with GitHub Actions Inactive

ciyer marked this pull request as ready for review August 22, 2023 09:57

leafty reviewed Aug 22, 2023

View reviewed changes

lorenzo-cavazzi requested changes Aug 22, 2023

View reviewed changes

client/src/landing/anonymousHomeNav.tsx Outdated Show resolved Hide resolved

client/src/landing/anonymousHomeNav.tsx Outdated Show resolved Hide resolved

leafty reviewed Aug 22, 2023

View reviewed changes

ciyer temporarily deployed to renku-ci-ui-2741 August 22, 2023 12:11 — with GitHub Actions Inactive

ciyer temporarily deployed to renku-ci-ui-2741 August 22, 2023 13:52 — with GitHub Actions Inactive

feat: update landing page

8760fd7

cramakri added 7 commits August 22, 2023 23:10

use Url.get better

4921362

implement search

e0c92c9

cosmetic fixups

f3a6db7

add link to license

a59cc55

fix spacing

202498b

fix navbar

f9d5c61

review response 1

a1b3456

ciyer force-pushed the ciyer/2681-landing branch from b36a24d to 7868780 Compare August 22, 2023 21:43

ciyer temporarily deployed to renku-ci-ui-2741 August 22, 2023 21:44 — with GitHub Actions Inactive

review response 2

1d2dea1

ciyer force-pushed the ciyer/2681-landing branch from 7868780 to 1d2dea1 Compare August 23, 2023 07:05

ciyer temporarily deployed to renku-ci-ui-2741 August 23, 2023 07:05 — with GitHub Actions Inactive

ciyer requested review from lorenzo-cavazzi and leafty August 23, 2023 07:28

review response 3 -- ensure some padding at the bottom of first section

e4add2f

ciyer temporarily deployed to renku-ci-ui-2741 August 23, 2023 08:15 — with GitHub Actions Inactive

leafty reviewed Aug 23, 2023

View reviewed changes

Update client/src/landing/anonymousHome.types.ts

6904fe0

Co-authored-by: Flora Thiebaut <johann.thiebaut@sdsc.ethz.ch>

ciyer temporarily deployed to renku-ci-ui-2741 August 23, 2023 11:47 — with GitHub Actions Inactive

lorenzo-cavazzi approved these changes Aug 23, 2023

View reviewed changes

Merge branch 'master' into ciyer/2681-landing

f581076

ciyer deployed to renku-ci-ui-2741 August 23, 2023 13:48 — with GitHub Actions View deployment

ciyer merged commit 29308e0 into master Aug 24, 2023
14 checks passed

ciyer deleted the ciyer/2681-landing branch August 24, 2023 07:26

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Updates to Anonymous Landing Page #2741

Updates to Anonymous Landing Page #2741

ciyer commented Aug 16, 2023 •

edited

Loading

ciyer commented Aug 17, 2023

ciyer commented Aug 18, 2023

RenkuBot commented Aug 18, 2023

ciyer commented Aug 22, 2023

leafty Aug 22, 2023

leafty Aug 23, 2023

lorenzo-cavazzi left a comment

leafty left a comment

leafty Aug 22, 2023

leafty Aug 22, 2023

ciyer commented Aug 23, 2023

leafty Aug 23, 2023

leafty Aug 23, 2023

lorenzo-cavazzi left a comment

RenkuBot commented Aug 24, 2023

	<BottomNavExternalLink title="Twitter" url={Links.TWITTER} />
	<BottomNavExternalLink title="𝕏 (formerly Twitter)" url={Links.TWITTER} />

Updates to Anonymous Landing Page #2741

Updates to Anonymous Landing Page #2741

Conversation

ciyer commented Aug 16, 2023 • edited Loading

ciyer commented Aug 17, 2023

ciyer commented Aug 18, 2023

Screenshots

RenkuBot commented Aug 18, 2023

ciyer commented Aug 22, 2023

leafty Aug 22, 2023

Choose a reason for hiding this comment

leafty Aug 23, 2023

Choose a reason for hiding this comment

lorenzo-cavazzi left a comment

Choose a reason for hiding this comment

leafty left a comment

Choose a reason for hiding this comment

leafty Aug 22, 2023

Choose a reason for hiding this comment

leafty Aug 22, 2023

Choose a reason for hiding this comment

ciyer commented Aug 23, 2023

leafty Aug 23, 2023

Choose a reason for hiding this comment

leafty Aug 23, 2023

Choose a reason for hiding this comment

lorenzo-cavazzi left a comment

Choose a reason for hiding this comment

RenkuBot commented Aug 24, 2023

ciyer commented Aug 16, 2023 •

edited

Loading