diff options
author | 2020-10-11 22:18:29 +0200 | |
---|---|---|
committer | 2020-10-11 22:18:29 +0200 | |
commit | 8210cf79abd110d388641f4878fed9da573e686d (patch) | |
tree | 5f320653e1874fd440db56e94c75146d93046d21 /cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs | |
parent | e7396afde23c4d335a097fa02bcae5f47a4ca6ed (diff) |
Add and modify style elements of Designer components
Issue-ID: CCSDK-2823
Issue-ID: CCSDK-2800
Issue-ID: CCSDK-2780
Signed-off-by: Sarah Abouzainah <sabouzainah.ext@orange.com>
Change-Id: I20612659baf227f4d2543b4fc1312a988eab144a
Diffstat (limited to 'cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs')
3 files changed, 11 insertions, 21 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/action.element.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/action.element.ts index 7960e83d1..b7a0ff9d5 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/action.element.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/action.element.ts @@ -15,8 +15,8 @@ declare module 'jointjs' { } } -const rectWidth = 616; -const rectHeight = 381; +const rectWidth = '100%'; +const rectHeight = '100%'; // custom element implementation // https://resources.jointjs.com/tutorials/joint/tutorials/custom-elements.html#markup const ActionElement = joint.shapes.standard.Rectangle.define(ActionElementTypeName, { @@ -40,18 +40,8 @@ const ActionElement = joint.shapes.standard.Rectangle.define(ActionElementTypeNa <g id="7.2-Designer---Insert-Action" transform="translate(-395.000000, -137.000000)"> <g id="workflow-container" transform="translate(401.000000, 137.000000)"> <g id="Card"> - <use fill="black" fill-opacity="1" filter="url(#filter-2)" xlink:href="#custom-action"></use> - <use stroke="#1273EB" stroke-width="1" fill="#FFFFFF" fill-rule="evenodd" xlink:href="#custom-action"></use> - </g> - <g id="name"> - <path d="M2,0 L85,0 C86.1045695,-2.02906125e-16 87, - 0.8954305 87,2 L87,30 L87,30 L0,30 L0, - 2 C-1.3527075e-16,0.8954305 0.8954305, - 2.02906125e-16 2,0 Z" id="Rectangle" - fill="#C3CDDB"></path> - <text id="Action-1" font-family="HelveticaNeue-Bold, Helvetica Neue" font-size="12" font-weight="bold" fill="#1B3E6F"> - <tspan id="label" x="20" y="20">Action 1</tspan> - </text> + <use fill="black" fill-opacity="0" filter="url(#filter-2)" xlink:href="#custom-action"></use> + <use fill-rule="evenodd" xlink:href="#custom-action"></use> </g> </g> </g> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/board.function.element.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/board.function.element.ts index 72019bfa0..7411eed49 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/board.function.element.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/board.function.element.ts @@ -28,9 +28,9 @@ const FunctionElement = joint.shapes.standard.Rectangle.define('board.FunctionEl <g id="func-board-element-conponent" transform="translate(30.000000, 70.000000)"> <g id="execute" transform="translate(304.000000, 0.000000)"> <g id="Group" transform="translate(7.000000, 0.000000)"> - <rect id="func-board-element-rectangle" fill="#1B3E6F" x="15" y="0" width="330" height="84" rx="2"></rect> - <g id="Group-4" transform="translate(20.000000, 20.000000)" fill="#FFFFFF"> - <g id="database0-copy" transform="translate(15.000000, 0.000000)" fill-rule="nonzero"> + <rect id="func-board-element-rectangle" fill="#1B3E6F" x="15" y="0" width="280" height="150" rx="3"></rect> + <g id="Group-4" transform="translate(20.000000, 25.000000)" fill="#FFFFFF"> + <g id="database0-copy" transform="translate(115.000000, 5.000000)" fill-rule="nonzero"> <path d="M35.544,6.00705882 C34.7265882, 2.97882353 28.6425882,0 18,0 C7.35741176, 0 1.27270588,2.97882353 0.456,6.00705882 C0.396705882, @@ -304,8 +304,8 @@ const FunctionElement = joint.shapes.standard.Rectangle.define('board.FunctionEl font-family="HelveticaNeue-Bold, Helvetica Neue" font-size="13" font-weight="bold" line-spacing="18"> - <tspan id="label" x="64" y="18">execute</tspan> - <tspan id="type" x="64" y="40" + <tspan id="label" x="20" y="70">execute</tspan> + <tspan id="type" x="30" y="92" font-family="HelveticaNeue, Helvetica Neue" font-size="12" font-weight="normal"></tspan> </text> diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/palette.function.element.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/palette.function.element.ts index 48a680982..25908b047 100644 --- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/palette.function.element.ts +++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/jointjs/elements/palette.function.element.ts @@ -20,7 +20,7 @@ declare module 'jointjs' { } const rectWidth = 260; -const rectHeight = 60; +const rectHeight = 50; // custom element implementation // https://resources.jointjs.com/tutorials/joint/tutorials/custom-elements.html#markup const FunctionElement = joint.shapes.standard.Rectangle.define('palette.FunctionElement', { @@ -45,7 +45,7 @@ const FunctionElement = joint.shapes.standard.Rectangle.define('palette.Function </defs> <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="7.1-Designer" transform="translate(-14.000000, -618.000000)"> - <g id="controller" transform="translate(0.000000, 60.000000)"> + <g id="controller" transform="translate(0.000000, 70.000000)"> <g id="functions" transform="translate(0.000000, 479.000000)"> <g id="list" transform="translate(8.000000, 51.000000)"> <g id="1" transform="translate(12.000000, 32.000000)"> |