From fa0c61fe398967ae9d18a2008a20a60352a823f4 Mon Sep 17 00:00:00 2001 From: Ram Modhvadia Date: Thu, 12 Feb 2026 08:46:49 +0000 Subject: [PATCH 1/4] add class to run button for button radius --- src/assets/stylesheets/RunnerControls.scss | 7 +++++++ src/components/RunButton/RunnerControls.jsx | 2 +- 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/src/assets/stylesheets/RunnerControls.scss b/src/assets/stylesheets/RunnerControls.scss index fc6ac06a7..f3f01ab7f 100644 --- a/src/assets/stylesheets/RunnerControls.scss +++ b/src/assets/stylesheets/RunnerControls.scss @@ -4,4 +4,11 @@ display: flex; align-items: center; padding: 0 $space-0-5; + + .run-btn { + border-radius: var(--run-button-radius, $space-0-5); + &:hover { + border-radius: var(--run-button-radius, $space-0-5); + } + } } diff --git a/src/components/RunButton/RunnerControls.jsx b/src/components/RunButton/RunnerControls.jsx index 814464c67..46277cf46 100644 --- a/src/components/RunButton/RunnerControls.jsx +++ b/src/components/RunButton/RunnerControls.jsx @@ -32,7 +32,7 @@ const RunnerControls = ({ embedded = false, skinny = false }) => { ButtonIcon={RunIcon} buttonIconPosition="right" buttonOuter={skinny} - className={skinny ? "btn--small" : ""} + className={skinny ? "btn--small" : "run-btn"} /> )} From 482de17026457c709feb3f891c36c276efc2599b Mon Sep 17 00:00:00 2001 From: Ram Modhvadia Date: Thu, 12 Feb 2026 08:47:37 +0000 Subject: [PATCH 2/4] custom border radius for project bar buttons --- src/assets/stylesheets/ProjectBar.scss | 29 +++++++++++++++++--------- 1 file changed, 19 insertions(+), 10 deletions(-) diff --git a/src/assets/stylesheets/ProjectBar.scss b/src/assets/stylesheets/ProjectBar.scss index 6041e50cb..16c1e7702 100644 --- a/src/assets/stylesheets/ProjectBar.scss +++ b/src/assets/stylesheets/ProjectBar.scss @@ -16,6 +16,24 @@ justify-content: left; } + .btn { + border-radius: var(--project-bar-button-radius, $space-0-5); + &:hover, + &:active, + &:focus-visible, + &::before { + border-radius: var(--project-bar-button-radius, $space-0-5); + } + } + + .btn--save { + @container (min-width: 560px) { + .icon { + display: none; + } + } + } + .project-name { border-inline-end: 1px solid var(--editor-color-outline); margin-inline-end: -1px; @@ -28,18 +46,9 @@ } } - .btn--save { - border-radius: $space-0-5; - @container (min-width: 560px) { - .icon { - display: none; - } - } - } - .project-bar__btn-wrapper { display: flex; - block-size: 100%; + block-size: 100%; } .project-bar__btn-wrapper:not(:last-child) { From 8fcfe92a42f5005f9ef7ef759705f5091cf5af18 Mon Sep 17 00:00:00 2001 From: Ram Modhvadia Date: Thu, 12 Feb 2026 10:24:49 +0000 Subject: [PATCH 3/4] undo changes to runner controls --- src/assets/stylesheets/RunnerControls.scss | 7 ------- src/components/RunButton/RunnerControls.jsx | 2 +- 2 files changed, 1 insertion(+), 8 deletions(-) diff --git a/src/assets/stylesheets/RunnerControls.scss b/src/assets/stylesheets/RunnerControls.scss index f3f01ab7f..fc6ac06a7 100644 --- a/src/assets/stylesheets/RunnerControls.scss +++ b/src/assets/stylesheets/RunnerControls.scss @@ -4,11 +4,4 @@ display: flex; align-items: center; padding: 0 $space-0-5; - - .run-btn { - border-radius: var(--run-button-radius, $space-0-5); - &:hover { - border-radius: var(--run-button-radius, $space-0-5); - } - } } diff --git a/src/components/RunButton/RunnerControls.jsx b/src/components/RunButton/RunnerControls.jsx index 46277cf46..814464c67 100644 --- a/src/components/RunButton/RunnerControls.jsx +++ b/src/components/RunButton/RunnerControls.jsx @@ -32,7 +32,7 @@ const RunnerControls = ({ embedded = false, skinny = false }) => { ButtonIcon={RunIcon} buttonIconPosition="right" buttonOuter={skinny} - className={skinny ? "btn--small" : "run-btn"} + className={skinny ? "btn--small" : ""} /> )} From 08605697508bbcdfce7aeecf19e4e3de079a9f81 Mon Sep 17 00:00:00 2001 From: Ram Modhvadia Date: Thu, 12 Feb 2026 10:26:12 +0000 Subject: [PATCH 4/4] add border radius var for primary button --- src/assets/stylesheets/Button.scss | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/src/assets/stylesheets/Button.scss b/src/assets/stylesheets/Button.scss index 1cdf50081..4d507c1af 100644 --- a/src/assets/stylesheets/Button.scss +++ b/src/assets/stylesheets/Button.scss @@ -35,7 +35,7 @@ &--primary { background-color: var(--rpf-button-primary-background-color); - border-radius: $space-0-5; + border-radius: var(--rpf-primary-button-radius, $space-0-5); color: var(--rpf-button-primary-text-color); @@ -56,7 +56,7 @@ &:hover, .btn-outer:hover & { background-color: var(--rpf-button-primary-background-color-hover); - border-radius: $space-0-5; + border-radius: var(--rpf-primary-button-radius, $space-0-5); } &:disabled { @@ -237,11 +237,15 @@ } &:hover { - background-color: var(--rpf-button-tertiary-danger-background-color-hover); + background-color: var( + --rpf-button-tertiary-danger-background-color-hover + ); } &:active { - background-color: var(--rpf-button-tertiary-danger-background-color-active); + background-color: var( + --rpf-button-tertiary-danger-background-color-active + ); } } }