feat: apply early access changes #3474

andre-code · 2025-01-08T09:56:02Z

PR to apply early access changes

Use the pink logo.
Change the badge text to "Early Access."
Modify the "Connected Services" link to "Integrations."
Always show "Renku 2.0" in the menu.
Add the Early Access banner.
Change the background image in Dashboard v2.

/deploy

RenkuBot · 2025-01-08T09:57:05Z

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

- use pink logo - change badge for early access - modify connected services link for integrations - show always v2 menu - add early access banner - change bg image in dashboard v2

lorenzo-cavazzi

Great to see the final steps towards early access! 🤩

The code looks good, just a couple of minor details (see inline).
For the dots image on the dashboard, feel free to ignore the part on scaling/resizing if changing it is time-consuming.

lorenzo-cavazzi · 2025-01-09T09:17:19Z

client/public/dashboardV2header.png

The image seems higher than necessary, with some empty space at the bottom. Since it is scaled with the current solution, should we remove the bottom empty space and use an SVG instead?

P.S. About the scaling, the dots are small on smaller screens; while enlarging the window, they get big, then smaller again, and then gradually bigger (see gif). Is that intended? I think we should either scale them gradually or fix two/three sizes, but not mix the two styles (low priority).

As discussed offline, let's keep this for later

lorenzo-cavazzi · 2025-01-09T09:24:27Z

client/src/components/earlyAccessBanner/EarlyAccessBanner.module.scss

+.EarlyAccessBannerBtn {
+  &:hover,
+  &:active {
+    background-color: var(--bs-rk-green) !important;


We should use the hover color instead

Could you clarify what you mean?

In Renku V1, that's the button's primary green color (#009568), not the hover color (#007a6c). That is usually imported as $rk-green-hover

lorenzo-cavazzi · 2025-01-09T09:28:38Z

client/src/components/earlyAccessBanner/EarlyAccessBanner.tsx

+          "align-items-center"
+        )}
+      >
+        <div className="d-none d-sm-block d-lg-none">


Suggested change

<div className="d-none d-sm-block d-lg-none">

<div className={cx("d-none", "d-sm-block", "d-lg-none")}>

lorenzo-cavazzi · 2025-01-09T09:29:11Z

client/src/components/earlyAccessBanner/EarlyAccessBanner.tsx

+            alt="Small image"
+          />
+        </div>
+        <div className="d-none d-lg-block">


Suggested change

<div className="d-none d-lg-block">

<div className={cx("d-none", "d-lg-block")}>

lorenzo-cavazzi · 2025-01-09T09:29:49Z

client/src/components/earlyAccessBanner/EarlyAccessBanner.tsx

+            alt="Renku 2.0"
+            height="25"
+          />
+          <h5 className="mt-1 mb-0">EARLY ACCESS!</h5>


Suggested change

<h5 className="mt-1 mb-0">EARLY ACCESS!</h5>

<h5 className={cx("mt-1", "mb-0")}>EARLY ACCESS!</h5>

- Update the badge text from “Early Access” to “2.0 Early Access.” - Show the Integrations option in the menu only when the user is in Renku 2.0. - In the menu, display Renku 2.0 in bold, with “Early Access” in a normal font weight. - Replace the current image dots with the version Jimena just modified. - When the user is in Renku 2.0, display “Back to Renku 1.0” in the menu.

andre-code · 2025-01-13T19:22:42Z

Thanks, @lorenzo-cavazzi , for the review!
I’ve updated the button in the banner with the correct color and made a small adjustment requested by the PO to align the banner's location with the main navigation. Let me know if there’s anything else!

lorenzo-cavazzi

Lgtm! 🚀

RenkuBot · 2025-01-14T09:58:06Z

Tearing down the temporary RenkuLab deplyoment for this PR.

andre-code had a problem deploying to renku-ci-ui-3474 January 8, 2025 09:56 — with GitHub Actions Failure

andre-code temporarily deployed to renku-ci-ui-3474 January 8, 2025 10:01 — with GitHub Actions Inactive

andre-code marked this pull request as ready for review January 8, 2025 10:12

andre-code requested a review from a team as a code owner January 8, 2025 10:12

feat: apply early access changes.

4c440ee

- use pink logo - change badge for early access - modify connected services link for integrations - show always v2 menu - add early access banner - change bg image in dashboard v2

andre-code force-pushed the andrea/early-access branch from 6d588f8 to 4c440ee Compare January 9, 2025 08:12

andre-code temporarily deployed to renku-ci-ui-3474 January 9, 2025 08:12 — with GitHub Actions Inactive

lorenzo-cavazzi requested changes Jan 9, 2025

View reviewed changes

lorenzo-cavazzi self-assigned this Jan 9, 2025

andre-code added 2 commits January 9, 2025 20:32

fix: add missed cx in classNames and fix responsive dashboard image

7b85bf2

andre-code had a problem deploying to renku-ci-ui-3474 January 9, 2025 20:26 — with GitHub Actions Error

fix: add missed space in badge

250e552

andre-code temporarily deployed to renku-ci-ui-3474 January 9, 2025 20:28 — with GitHub Actions Inactive

modify image early access dots

bd8a2de

andre-code temporarily deployed to renku-ci-ui-3474 January 10, 2025 10:19 — with GitHub Actions Inactive

andre-code added 2 commits January 13, 2025 10:09

display banner after main menu in dashboard

f69d7f9

fix: use hover colors in banner button

fe851ff

andre-code had a problem deploying to renku-ci-ui-3474 January 13, 2025 09:22 — with GitHub Actions Failure

Merge branch 'main' into andrea/early-access

f00fbd0

andre-code had a problem deploying to renku-ci-ui-3474 January 13, 2025 10:21 — with GitHub Actions Failure

andre-code temporarily deployed to renku-ci-ui-3474 January 13, 2025 18:52 — with GitHub Actions Inactive

andre-code requested a review from lorenzo-cavazzi January 13, 2025 20:23

andre-code mentioned this pull request Jan 13, 2025

feat: update dashboard header images #3444

Closed

Merge branch 'main' into andrea/early-access

5d96fb0

lorenzo-cavazzi deployed to renku-ci-ui-3474 January 14, 2025 08:57 — with GitHub Actions View deployment

lorenzo-cavazzi approved these changes Jan 14, 2025

View reviewed changes

andre-code merged commit b016b23 into main Jan 14, 2025
19 checks passed

andre-code deleted the andrea/early-access branch January 14, 2025 09:57

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: apply early access changes #3474

feat: apply early access changes #3474

andre-code commented Jan 8, 2025

RenkuBot commented Jan 8, 2025

lorenzo-cavazzi left a comment

lorenzo-cavazzi Jan 9, 2025

lorenzo-cavazzi Jan 10, 2025

lorenzo-cavazzi Jan 9, 2025

andre-code Jan 9, 2025

lorenzo-cavazzi Jan 10, 2025

lorenzo-cavazzi Jan 9, 2025

lorenzo-cavazzi Jan 9, 2025

lorenzo-cavazzi Jan 9, 2025

andre-code commented Jan 13, 2025

lorenzo-cavazzi left a comment

RenkuBot commented Jan 14, 2025

	<div className="d-none d-sm-block d-lg-none">
	<div className={cx("d-none", "d-sm-block", "d-lg-none")}>

	<div className="d-none d-lg-block">
	<div className={cx("d-none", "d-lg-block")}>

	<h5 className="mt-1 mb-0">EARLY ACCESS!</h5>
	<h5 className={cx("mt-1", "mb-0")}>EARLY ACCESS!</h5>

feat: apply early access changes #3474

feat: apply early access changes #3474

Conversation

andre-code commented Jan 8, 2025

RenkuBot commented Jan 8, 2025

lorenzo-cavazzi left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

andre-code commented Jan 13, 2025

lorenzo-cavazzi left a comment

Choose a reason for hiding this comment

RenkuBot commented Jan 14, 2025