3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-06-16 22:41:42 +02:00
Code Issues Projects Releases Packages Wiki Activity

✨ Selects all text when clicking in an input

Browse source
This commit is contained in:
alonso.torres 2020-06-04 15:38:22 +02:00
parent 6e696f2fc2
commit 8d789a4d7d
3 changed files with 18 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

7
frontend/src/uxbox/main/ui/workspace/sidebar/options/frame.cljs
View file

@ -68,7 +68,8 @@
on-width-change #(on-size-change % :width) on-width-change #(on-size-change % :width)
on-height-change #(on-size-change % :height) on-height-change #(on-size-change % :height)
on-pos-x-change #(on-position-change % :x) on-pos-x-change #(on-position-change % :x)
on-pos-y-change #(on-position-change % :y)] on-pos-y-change #(on-position-change % :y)
select-all #(-> % (dom/get-target) (.select))]
[:div.element-set [:div.element-set
@ -103,6 +104,7 @@
[:div.input-element.pixels [:div.input-element.pixels
[:input.input-text {:type "number" [:input.input-text {:type "number"
:min "0" :min "0"
:on-click select-all
:on-change on-width-change :on-change on-width-change
:value (-> (:width shape) :value (-> (:width shape)
(math/precision 2) (math/precision 2)
@ -112,6 +114,7 @@
[:div.input-element.pixels [:div.input-element.pixels
[:input.input-text {:type "number" [:input.input-text {:type "number"
:min "0" :min "0"
:on-click select-all
:on-change on-height-change :on-change on-height-change
:value (-> (:height shape) :value (-> (:height shape)
(math/precision 2) (math/precision 2)
@ -123,6 +126,7 @@
[:div.input-element.pixels [:div.input-element.pixels
[:input.input-text {:placeholder "x" [:input.input-text {:placeholder "x"
:type "number" :type "number"
:on-click select-all
:on-change on-pos-x-change :on-change on-pos-x-change
:value (-> (:x shape) :value (-> (:x shape)
(math/precision 2) (math/precision 2)
@ -130,6 +134,7 @@
[:div.input-element.pixels [:div.input-element.pixels
[:input.input-text {:placeholder "y" [:input.input-text {:placeholder "y"
:type "number" :type "number"
:on-click select-all
:on-change on-pos-y-change :on-change on-pos-y-change
:value (-> (:y shape) :value (-> (:y shape)
(math/precision 2) (math/precision 2)

10
frontend/src/uxbox/main/ui/workspace/sidebar/options/measures.cljs
View file

@ -22,7 +22,6 @@
[uxbox.util.i18n :refer [t] :as i18n])) [uxbox.util.i18n :refer [t] :as i18n]))
;; -- User/drawing coords ;; -- User/drawing coords
(mf/defc measures-menu (mf/defc measures-menu
[{:keys [shape options] :as props}] [{:keys [shape options] :as props}]
(let [options (or options #{:size :position :rotation :radius}) (let [options (or options #{:size :position :rotation :radius})
@ -72,7 +71,8 @@
on-width-change #(on-size-change % :width) on-width-change #(on-size-change % :width)
on-height-change #(on-size-change % :height) on-height-change #(on-size-change % :height)
on-pos-x-change #(on-position-change % :x) on-pos-x-change #(on-position-change % :x)
on-pos-y-change #(on-position-change % :y)] on-pos-y-change #(on-position-change % :y)
select-all #(-> % (dom/get-target) (.select))]
[:div.element-set [:div.element-set
[:div.element-set-content [:div.element-set-content
@ -90,6 +90,7 @@
[:input.input-text {:type "number" [:input.input-text {:type "number"
:min "0" :min "0"
:no-validate true :no-validate true
:on-click select-all
:on-change on-width-change :on-change on-width-change
:value (str (-> (:width shape) :value (str (-> (:width shape)
(d/coalesce 0) (d/coalesce 0)
@ -100,6 +101,7 @@
[:input.input-text {:type "number" [:input.input-text {:type "number"
:min "0" :min "0"
:no-validate true :no-validate true
:on-click select-all
:on-change on-height-change :on-change on-height-change
:value (str (-> (:height shape) :value (str (-> (:height shape)
(d/coalesce 0) (d/coalesce 0)
@ -113,12 +115,14 @@
[:input.input-text {:placeholder "x" [:input.input-text {:placeholder "x"
:type "number" :type "number"
:no-validate true :no-validate true
:on-click select-all
:on-change on-pos-x-change :on-change on-pos-x-change
:value (-> shape :selrect :x (math/precision 2))}]] :value (-> shape :selrect :x (math/precision 2))}]]
[:div.input-element.Yaxis [:div.input-element.Yaxis
[:input.input-text {:placeholder "y" [:input.input-text {:placeholder "y"
:type "number" :type "number"
:no-validate true :no-validate true
:on-click select-all
:on-change on-pos-y-change :on-change on-pos-y-change
:value (-> shape :selrect :y (math/precision 2))}]]]) :value (-> shape :selrect :y (math/precision 2))}]]])
@ -132,6 +136,7 @@
:no-validate true :no-validate true
:min "0" :min "0"
:max "359" :max "359"
:on-click select-all
:on-change on-rotation-change :on-change on-rotation-change
:value (str (-> (:rotation shape) :value (str (-> (:rotation shape)
(d/coalesce 0) (d/coalesce 0)
@ -154,6 +159,7 @@
[:input.input-text [:input.input-text
{:placeholder "rx" {:placeholder "rx"
:type "number" :type "number"
:on-click select-all
:on-change on-radius-change :on-change on-radius-change
:value (str (-> (:rx shape) :value (str (-> (:rx shape)
(d/coalesce 0) (d/coalesce 0)

5
frontend/src/uxbox/main/ui/workspace/sidebar/options/rows/color_row.cljs
View file

@ -77,7 +77,8 @@
dom/get-target dom/get-target
dom/get-value dom/get-value
string->opacity string->opacity
change-opacity))] change-opacity))
select-all #(-> % (dom/get-target) (.select))]
(mf/use-effect (mf/use-effect
(mf/deps value) (mf/deps value)
@ -91,12 +92,14 @@
[:div.color-info [:div.color-info
[:input {:value (-> @state :value (subs 1)) [:input {:value (-> @state :value (subs 1))
:pattern "^[0-9a-fA-F]{0,6}$" :pattern "^[0-9a-fA-F]{0,6}$"
:on-click select-all
:on-change handle-input-color-change}]] :on-change handle-input-color-change}]]
(when (not disable-opacity) (when (not disable-opacity)
[:div.input-element.percentail [:div.input-element.percentail
[:input.input-text {:type "number" [:input.input-text {:type "number"
:value (-> @state :opacity opacity->string) :value (-> @state :opacity opacity->string)
:on-click select-all
:on-change handle-opacity-change :on-change handle-opacity-change
:min "0" :min "0"
:max "100"}]]) :max "100"}]])