comparison js/Editor-1.5.6/css/scss/datatable.scss @ 2:a64ece32a01a draft default tip

"planemo upload for repository https://github.com/ImmPortDB/immport-galaxy-tools/tree/master/flowtools/cs_overview commit a46097db0b6056e1125237393eb6974cfd51eb41"
author azomics
date Tue, 28 Jul 2020 08:32:36 -0400
parents
children
comparison
equal deleted inserted replaced
1:bca68066a957 2:a64ece32a01a
1
2 // Row highlighting on edit styles
3 //
4 // To change the colour of the highlight, simply modify the variable below and
5 // recompile the SCSS stylesheet (if you don't have SASS installed, you can use
6 // the online service at http://sassmeister.com/ .
7 //
8 // The DataTables styles below match the default DataTables stylesheet:
9 // http://next.datatables.net/manual/styling/classes so you can retain the full
10 // benefits of the DataTables styling options.
11
12 $table-row-highlight: #FFFBCC;
13
14 table.dataTable {
15 tbody {
16 tr.highlight {
17 background-color: $table-row-highlight !important;
18 }
19
20 tr.highlight,
21 tr.noHighlight,
22 tr.highlight td,
23 tr.noHighlight td {
24 @include background-transision();
25 }
26 }
27
28 &.stripe tbody,
29 &.display tbody {
30 tr.odd {
31 &.highlight {
32 background-color: shade($table-row-highlight, 2.35%);
33 }
34 }
35 }
36
37 // Hover classes - add "hover" class to the table to activate
38 &.hover tbody,
39 &.display tbody {
40 tr:hover,
41 tr.odd:hover,
42 tr.even:hover {
43 &.highlight {
44 background-color: shade($table-row-highlight, 3.6%);
45 }
46 }
47 }
48
49
50 // Sort column highlighting - add "hover" class to the table to activate
51 &.order-column,
52 &.display {
53 tbody {
54 tr.highlight>.sorting_1,
55 tr.highlight>.sorting_2,
56 tr.highlight>.sorting_3 {
57 background-color: shade($table-row-highlight, 2%);
58 }
59 }
60 }
61
62 &.display tbody,
63 &.order-column.stripe tbody {
64 tr.odd {
65 &.highlight {
66 >.sorting_1 { background-color: shade($table-row-highlight, 5.4%);}
67 >.sorting_2 { background-color: shade($table-row-highlight, 4.7%);}
68 >.sorting_3 { background-color: shade($table-row-highlight, 3.9%);}
69 }
70 }
71
72 tr.even {
73 &.highlight {
74 >.sorting_1 { background-color: shade($table-row-highlight, 2%); }
75 >.sorting_2 { background-color: shade($table-row-highlight, 1.2%); }
76 >.sorting_3 { background-color: shade($table-row-highlight, 0.4%); }
77 }
78 }
79 }
80
81 &.display tbody,
82 &.order-column.hover tbody {
83 tr:hover,
84 tr.odd:hover,
85 tr.even:hover {
86 &.highlight {
87 >.sorting_1 { background-color: shade($table-row-highlight, 8.2%); }
88 >.sorting_2 { background-color: shade($table-row-highlight, 7.5%); }
89 >.sorting_3 { background-color: shade($table-row-highlight, 6.3%); }
90 }
91 }
92 }
93 }