smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Styles improvements

Browse source
This commit is contained in:
Paulo Menezes 2020-01-05 22:08:57 -03:00
parent feefb14bf5
commit 328be041a2
1 changed files with 14 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/index.tsx
View file

@ -842,25 +842,19 @@ function generateDraw(element: ExcalidrawElement) {
};
} else if (element.type === "arrow") {
const [x1, y1, x2, y2, x3, y3, x4, y4] = getArrowPoints(element);
const options = {
stroke: element.strokeColor,
strokeWidth: element.strokeWidth,
roughness: element.roughness
};
const shapes = withCustomMathRandom(element.seed, () => [
// \
generator.line(x3, y3, x2, y2, {
stroke: element.strokeColor,
strokeWidth: element.strokeWidth,
roughness: element.roughness
}),
generator.line(x3, y3, x2, y2, options),
// -----
generator.line(x1, y1, x2, y2, {
stroke: element.strokeColor,
strokeWidth: element.strokeWidth,
roughness: element.roughness
}),
generator.line(x1, y1, x2, y2, options),
// /
generator.line(x4, y4, x2, y2, {
stroke: element.strokeColor,
strokeWidth: element.strokeWidth,
roughness: element.roughness
})
generator.line(x4, y4, x2, y2, options)
]);
element.draw = (rc, context, { scrollX, scrollY }) => {
@ -1106,7 +1100,7 @@ function getSelectedIndices() {
const someElementIsSelected = () =>
elements.some(element => element.isSelected);
const someElementIsSelectedIsRectangleOrEllipseOrDiamond = () =>
const hasBackground = () =>
elements.some(
element =>
element.isSelected &&
@ -1115,7 +1109,7 @@ const someElementIsSelectedIsRectangleOrEllipseOrDiamond = () =>
element.type === "diamond")
);
const someElementIsSelectedIsRectangleOrEllipseOrDiamondOrArrow = () =>
const hasStroke = () =>
elements.some(
element =>
element.isSelected &&
@ -1658,7 +1652,7 @@ class App extends React.Component<{}, AppState> {
</div>
</div>
{someElementIsSelectedIsRectangleOrEllipseOrDiamond() && (
{hasBackground() && (
<div className="panelColumn">
<h5>Shape Background Color</h5>
<div>
@ -1712,11 +1706,10 @@ class App extends React.Component<{}, AppState> {
)}
</>
{someElementIsSelectedIsRectangleOrEllipseOrDiamond() && (
{hasBackground() && (
<>
<h4>Fill</h4>
<div className="panelColumn">
{/* <select onChange={this.changeFillStyle} value={getSelectedFillStyles()}> */}
<button
onClick={() => this.changeFillStyle("hachure")}
className={
@ -1785,12 +1778,11 @@ class App extends React.Component<{}, AppState> {
>
Zigzag-line
</button>
{/* </select> */}
</div>
</>
)}
{someElementIsSelectedIsRectangleOrEllipseOrDiamondOrArrow() && (
{hasStroke() && (
<>
<h4>Stroke width</h4>
<div className="panelColumn">