Improved night mode.

Ylian Saint-Hilaire committed Apr 15, 2020 at 01:51 UTC 37236021d73a4eb537e7312638879165b33ff2ed
5 files changed +69 -18
package.json
+1 -1
@@ -1,6 +1,6 @@
1 {
2 "name": "meshcentral",
3 - "version": "0.5.1-t",
3 + "version": "0.5.1-u",
4 "keywords": [
5 "Remote Management",
6 "Intel AMT",
public/images/icon-relay - Copy.png
Binary files /dev/null and b/public/images/icon-relay - Copy.png differ
public/images/icon-relay.png
Binary files a/public/images/icon-relay.png and b/public/images/icon-relay.png differ
public/styles/style.css
+59 -11
@@ -889,11 +889,19 @@ NoMeshesPanel img {
889 padding: 4px;
890 }
891
892 +.night #p5filehead {
893 + background-color: #333;
894 +}
895 +
896 #p5filesubhead {
897 background-color: #E4E9E7;
898 height: 28px;
899 }
900
901 +.night #p5filesubhead {
902 + background-color: #222;
903 +}
904 +
905 #p5rightOfButtons {
906 float: right;
907 margin-top: 3px;
@@ -1525,10 +1533,20 @@ a {
1533
1534 .style10 {
1535 background-color: #C9C9C9;
1536 + color: #000;
1537 }
1538
1539 .night .style10 {
1531 - color: #333;
1540 + background-color: #333;
1541 + color: #CCC;
1542 +}
1543 +
1544 +.style10s {
1545 + background-color: #b9b9b9;
1546 +}
1547 +
1548 +.night .style10s {
1549 + background-color: #444;
1550 }
1551
1552 .style11 {
@@ -1542,7 +1560,13 @@ a {
1560 background-color: #D3D9D6;
1561 }
1562
1563 +.night .style14 {
1564 + background-color: #333;
1565 + color: #CCC;
1566 +}
1567 +
1568 .auto-style1 {
1569 + background-color: #D3D9D6;
1570 text-align: right;
1571 }
1572
@@ -1552,7 +1576,8 @@ a {
1576 }
1577
1578 .night .auto-style1 {
1555 - color: black;
1579 + background-color: #333;
1580 + color: #CCC;
1581 }
1582
1583 .night #pTable {
@@ -1665,7 +1690,7 @@ a {
1690 }
1691
1692 .night .g1 {
1668 - background-image: linear-gradient(to right, #000 0%, #c9c9c9 100%);
1693 + background-image: linear-gradient(to right, #000 0%, #333 100%);
1694 }
1695
1696 #p3events .g1 {
@@ -1690,7 +1715,7 @@ a {
1715 }
1716
1717 .night .g1s {
1693 - background-image: linear-gradient(to right, #000 0%, #b9b9b9 100%);
1718 + background-image: linear-gradient(to right, #000 0%, #444 100%);
1719 }
1720
1721 .g2 {
@@ -1708,7 +1733,7 @@ a {
1733 }
1734
1735 .night .g2 {
1711 - background-image: linear-gradient(to right, #c9c9c9 0%, #000 100%);
1736 + background-image: linear-gradient(to right, #333 0%, #000 100%);
1737 }
1738
1739 #p3events .g2 {
@@ -1733,7 +1758,7 @@ a {
1758 }
1759
1760 .night .g2s {
1736 - background-image: linear-gradient(to right, #b9b9b9 0%, #000 100%);
1761 + background-image: linear-gradient(to right, #444 0%, #000 100%);
1762 }
1763
1764 .h1pre {
@@ -1762,7 +1787,7 @@ a {
1787 }
1788
1789 .night .h1 {
1765 - background-image: linear-gradient(to right, #000 0%, #d3d9d6 100%);
1790 + background-image: linear-gradient(to right, #000 0%, #333 100%);
1791 }
1792
1793 .h2end {
@@ -1786,7 +1811,7 @@ a {
1811 }
1812
1813 .night .h2 {
1789 - background-image: linear-gradient(to right, #d3d9d6 0%, #000 100%);
1814 + background-image: linear-gradient(to right, #333 0%, #000 100%);
1815 }
1816
1817 .e1 {
@@ -1806,13 +1831,18 @@ a {
1831 }
1832
1833 .night .e2 {
1809 - color: black;
1834 + color: #CCC;
1835 + background-color: #333;
1836 }
1837
1838 .e2s {
1839 background-color: #b9b9b9;
1840 }
1841
1842 +.night .e2s {
1843 + background-color: #444;
1844 +}
1845 +
1846 .bar {
1847 font-size: large;
1848 background-color: #C9C9C9;
@@ -1822,9 +1852,17 @@ a {
1852 }
1853
1854 .night .bar {
1825 - color: black;
1855 + color: #CCC;
1856 + background-color: #333;
1857 +}
1858 +
1859 +.sbar {
1860 + background-color: #b9b9b9;
1861 }
1862
1863 +.night .sbar {
1864 + background-color: #444;
1865 +}
1866
1867 #p3users .bar {
1868 width: 100%;
@@ -1865,6 +1903,11 @@ a {
1903 color: black;
1904 }
1905
1906 +.night .bar18 {
1907 + background-color: #333;
1908 + color: #CCC;
1909 +}
1910 +
1911 .bar182 {
1912 font-size: large;
1913 height: 18px;
@@ -2261,7 +2304,8 @@ a {
2304 }
2305
2306 .night .serverStateTableCell {
2264 - color: black;
2307 + background-color: #333;
2308 + color: #CCC;
2309 }
2310
2311 .userTableHeader {
@@ -2647,6 +2691,10 @@ a {
2691 background-color: #DDD;
2692 }
2693
2694 +.night .traceEvent {
2695 + background-color: #222;
2696 +}
2697 +
2698 .p42tblRow {
2699 height: 36px;
2700 max-height: 40px;
views/default.handlebars
+9 -6
@@ -3065,7 +3065,7 @@
3065 r += '<div class=deviceBarCheckbox><input class="' + node.meshid + ' DeviceCheckbox" onclick=p1updateInfo() value=devid_' + node._id + ' type=checkbox></div>';
3066 r += '<div class=deviceBarIcon onclick=gotoDevice(\'' + node._id + '\',null,null,event)><div class=\"j' + icon + '\" style=width:16px;margin-top:1px;margin-left:2px;height:16px></div></div>';
3067 r += '<div class=g1 style=height:18px;float:left></div><div class=g2 style=height:18px;float:right></div>';
3068 - r += '<div style=cursor:pointer;font-size:14px title="' + title + '" onclick=gotoDevice(\'' + node._id + '\',null,null,event)><span style=width:300px>' + name + '</span></div></div></td>';
3068 + r += '<div class=style10 style=cursor:pointer;font-size:14px title="' + title + '" onclick=gotoDevice(\'' + node._id + '\',null,null,event)><span style=width:300px>' + name + '</span></div></div></td>';
3069 r += '<td style=text-align:center>' + getUserShortStr(node);
3070 r += '<td style=text-align:center>' + (node.ip != null ? node.ip : '');
3071 r += '<td style=text-align:center>' + states.join('&nbsp;+&nbsp;');
@@ -7526,7 +7526,7 @@
7526 x += '<table style=width:100%>';
7527 for (var i in network.netif) {
7528 var m = network.netif[i];
7529 - x += '<tr><td><div style=color:black;background-color:lightgray;border-radius:5px;padding:8px>';
7529 + x += '<tr><td><div class=style10 style=border-radius:5px;padding:8px>';
7530 x += '<div style=margin-bottom:3px><b>' + EscapeHtml(m.name + (m.dnssuffix?(', ' + m.dnssuffix):'')) + '</b></div>';
7531 if (m.desc) { x += addDetailItem("Description", EscapeHtml(m.desc).split('(R)').join('&reg;')); }
7532 //if (m.dnssuffix) { x += addDetailItem("DNS Suffix", m.dnssuffix); }
@@ -7591,7 +7591,7 @@
7591 for (var i in hardware.windows.memory) {
7592 var m = hardware.windows.memory[i];
7593 x += '<tr>';//<td VALIGN=Top style=width:38px><img src="images/ram2.png" />'
7594 - x += '<td><div style=color:black;background-color:lightgray;border-radius:5px;padding:8px>';
7594 + x += '<td><div class=style10 style=border-radius:5px;padding:8px>';
7595 x += '<div style=margin-bottom:3px><b>' + EscapeHtml(m.BankLabel) + '</b></div>';
7596 if (m.Capacity) { x += addDetailItem("Capacity / Speed", format("{0} Mb, {1} Mhz", (m.Capacity / 1024 / 1024), m.Speed), s); }
7597 if (m.PartNumber) { x += addDetailItem("Part Number", EscapeHtml((m.Manufacturer && m.Manufacturer != 'Undefined')?(m.Manufacturer + ', '):'') + EscapeHtml(m.PartNumber), s); }
@@ -9489,9 +9489,10 @@
9489 // Highlights the device being hovered
9490 function eventMouseHover(e, over) {
9491 e.children[1].classList.remove('g1s');
9492 - e.children[2].style['background-color'] = ((over == 0) ? '#c9c9c9' : '#b9b9b9');
9492 + e.children[2].classList.remove('style10s');
9493 + //e.children[2].style['background-color'] = ((over == 0) ? '#c9c9c9' : '#b9b9b9');
9494 e.children[3].classList.remove('g2s');
9494 - if (over == 1) { e.children[1].classList.add('g1s'); e.children[3].classList.add('g2s'); }
9495 + if (over == 1) { e.children[1].classList.add('g1s'); e.children[2].classList.add('style10s'); e.children[3].classList.add('g2s'); }
9496 }
9497
9498 function eventsUpdate() {
@@ -9778,13 +9779,15 @@
9779 // Highlights the user being hovered
9780 function userMouseHover(element, over) {
9781 var e = element.children[0].children[0].children[1];
9782 + element.children[0].children[0].classList.remove('sbar');
9783 e.children[1].classList.remove('g1s');
9784 e.children[2].classList.remove('g2s');
9785 if (over == 1) {
9786 e.children[1].classList.add('g1s');
9787 e.children[2].classList.add('g2s');
9788 + element.children[0].children[0].classList.add('sbar');
9789 }
9787 - element.children[0].children[0].style['background-color'] = ((over == 0) ? '#c9c9c9' : '#b9b9b9');
9790 + //element.children[0].children[0].style['background-color'] = ((over == 0) ? '#c9c9c9' : '#b9b9b9');
9791 }
9792
9793 // Highlights the user being hovered