diff --git a/src/lib/dsl-editor/dsl-editor.component.css b/src/lib/dsl-editor/dsl-editor.component.scss similarity index 100% rename from src/lib/dsl-editor/dsl-editor.component.css rename to src/lib/dsl-editor/dsl-editor.component.scss diff --git a/src/lib/dsl-editor/dsl-editor.component.ts b/src/lib/dsl-editor/dsl-editor.component.ts index c869695..0bfc40f 100644 --- a/src/lib/dsl-editor/dsl-editor.component.ts +++ b/src/lib/dsl-editor/dsl-editor.component.ts @@ -18,7 +18,7 @@ import 'codemirror/addon/scroll/simplescrollbars'; './../../../node_modules/codemirror/lib/codemirror.css', './../../../node_modules/codemirror/addon/hint/show-hint.css', './../../../node_modules/codemirror/addon/lint/lint.css', - './dsl-editor.component.css', ], + './dsl-editor.component.scss', ], encapsulation: ViewEncapsulation.None }) export class DslEditorComponent implements OnInit, OnDestroy { diff --git a/src/lib/shared/flo.css b/src/lib/editor/editor.component.scss similarity index 57% rename from src/lib/shared/flo.css rename to src/lib/editor/editor.component.scss index 39f4ae0..97ab0e7 100644 --- a/src/lib/shared/flo.css +++ b/src/lib/editor/editor.component.scss @@ -57,60 +57,6 @@ flo-view { color: #FFF; } -/* Joint JS paper for drawing palette -> canvas DnD visual feedback START */ - -#palette-floater { - /* TODO size relative to paper that goes on it? */ - opacity: 0.75; - width:170px; - height:60px; - background-color: transparent; - /* - background-color: #6db33f; - */ - float:left; - position: absolute; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -o-user-select: none; - user-select: none; -} - -#palette-floater.joint-paper > svg { - background-color: transparent; -} - -/* Joint JS paper for drawing palette -> canvas DnD visual feedback END */ - -/* Palette START */ - -.palette-filter { - border: 3px solid #6db33f; -} - -.palette-filter-textfield { - width: 100%; - font-size:24px; - /* border: 3px solid #6db33f; - */ font-family: "Varela Round",sans-serif; - /* padding: 2px; */ -} - -.palette-paper { - background-color: #eeeeee; - /* - border-right: 7px solid; - */ - border-color: #6db33f; - /* width: 170px; - height:100%; - float: left; - */ -} - -/* Palette END */ - /* Tooltip START */ .node-tooltip .tooltip-description { @@ -159,109 +105,6 @@ flo-view { /* Tooltip END */ -/* Properties DIV Start */ - -.properties td { - border-top: 1px solid #34302d; -} - -.properties { - /* opacity: 0.5; */ - border: 8px #eeeeee; - /* border-radius: 2px;*/ - /* border: 2px solid; - */ border-color: #6db33f; - margin-top: 3px; - background-color: #eeeeee; - /* height: 115px; - */ font-family: monospace; - z-index: 2; - /* padding-top:1px; */ - position: absolute; - /* left: 850px; - top: 386px; - width:360px; - height:0px; - overflow-y:auto; - */} -.properties-node-name { - - width: 100%; - /* background-color: #eeeeee; */ - background: #34302d; - color: #ffffff; - padding-left:2px; - border:0px; - font-size: 18px; - font-family: "Varela Round",sans-serif; - font-weight: bold; -} -.properties-node-name-row { - /* - background: #34302d; - color: #ffffff; - */background: #34302d; - width: 100%; - padding-left:2px; -} - -.properties-row-even { - width: 100%; - border-top: 1px #34302d; - background-color: #ffffff; -} - - -.properties-row-odd { - width: 100%; - border-top: 1px #34302d; - background-color: #eeeeee; -} - -.properties-row-text-even { - background-color: #ffffff; - border-left:0px; - border-right:0px; - border-bottom:0px; - border-top:1px #34302d; -} - -.properties-row-text-odd { - background-color: #eeeeee; - border-left:0px; - border-right:0px; - border-bottom:0px; - border-top:1px #34302d; -} - -.properties-input { - width: 100%; - font-size: 18px; - font-family: "Varela Round",sans-serif; -} - -.properties-key { - width: 30%; - padding-left:2px; - padding-right:4px; -} - -.properties-value { - width: 70%; - padding-left:2px; - padding-right:2px; -} - -.properties-table { - border: 1px solid #d1d1d1; - padding: 3px; -} - -.properties-new-property { - color: #888888; -} - -/* Properties DIV END */ /* Validation Error Marker on Canvas START */ @@ -382,5 +225,4 @@ flo-view { fill: transparent; } - /* END - FLO CANVAS STYLES */ diff --git a/src/lib/editor/editor.component.ts b/src/lib/editor/editor.component.ts index 267d7de..7164bbc 100644 --- a/src/lib/editor/editor.component.ts +++ b/src/lib/editor/editor.component.ts @@ -19,7 +19,7 @@ export interface VisibilityState { @Component({ selector: 'flo-editor', templateUrl: './editor.component.html', - styleUrls: ['./../../../node_modules/jointjs/dist/joint.css', './../shared/flo.css'], + styleUrls: ['./../../../node_modules/jointjs/dist/joint.css', './editor.component.scss'], encapsulation: ViewEncapsulation.None }) export class EditorComponent implements OnInit, OnDestroy { diff --git a/src/lib/palette/palette.component.scss b/src/lib/palette/palette.component.scss new file mode 100644 index 0000000..89a4a6e --- /dev/null +++ b/src/lib/palette/palette.component.scss @@ -0,0 +1,53 @@ +/* Joint JS paper for drawing palette -> canvas DnD visual feedback START */ + +#palette-floater { + /* TODO size relative to paper that goes on it? */ + opacity: 0.75; + width:170px; + height:60px; + background-color: transparent; + /* + background-color: #6db33f; + */ + float:left; + position: absolute; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -o-user-select: none; + user-select: none; +} + +#palette-floater.joint-paper > svg { + background-color: transparent; +} + +/* Joint JS paper for drawing palette -> canvas DnD visual feedback END */ + +/* Palette START */ + +.palette-filter { + border: 3px solid #6db33f; +} + +.palette-filter-textfield { + width: 100%; + font-size:24px; + /* border: 3px solid #6db33f; + */ font-family: "Varela Round",sans-serif; + /* padding: 2px; */ +} + +.palette-paper { + background-color: #eeeeee; + /* + border-right: 7px solid; + */ + border-color: #6db33f; + /* width: 170px; + height:100%; + float: left; + */ +} + +/* Palette END */ diff --git a/src/lib/palette/palette.component.ts b/src/lib/palette/palette.component.ts index 9b2e05d..d3d7165 100644 --- a/src/lib/palette/palette.component.ts +++ b/src/lib/palette/palette.component.ts @@ -38,7 +38,7 @@ joint.shapes.flo.PaletteGroupHeader = joint.shapes.basic.Generic.extend({ @Component({ selector: 'flo-palette', templateUrl: './palette.component.html', - styleUrls: ['./../shared/flo.css'], + styleUrls: ['./palette.component.scss'], encapsulation: ViewEncapsulation.None }) export class Palette implements OnInit, OnDestroy, OnChanges {