0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-07 23:08:24 -05:00

Add colorpicker styles and minor changes.

This commit is contained in:
Andrey Antukh 2015-12-22 10:19:04 +02:00
parent 5fb93ad5fd
commit 5cea9f1a36
3 changed files with 16 additions and 10 deletions

View file

@ -16,10 +16,8 @@
(let [canvas (util/get-ref-dom own "colorpicker") (let [canvas (util/get-ref-dom own "colorpicker")
context (.getContext canvas "2d") context (.getContext canvas "2d")
brect (.getBoundingClientRect canvas) brect (.getBoundingClientRect canvas)
ox (.-left brect) x (- (.-pageX e) (.-left brect))
oy (.-top brect) y (- (.-pageY e) (.-top brect))
x (- (.-pageX e) ox)
y (- (.-pageY e) oy)
image (.getImageData context x y 1 1) image (.getImageData context x y 1 1)
r (aget (.-data image) 0) r (aget (.-data image) 0)
g (aget (.-data image) 1) g (aget (.-data image) 1)
@ -30,12 +28,13 @@
(defn colorpicker-render (defn colorpicker-render
[own callback] [own callback]
(html (html
[:canvas [:section.colorpicker
{:width "400" [:canvas
:height "300" {:width "400"
:on-click #(on-click-handler % own callback) :height "300"
:id "colorpicker" :on-click #(on-click-handler % own callback)
:ref "colorpicker"}])) :id "colorpicker"
:ref "colorpicker"}]]))
(defn colorpicker-did-mount (defn colorpicker-did-mount
[own] [own]

View file

@ -43,3 +43,4 @@
@import 'partials/library-bar'; @import 'partials/library-bar';
@import 'partials/lightbox'; @import 'partials/lightbox';
@import 'partials/color-palette'; @import 'partials/color-palette';
@import 'partials/colorpicker';

View file

@ -0,0 +1,6 @@
.colorpicker {
canvas {
border: 1px solid #111111;
cursor: cell;
}
}