Permalink
Browse files

Add some styling for task-panel and "running task" overlay icon.

  • Loading branch information...
1 parent 508dcc7 commit fd2f929ba663eb795d8eb40b07c0c9c0c07ee16c @cdujeu cdujeu committed May 19, 2016
@@ -20,7 +20,7 @@
to { -o-transform:rotate(360deg); }
}
-.rotating, .icon-spinner {
+.rotating, .icon-spinner, .mdi.mdi-radar{
-webkit-transform-origin: 50% 50%;
-webkit-animation-name: rotate;
-webkit-animation-duration: 1.0s;
@@ -47,6 +47,10 @@
display: block !important;
text-align: center;
}
+.mdi.mdi-radar{
+ display: inline-block;
+ text-align: center;
+}
.icon-spinner.spinner_large{
font-size: 22px;
@@ -0,0 +1,43 @@
+@pydio-task-panel-height: 60px;
+@pydio-task-panel-width: 356px;
+@pydio-task-panel-margin: 20px;
+
+div.pydio-tasks-panel{
+ position: absolute;
+ width: @pydio-task-panel-width;
+ height: @pydio-task-panel-height;
+ bottom: @pydio-task-panel-margin;
+ right: @pydio-task-panel-margin;
+ overflow-y: auto;
+ background-color: white;
+ box-shadow: @reactBoxShadowDepth1;
+ z-index: 20001;
+ transition: @bezier_transition;
+ &.invisible{
+ right: -@pydio-task-panel-width - 5px;
+ }
+ div.task{
+ padding: 10px;
+ border-bottom: 1px solid #f2f2f2;
+ display: flex;
+ flex-direction: row;
+ .task_texts{
+ flex: 5;
+ max-width: @pydio-task-panel-width - 42px;
+ div{
+ text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+ }
+ }
+ .task_actions{
+ cursor: pointer;
+ > span{
+ display: inline-block;
+ margin-top: 15px;
+ margin-right: 10px;
+ color: @teal-500;
+ }
+ }
+ }
+}
@@ -66,4 +66,8 @@
.mdi-close-circle-outline:before {
content: "\f250";
+}
+
+.mdi-radar:before {
+ content: "\f526";
}
@@ -3409,7 +3409,8 @@ span.first-bread em {
}
}
.rotating,
-.icon-spinner {
+.icon-spinner,
+.mdi.mdi-radar {
-webkit-transform-origin: 50% 50%;
-webkit-animation-name: rotate;
-webkit-animation-duration: 1.0s;
@@ -3435,6 +3436,10 @@ span.first-bread em {
display: block !important;
text-align: center;
}
+.mdi.mdi-radar {
+ display: inline-block;
+ text-align: center;
+}
.icon-spinner.spinner_large {
font-size: 22px;
}
@@ -4538,6 +4543,51 @@ div.menu.rootDirChooser span.rootDirTitle {
.left-panel.hidden {
left: -255px;
}
+div.pydio-tasks-panel {
+ position: absolute;
+ width: 356px;
+ height: 60px;
+ bottom: 20px;
+ right: 20px;
+ overflow-y: auto;
+ background-color: white;
+ box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
+ z-index: 20001;
+ transition: all 550ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
+}
+div.pydio-tasks-panel.invisible {
+ right: -361px;
+}
+div.pydio-tasks-panel div.task {
+ padding: 10px;
+ border-bottom: 1px solid #f2f2f2;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-flex-direction: row;
+ -ms-flex-direction: row;
+ flex-direction: row;
+}
+div.pydio-tasks-panel div.task .task_texts {
+ -webkit-flex: 5;
+ -ms-flex: 5;
+ flex: 5;
+ max-width: 314px;
+}
+div.pydio-tasks-panel div.task .task_texts div {
+ text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+}
+div.pydio-tasks-panel div.task .task_actions {
+ cursor: pointer;
+}
+div.pydio-tasks-panel div.task .task_actions > span {
+ display: inline-block;
+ margin-top: 15px;
+ margin-right: 10px;
+ color: #009688;
+}
/**********************/
/* MASTER VARIABLES
/**********************/
@@ -46,6 +46,7 @@
@import "components/menus";
@import "components/infopanel";
@import "components/leftpanel";
+@import "components/tasks";
@import "theme/variables";

0 comments on commit fd2f929

Please sign in to comment.