kopia lustrzana https://github.com/Tldraw/Tldraw
Merge remote-tracking branch 'origin/stickies-rc' into lu/sticky-surface
Lu[ke] Wilson
commit
4fcfeb0547
|
|
@ -1,3 +1,4 @@
|
|||
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M23.8539 0.315423C24.2744 -0.105141 24.9563 -0.105141 25.3769 0.315423L29.6846 4.62312C30.1051 5.04368 30.1051 5.72555 29.6846 6.14612L21.1928 14.6379C21.0291 14.8016 20.84 14.9379 20.633 15.0414L12.1739 19.2709C11.7593 19.4782 11.2585 19.397 10.9308 19.0692C10.603 18.7414 10.5217 18.2407 10.729 17.8261L14.9586 9.367C15.0621 9.15995 15.1984 8.97093 15.362 8.80723L23.8539 0.315423ZM24.6154 2.59992L16.8851 10.3302L14.6488 14.8027L15.1973 15.3511L19.6697 13.1149L27.4001 5.38462L24.6154 2.59992ZM19.2308 2.15384L17.0769 4.30769H8.24617C7.32369 4.30769 6.69661 4.30853 6.2119 4.34813C5.73976 4.38671 5.4983 4.45663 5.32987 4.54245C4.9246 4.74894 4.5951 5.07844 4.38861 5.48371C4.30279 5.65214 4.23287 5.89359 4.19429 6.36573C4.15469 6.85044 4.15385 7.47753 4.15385 8.4V21.7538C4.15385 22.6763 4.15469 23.3034 4.19429 23.7881C4.23287 24.2603 4.30279 24.5017 4.38861 24.6701C4.5951 25.0754 4.9246 25.4049 5.32987 25.6114C5.4983 25.6972 5.73976 25.7671 6.2119 25.8057C6.69661 25.8453 7.32369 25.8462 8.24617 25.8462H21.6C22.5225 25.8462 23.1496 25.8453 23.6343 25.8057C24.1064 25.7671 24.3479 25.6972 24.5163 25.6114C24.9216 25.4049 25.2511 25.0754 25.4576 24.6701C25.5434 24.5017 25.6133 24.2603 25.6519 23.7881C25.6915 23.3034 25.6923 22.6763 25.6923 21.7538V12.923L27.8462 10.7692V21.7538V21.7983C27.8462 22.6652 27.8462 23.3807 27.7986 23.9635C27.7491 24.5688 27.643 25.1253 27.3767 25.648C26.9637 26.4585 26.3047 27.1175 25.4941 27.5305C24.9715 27.7968 24.415 27.9029 23.8097 27.9524C23.2269 28 22.5114 28 21.6445 28H21.6H8.24617H8.20166C7.33478 28 6.61932 28 6.0365 27.9524C5.43117 27.9029 4.87472 27.7968 4.35205 27.5305C3.5415 27.1175 2.88251 26.4585 2.46951 25.648C2.2032 25.1253 2.09705 24.5688 2.0476 23.9635C1.99998 23.3807 1.99999 22.6652 2 21.7984V21.7983V21.7538V8.4V8.35552V8.35546V8.35545C1.99999 7.48859 1.99998 6.77315 2.0476 6.19034C2.09705 5.585 2.2032 5.02855 2.46951 4.50589C2.88251 3.69534 3.5415 3.03635 4.35205 2.62336C4.87472 2.35704 5.43117 2.2509 6.0365 2.20144C6.61932 2.15382 7.33476 2.15383 8.20163 2.15384H8.20169H8.24617H19.2308Z" fill="black"/>
|
||||
<path d="M17 27V19C17 17.8954 17.8954 17 19 17H27" stroke="black" stroke-width="2"/>
|
||||
<path d="M17.5789 26.45L26.3775 18.0914C26.775 17.7138 27 17.1896 27 16.6414V5C27 3.89543 26.1046 3 25 3H5C3.89543 3 3 3.89543 3 5V25C3 26.1046 3.89543 27 5 27H16.2014C16.7141 27 17.2072 26.8031 17.5789 26.45Z" stroke="black" stroke-width="2"/>
|
||||
</svg>
|
||||
|
|
|
|||
|
Przed Szerokość: | Wysokość: | Rozmiar: 2.2 KiB Po Szerokość: | Wysokość: | Rozmiar: 433 B |
|
|
@ -1195,18 +1195,27 @@ input,
|
|||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: var(--radius-2);
|
||||
box-shadow: var(--shadow-1);
|
||||
border-radius: 1px;
|
||||
overflow: hidden;
|
||||
border-color: currentColor;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
box-shadow: 0px 4px 8px -2px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.tl-note__container .tl-text-label {
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.tl-note__shadow {
|
||||
background-color: none;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: 4px;
|
||||
left: 0px;
|
||||
transform-origin: bottom center;
|
||||
box-shadow:
|
||||
0 0 32px 0px rgba(0, 0, 0, 0.4),
|
||||
0 0 24px 0px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.tl-note__scrim {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
|
|
@ -1214,7 +1223,7 @@ input,
|
|||
height: 100%;
|
||||
width: 100%;
|
||||
background-color: var(--color-background);
|
||||
opacity: 0.28;
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
.tl-loading {
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ import {
|
|||
getDefaultColorTheme,
|
||||
noteShapeMigrations,
|
||||
noteShapeProps,
|
||||
rng,
|
||||
toDomPrecision,
|
||||
} from '@tldraw/editor'
|
||||
import { HyperlinkButton } from '../shared/HyperlinkButton'
|
||||
|
|
@ -93,18 +94,33 @@ export class NoteShapeUtil extends ShapeUtil<TLNoteShape> {
|
|||
const theme = useDefaultColorTheme()
|
||||
const adjustedColor = color === 'black' ? 'yellow' : color
|
||||
|
||||
const noteHeight = this.getHeight(shape)
|
||||
const shadowHeight = Math.max(this.getHeight(shape) * 0.618, 200)
|
||||
const ratio = noteHeight / shadowHeight
|
||||
const random = rng(shape.id)
|
||||
const noteRotation = random() * 4
|
||||
|
||||
return (
|
||||
<>
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
width: NOTE_SIZE,
|
||||
height: this.getHeight(shape),
|
||||
height: noteHeight,
|
||||
}}
|
||||
>
|
||||
<div
|
||||
className="tl-note__shadow"
|
||||
style={{
|
||||
height: shadowHeight,
|
||||
transform: `perspective(300px) rotateZ(${noteRotation}deg) rotateX(30deg) translateY(${-Math.abs(noteRotation)}px) scaleX(${0.85}) scaleY(${ratio})`,
|
||||
}}
|
||||
/>
|
||||
|
||||
<div
|
||||
className="tl-note__container"
|
||||
style={{
|
||||
opacity: 1,
|
||||
color: theme[adjustedColor].solid,
|
||||
backgroundColor: theme[adjustedColor].solid,
|
||||
}}
|
||||
|
|
@ -133,7 +149,7 @@ export class NoteShapeUtil extends ShapeUtil<TLNoteShape> {
|
|||
indicator(shape: TLNoteShape) {
|
||||
return (
|
||||
<rect
|
||||
rx="6"
|
||||
rx="1"
|
||||
width={toDomPrecision(NOTE_SIZE)}
|
||||
height={toDomPrecision(this.getHeight(shape))}
|
||||
/>
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue