evert
/
icydraw
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

placement arrow

This commit is contained in:
Evert Prants 2022-04-03 17:06:55 +03:00
parent 31cf1bf053
commit 243613aea1
Signed by: evert
GPG Key ID: 1688DA83D222D0B5
2 changed files with 6 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/client/canvas.ts
View File

@ -99,7 +99,7 @@ export class ViewCanvas {
this._updateURL(); this._updateURL();
if (this._zoom > 40) { if (this._zoom > 20) {
this._getPlacerAt(this._relcursorx, this._relcursory); this._getPlacerAt(this._relcursorx, this._relcursory);
} }
} }
@ -366,7 +366,7 @@ export class ViewCanvas {
private _showPlacerTag(placer: CanvasRecord): void { private _showPlacerTag(placer: CanvasRecord): void {
this._placerTag = $('<div class="canvas__cursor-placer">'); this._placerTag = $('<div class="canvas__cursor-placer">');
this._placerTag.innerText = placer.user; this._placerTag.innerText = placer.user;
this._placerTag.style.setProperty('--base-size', `${this._zoom / 1.5}px`); this._placerTag.style.setProperty('--base-size', `${this._zoom / 2}px`);
this._placerTag.style.setProperty('--base-scale', `${this._zoom / 100}`); this._placerTag.style.setProperty('--base-scale', `${this._zoom / 100}`);
this._cursor.append(this._placerTag); this._cursor.append(this._placerTag);
} }

7
src/client/scss/index.scss
View File

@ -63,12 +63,13 @@ body {
&-placer { &-placer {
position: relative; position: relative;
min-width: 100px; min-width: 100px;
background: ivory; background: white;
box-shadow: 0px 1px 8px #5e5e5e;
display: block; display: block;
margin: 0 auto; margin: 0 auto;
border-radius: 20px; border-radius: 20px;
text-align: center; text-align: center;
padding: 1rem; padding: 0.5rem;
transform-origin: top center; transform-origin: top center;
transform: translateY(calc(var(--base-size) * -1)) scale(var(--base-scale)); transform: translateY(calc(var(--base-size) * -1)) scale(var(--base-scale));
@ -76,7 +77,7 @@ body {
content: ""; content: "";
height: 16px; height: 16px;
width: 16px; width: 16px;
background: ivory; background: white;
margin: 0 auto; margin: 0 auto;
transform: rotate(45deg); transform: rotate(45deg);
position: absolute; position: absolute;