definicao de layout

2026-02-06 14:37:54 +00:00
parent 872a5bb3ea
commit a4f80c85c2
2686 changed files with 640668 additions and 294 deletions
--- a/public/assets/scss/datatable-extension/_select-datatable.scss
+++ b/public/assets/scss/datatable-extension/_select-datatable.scss
@@ -0,0 +1,144 @@
+/*select datatable css*/
+// Row colour, when selected
+$table-selected: #B0BED9 !default;
+
+// Colour to use when shading
+$table-shade: black !default;
+
+@function shade( $color, $percent ) {
+  @return mix($table-shade, $color, $percent);
+}
+
+
+table.dataTable {
+  // Body styles
+  tbody > tr.selected,
+  tbody > tr > .selected {
+    background-color: $table-selected;
+  }
+
+
+  // Stripe classes - add "stripe" class to the table to activate
+  &.stripe tbody,
+  &.display tbody {
+    > tr.odd.selected,
+    > tr.odd > .selected {
+      background-color: shade($table-selected, 2.35%);
+    }
+  }
+
+
+  // Hover classes - add "hover" class to the table to activate
+  &.hover tbody,
+  &.display tbody {
+    > tr.selected:hover,
+    > tr > .selected:hover {
+      background-color: shade($table-selected, 3.6%);
+    }
+  }
+
+
+  // Sort column highlighting - add "order-column" class to the table to activate
+  &.order-column tbody,
+  &.display tbody {
+    > tr.selected > .sorting_1,
+    > tr.selected > .sorting_2,
+    > tr.selected > .sorting_3,
+    > tr > .selected {
+      background-color: shade($table-selected, 2%);
+    }
+  }
+
+  &.display tbody,
+  &.order-column.stripe tbody {
+    > tr.odd.selected {
+      >.sorting_1 { background-color: shade($table-selected, 5.4%); }
+      >.sorting_2 { background-color: shade($table-selected, 4.7%); }
+      >.sorting_3 { background-color: shade($table-selected, 3.9%); }
+    }
+
+    > tr.even.selected {
+      >.sorting_1 { background-color: shade($table-selected, 2%); }
+      >.sorting_2 { background-color: shade($table-selected, 1.2%); }
+      >.sorting_3 { background-color: shade($table-selected, 0.4%); }
+    }
+
+    > tr.odd > .selected { background-color: shade($table-selected, 5.4%); }
+    > tr.even > .selected { background-color: shade($table-selected, 2%); }
+  }
+
+  &.display tbody,
+  &.order-column.hover tbody {
+    > tr.selected:hover {
+      >.sorting_1 { background-color: shade($table-selected, 8.2%); }
+      >.sorting_2 { background-color: shade($table-selected, 7.5%); }
+      >.sorting_3 { background-color: shade($table-selected, 6.3%); }
+    }
+
+    > tr:hover > .selected,
+    > tr > .selected:hover {
+      background-color: shade($table-selected, 8.2%);
+    }
+  }
+
+  tbody td.select-checkbox,
+  tbody th.select-checkbox {
+    position: relative;
+
+    &:before,
+    &:after {
+      display: block;
+      position: absolute;
+      top: 1.2em; // Should be 50% but IE doesn't like it
+      left: 50%;
+      width: 12px;
+      height: 12px;
+      box-sizing: border-box;
+    }
+
+    &:before {
+      content: ' ';
+      margin-top: -6px;
+      margin-left: -6px;
+      border: 1px solid black;
+      border-radius: 3px;
+    }
+  }
+
+  tr.selected {
+    td.select-checkbox,
+    th.select-checkbox {
+      &:after {
+        content: '\2714';
+
+        margin-top: -11px;
+        margin-left: -4px;
+
+        text-align: center;
+        text-shadow:
+                1px 1px #B0BED9,
+                -1px -1px #B0BED9,
+                1px -1px #B0BED9,
+                -1px 1px #B0BED9;
+      }
+    }
+  }
+}
+
+div.dataTables_wrapper {
+  span.select-info,
+  span.select-item {
+    margin-left: 0.5em;
+  }
+}
+
+@media screen and (max-width: 640px) {
+  div.dataTables_wrapper {
+    span.select-info,
+    span.select-item {
+      margin-left: 0;
+      display: block;
+    }
+  }
+}
+/*select datatable css*/