diff options
author | Lvbo163 <lv.bo163@zte.com.cn> | 2018-01-10 15:05:39 +0800 |
---|---|---|
committer | Lvbo163 <lv.bo163@zte.com.cn> | 2018-01-10 15:05:39 +0800 |
commit | 38dfd59a8b5d05266e5567f79dcf30fd10ef7c54 (patch) | |
tree | 043a724663d3324ce80cc546a241898e99796897 /sdc-workflow-designer-ui/src/app/app.component.css | |
parent | eb2d1c385e5c3d96e770b776f74ddbde9f2b133f (diff) |
split element by type
split elements by type in toolbar
Issue-ID: SDC-895
Change-Id: I0254c9c5f938df80942d60ffefe4b8577c788233
Signed-off-by: Lvbo163 <lv.bo163@zte.com.cn>
Diffstat (limited to 'sdc-workflow-designer-ui/src/app/app.component.css')
-rw-r--r-- | sdc-workflow-designer-ui/src/app/app.component.css | 73 |
1 files changed, 70 insertions, 3 deletions
diff --git a/sdc-workflow-designer-ui/src/app/app.component.css b/sdc-workflow-designer-ui/src/app/app.component.css index fdafa45c..95166937 100644 --- a/sdc-workflow-designer-ui/src/app/app.component.css +++ b/sdc-workflow-designer-ui/src/app/app.component.css @@ -9,19 +9,86 @@ * Contributors:
* ZTE - initial API and implementation and/or initial documentation
*/
- .main-content-wrapper{
+ .loading-div{
+ position: absolute;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ background-color: white;
+}
+
+.loading-div div{
+ position: relative;
+ top: calc(50% - 36px);
+ left: calc(50% - 36px);
+}
+
+.loading-div div:not(:required) {
+ -moz-animation: three-quarters-loader 1.5s infinite linear;
+ -webkit-animation: three-quarters-loader 1.5s infinite linear;
+ animation: three-quarters-loader 1.5s infinite linear;
+ box-sizing: border-box;
+ display: inline-block;
+ overflow: hidden;
+ text-indent: -9999px;
+ border: 5px solid #1dadfc;
+ border-right-color: transparent;
+ border-radius: 36px;
+ width: 72px;
+ height: 72px;
+}
+
+@-moz-keyframes three-quarters-loader {
+ 0% {
+ -moz-transform: rotate(0deg);
+ transform: rotate(0deg)
+ }
+ to {
+ -moz-transform: rotate(1turn);
+ transform: rotate(1turn)
+ }
+}
+
+@-webkit-keyframes three-quarters-loader {
+ 0% {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg)
+ }
+ to {
+ -webkit-transform: rotate(1turn);
+ transform: rotate(1turn)
+ }
+}
+
+@keyframes three-quarters-loader {
+ 0% {
+ -moz-transform: rotate(0deg);
+ -ms-transform: rotate(0deg);
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg)
+ }
+ to {
+ -moz-transform: rotate(1turn);
+ -ms-transform: rotate(1turn);
+ -webkit-transform: rotate(1turn);
+ transform: rotate(1turn)
+ }
+}
+
+.main-content-wrapper{
height: 100%;
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMTEgMTEiPjxkZWZzPjxzdHlsZT4uY2xzLTF7aXNvbGF0aW9uOmlzb2xhdGU7fS5jbHMtMntmaWxsOiNmYWZiZmQ7fS5jbHMtM3tmaWxsOiNlY2VkZWY7ZmlsbC1ydWxlOmV2ZW5vZGQ7fTwvc3R5bGU+PC9kZWZzPjx0aXRsZT5iYWNrZ3JvdW5kLWltYWdlc192MjwvdGl0bGU+PGc+PGltYWdlIHdpZHRoPSIxMSIgaGVpZ2h0PSIxMSIgeGxpbms6aHJlZj0iZGF0YTppbWFnZS9wbmc7YmFzZTY0LGlWQk9SdzBLR2dvQUFBQU5TVWhFVWdBQUFBc0FBQUFMQ0FJQUFBQW16dUJ4QUFBQUNYQklXWE1BQUFzU0FBQUxFZ0hTM1g3OEFBQUFFMGxFUVZRWVYyUDRUd2d3RUZJd3FvSmtGUUF3eFdtbDRtUGRyd0FBQUFCSlJVNUVya0pnZ2c9PSIvPjwvZz48ZyBpZD0i55+p5b2iXzEiIGRhdGEtbmFtZT0i55+p5b2iIDEiIGNsYXNzPSJjbHMtMSI+PGcgaWQ9IuefqeW9ol8xLTIiIGRhdGEtbmFtZT0i55+p5b2iIDEiPjxyZWN0IGNsYXNzPSJjbHMtMiIgd2lkdGg9IjExIiBoZWlnaHQ9IjExIi8+PC9nPjwvZz48ZyBjbGFzcz0iY2xzLTEiPjxnPjxwb2x5Z29uIGNsYXNzPSJjbHMtMyIgcG9pbnRzPSIxMCAwIDEwIDEwIDAgMTAgMCAxMSAxMCAxMSAxMC45MiAxMSAxMC45MiAwIDEwIDAiLz48L2c+PC9nPjwvc3ZnPg==);
background-size: 11px;
}
-.toolbar{
+.tool-bar{
position: fixed;
top: 0px;
left: 0px;
width: 200px;
height: 100%;
background-color: white;
+ overflow-y: auto;
}
.design-area{
@@ -32,7 +99,7 @@ padding: 20px;
}
-.design-menu{
+.design-menus{
display: block;
height: 30px;
margin-bottom: 10px;
|