Initial commit

api-wiaas/client/js/components/dashboards/dashboards.less

@@ -0,0 +1,313 @@
+@order-status-open-color: #045FB4;
+@order-status-in-progress-color: #FF8040;
+@order-status-production-color: #4CC417;
+@order-status-canceled-color: #F70D1A;
+@order-status-end-of-life-color: #800080;
+
+#dashboards {
+    position: relative;
+    margin-top: 1%;
+    margin-bottom: 3%;
+    padding-bottom: 1%;
+}
+
+#dashboards-layer {
+    .dashboard-name {
+        position: relative;
+        font-size: 200%;
+        padding: 1% 0;
+    }
+
+    .select-dashboard-layer {
+        z-index: 9999;
+        background: rgba(255, 255, 255, 0.8);
+        border: 1px solid #3bb9ff;
+        padding: 5px;
+    }
+
+    .select-dashboard-title {
+        text-align: center;
+    }
+
+    .select-dashboard-type{
+        text-align: center;
+        margin-top: 1%;
+    }
+
+    .dashboard-row {
+        cursor: pointer;
+        border-bottom: 1px solid #3bb9ff;
+        padding: 1%;
+        font-size: 60%;
+    }
+
+    .dashboard-row:hover {
+        background: rgba(59, 185, 255, 0.1);
+    }
+
+    .private {
+        color: #C11B17;
+    }
+
+    .public {
+        color: #2184be;
+    }
+
+    .visibility-icon {
+        float: right;
+        margin-right: 5px;
+    }
+
+    .dashborad-selected-name{
+        margin-right: 2%;
+    }
+
+    .dashborad-btn{
+        cursor: pointer;
+        font-size: 80%;
+    }
+
+    .edit-dashboard-btn {
+        .dashborad-btn;
+    }
+
+    .owner-btns a {
+        color: #000;
+        text-decoration: none;
+    }
+
+    .remove-dashborad-btn{
+        .dashborad-btn;
+    }
+
+    .select-dashboard-btn {
+        .dashborad-btn;
+    }
+
+    .confirm-name{
+        font-weight: bold;
+    }
+
+    .gadget {
+        padding: 3%;
+        background: rgba(255, 255, 255, 0.8);
+    }
+
+    .gadget-header {
+        font-weight: bold;
+        font-size: 120%;
+    }
+
+    .gadget-row {
+        padding: 10px 0;
+        border-bottom: 1px solid #3bb9ff;
+    }
+
+    .gadget-row-column {
+        display: inline-block;
+    }
+
+    .gadget-row-column a {
+        cursor: pointer;
+    }
+
+    .order-status {
+        font-size: 110%;
+        font-weight: bold;
+    }
+
+    .order-status-open {
+        .order-status;
+        color: @order-status-open-color;
+    }
+
+    .order-status-no-process {
+        .order-status;
+        color: @order-status-open-color;
+    }
+
+    .order-status-in-progress {
+        .order-status;
+        color: @order-status-in-progress-color;
+    }
+
+    .order-status-production {
+        .order-status;
+        color: @order-status-production-color;
+    }
+
+    .order-status-canceled {
+        .order-status;
+        color: @order-status-canceled-color;
+    }
+
+    .order-status-processing {
+        .order-status;
+        color: @order-status-in-progress-color;
+    }
+
+    .order-status-end-of-life {
+        .order-status;
+        color: @order-status-end-of-life-color;
+    }
+
+    .fitler-layer {
+        border-top: 1px solid #3bb9ff;
+        border-bottom: 1px solid #3bb9ff;
+        padding: 1% 0;
+    }
+
+    .filter-title {
+        font-weight: bold;
+    }
+
+    .filter-logic {
+        padding: 1% 0;
+    }
+
+    .filter-apply {
+        margin-top: 1%;
+    }
+
+    .filter-clear {
+        margin-top: 1%;
+        margin-left: 2%;
+    }
+
+    .filter-value,
+    .sort-icon {
+        cursor: pointer;
+        margin-left: 5%;
+        color: #045FB4;
+    }
+
+    .is-fitlered{
+        font-size: 80%;
+    }
+
+    .action-status{
+        font-weight: bold;
+    }
+
+    .invalid {
+        color: #d58512;
+    }
+
+    .pending {
+        color: #800080;
+    }
+
+    .not-accepted {
+        color: #800080;
+    }
+
+    .in-progress {
+        color: #FF8040;
+    }
+}
+
+#create-dashboard-container {
+    .dashborad-input {
+        font-size: 130%;
+    }
+
+    .user-type-select-layer {
+        font-size: 130%;
+
+    }
+
+    .user-type-select {
+        padding: 5px 0;
+    }
+
+    .create-dashboard-label {
+        font-weight: bold;
+        display: inline-block;
+    }
+
+    .gadget {
+        position: relative;
+        margin-top: 1%;
+        padding: 3%;
+        background: rgba(255, 255, 255, 0.8);
+        text-align: center;
+        height: 25em;
+    }
+
+    .add-gadget {
+        color: #000;
+        margin-top: 3em;
+        font-size: 200%;
+        padding: 2em 0;
+    }
+
+    .add-gadget:hover {
+        color: #204d74;
+        border: 5px dashed #204d74;
+        cursor: pointer;
+    }
+
+    .drag-gadget {
+        color: #000;
+        margin-top: 3em;
+        font-size: 200%;
+        padding: 2em 0;
+    }
+
+    .drop-zone {
+        background: #FFF;
+        color: #000;
+        margin-top: 3em;
+        font-size: 200%;
+        padding: 2em 0;
+        border: 5px dashed #5cb85c;
+        display: none;
+        position: absolute;
+        z-index: 1000;
+        width: 90%;
+    }
+
+    .drag-gadget:hover {
+        color: #204d74;
+        border: 5px dashed #204d74;
+        cursor: move;
+    }
+
+    .remove-gadget {
+        margin-top: 1%;
+        position: relative;
+        float: right;
+    }
+
+    .create-box {
+        margin: 1em 0;
+    }
+
+    .visibility-layer {
+        display: inline-block;
+        font-size: 130%;
+        margin-left: 1%;
+    }
+
+    .visibility-icon {
+        cursor: pointer;
+    }
+
+    .visibility-message {
+        display: none;
+    }
+
+    .visibility-layer:hover .visibility-message {
+        display: inline-block;
+        font-weight: bold;
+        cursor: pointer;
+    }
+
+    .private {
+        color: #C11B17;
+    }
+
+    .public {
+        color: #2184be;
+    }
+}