Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-07 15:39:42 -05:00
Code Issues Activity

✨ Improvements over cursor rendering

Browse source
This commit is contained in:
alonso.torres 2021-01-27 12:25:27 +01:00
parent 00ca9755be
commit 385c7274a3
4 changed files with 18 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
frontend/gulpfile.js
View file

@ -131,10 +131,17 @@ gulp.task("scss", function() {
.pipe(gulp.dest(paths.output + "css/"));
});
gulp.task("svg:sprite", function() {
gulp.task("svg:sprite:icons", function() {
return gulp.src(paths.resources + "images/icons/*.svg")
.pipe(gulpRename({prefix: "icon-"}))
.pipe(svgSprite({mode:{symbol: {inline: true}}}))
.pipe(svgSprite({mode:{symbol: {inline: true, sprite: "icons.svg"}}}))
.pipe(gulp.dest(paths.output + "images/sprites/"));
});
gulp.task("svg:sprite:cursors", function() {
return gulp.src(paths.resources + "images/cursors/*.svg")
.pipe(gulpRename({prefix: "cursor-"}))
.pipe(svgSprite({mode:{symbol: {inline: true, sprite: "cursors.svg"}}}))
.pipe(gulp.dest(paths.output + "images/sprites/"));
});
@ -143,7 +150,7 @@ gulp.task("template:main", templatePipeline({
output: paths.output
}));
gulp.task("templates", gulp.series("svg:sprite", "template:main"));
gulp.task("templates", gulp.series("svg:sprite:icons", "svg:sprite:cursors", "template:main"));
gulp.task("polyfills", function() {
return gulp.src(paths.resources + "polyfills/*.js")

5
frontend/resources/styles/main/partials/workspace.scss
View file

@ -130,14 +130,11 @@
grid-template-columns: 20px 1fr;
.viewport {
cursor: var(--cursor);
grid-column: 1 / span 2;
grid-row: 1 / span 2;
overflow: hidden;
&.drawing {
cursor: cell;
}
rect.selection-rect {
fill: rgba(235, 215, 92, 0.1);
stroke: #000000;

3
frontend/resources/templates/index.mustache
View file

@ -23,7 +23,8 @@
</head>
<body>
{{>../public/images/sprites/symbol/svg/sprite.symbol.svg}}
{{>../public/images/sprites/symbol/icons.svg}}
{{>../public/images/sprites/symbol/cursors.svg}}
<section id="app" tabindex="1"></section>
<section id="modal"></section>
{{# manifest}}

8
frontend/src/app/main/ui/workspace/viewport.cljs
View file

@ -617,9 +617,12 @@
@alt? cur/duplicate
:else cur/pointer-inner)]
;; Chrome BUG: https://bugs.chromium.org/p/chromium/issues/detail?id=664066
;; Right now this is a performance concern but cannot find a better alternative
(when (not= @cursor new-cursor)
(timers/raf
#(reset! cursor new-cursor))))))
#(dom/set-css-property (dom/get-root) "--cursor" new-cursor))
(reset! cursor new-cursor)))))
(mf/use-layout-effect (mf/deps layout) on-resize)
(hooks/use-stream ms/keyboard-alt #(reset! alt? %))
@ -650,8 +653,7 @@
:view-box (format-viewbox vbox)
:ref viewport-ref
:class (when drawing-tool "drawing")
:style {:cursor @cursor
:background-color (get options :background "#E8E9EA")}
:style {:background-color (get options :background "#E8E9EA")}
:on-context-menu on-context-menu
:on-click on-click
:on-double-click on-double-click