From 6c4ab8940d0e475b00735affbedd168814607ab7 Mon Sep 17 00:00:00 2001 From: Eva Marco Date: Fri, 24 Apr 2026 12:48:58 +0200 Subject: [PATCH] :bug: Fix colorpicker eyedropper on gradients tab (#9125) * :bug: Fix colorpicker eyedropper on gradients tab * :bug: Fix gradient test deleting opacity input --- CHANGES.md | 2 ++ .../playwright/ui/specs/colorpicker.spec.js | 16 ---------------- .../src/app/main/ui/workspace/colorpicker.cljs | 17 ----------------- 3 files changed, 2 insertions(+), 33 deletions(-) diff --git a/CHANGES.md b/CHANGES.md index 15477e736a..9e0e9d6bee 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -81,6 +81,8 @@ - Fix incorrect rendering when exporting text as SVG, PNG and JPG (by @edwin-rivera-dev) [Github #8516](https://github.com/penpot/penpot/issues/8516) - Fix plugin `addInteraction` silently rejecting `open-overlay` actions with `manualPositionLocation` [Github #8409](https://github.com/penpot/penpot/issues/8409) - Fix typography style creation with tokenized line-height (by @juan-flores077) [Github #8479](https://github.com/penpot/penpot/issues/8479) +- Fix colorpicker layout so the eyedropper button is visible again [Taiga #14057](https://tree.taiga.io/project/penpot/issue/14057) + ## 2.16.0 (Unreleased) diff --git a/frontend/playwright/ui/specs/colorpicker.spec.js b/frontend/playwright/ui/specs/colorpicker.spec.js index a0e28eea07..225c7da433 100644 --- a/frontend/playwright/ui/specs/colorpicker.spec.js +++ b/frontend/playwright/ui/specs/colorpicker.spec.js @@ -85,14 +85,6 @@ test("Create a LINEAR gradient", async ({ page }) => { .last(); await inputOpacity2.fill("40"); - const inputOpacityGlobal = workspacePage.colorpicker.getByTestId( - "opacity-global-input", - ); - await inputOpacityGlobal.fill("50"); - await inputOpacityGlobal.press("Enter"); - await expect(inputOpacityGlobal).toHaveValue("50"); - await expect(inputOpacityGlobal).toBeVisible(); - await expect( workspacePage.page.getByText("Linear gradient") ).toBeVisible(); @@ -169,14 +161,6 @@ test("Create a RADIAL gradient", async ({ page }) => { .last(); await inputOpacity2.fill("100"); - const inputOpacityGlobal = workspacePage.colorpicker.getByTestId( - "opacity-global-input", - ); - await inputOpacityGlobal.fill("50"); - await inputOpacityGlobal.press("Enter"); - await expect(inputOpacityGlobal).toHaveValue("50"); - await expect(inputOpacityGlobal).toBeVisible(); - await expect( workspacePage.page.getByText("Radial gradient") ).toBeVisible(); diff --git a/frontend/src/app/main/ui/workspace/colorpicker.cljs b/frontend/src/app/main/ui/workspace/colorpicker.cljs index d6d4300848..cf9af4aacd 100644 --- a/frontend/src/app/main/ui/workspace/colorpicker.cljs +++ b/frontend/src/app/main/ui/workspace/colorpicker.cljs @@ -26,7 +26,6 @@ [app.main.refs :as refs] [app.main.store :as st] [app.main.ui.components.file-uploader :refer [file-uploader]] - [app.main.ui.components.numeric-input :refer [numeric-input*]] [app.main.ui.components.radio-buttons :refer [radio-buttons radio-button]] [app.main.ui.components.select :refer [select]] [app.main.ui.ds.foundations.assets.icon :as i] @@ -341,11 +340,6 @@ (mapv #(assoc %2 :offset (:offset %1)) stops new-stops)] (st/emit! (dc/update-colorpicker-stops stops))))) - handle-change-gradient-opacity - (mf/use-fn - (fn [value] - (st/emit! (dc/update-colorpicker-gradient-opacity (/ value 100))))) - render-wasm? (features/use-feature "render-wasm/v1") @@ -394,17 +388,6 @@ [:div {:class (stl/css :top-actions)} [:div {:class (stl/css :top-actions-right)} - (when (and (= color-style :direct-color) - (= :gradient selected-mode)) - [:div {:class (stl/css :opacity-input-wrapper)} - [:span {:class (stl/css :icon-text)} "%"] - [:> numeric-input* - {:value (-> data :opacity opacity->string) - :on-change handle-change-gradient-opacity - :default 100 - :data-testid "opacity-global-input" - :min 0 - :max 100}]]) (when (and (= color-style :direct-color) (or (not disable-gradient) (not disable-image)))