From 5e8730a616d2a6c0fd6fffd16693d8cacfbaafea Mon Sep 17 00:00:00 2001 From: str4d Date: Sat, 3 Jun 2017 14:11:33 +0000 Subject: [PATCH] Console: - (light, dark, midnight) Fix minor alignment issues with Arabic CSS - JRobin (graphs): - Fix font size issue for non-title text on graphs - Optimise layout (tweaked padding, legend box size etc) - Tweak graph lines (now dotted, slightly less opaque) --- .../org/jrobin/graph/RrdGraphConstants.java | 24 +++---- .../src/org/jrobin/graph/RrdGraphDef.java | 12 ++-- .../net/i2p/router/web/SummaryRenderer.java | 4 +- history.txt | 5 ++ .../resources/themes/console/dark/console.css | 6 +- .../themes/console/dark/console_ar.css | 63 +++++++++++++++++- .../themes/console/light/console.css | 63 +++++++++++++++++- .../themes/console/light/console_ar.css | 64 ++++++++++++++++--- .../themes/console/midnight/console.css | 4 +- .../themes/console/midnight/console_ar.css | 61 ++++++++++++++++++ 10 files changed, 270 insertions(+), 36 deletions(-) diff --git a/apps/jrobin/java/src/org/jrobin/graph/RrdGraphConstants.java b/apps/jrobin/java/src/org/jrobin/graph/RrdGraphConstants.java index 1ed8d303c..a46508436 100644 --- a/apps/jrobin/java/src/org/jrobin/graph/RrdGraphConstants.java +++ b/apps/jrobin/java/src/org/jrobin/graph/RrdGraphConstants.java @@ -161,12 +161,12 @@ public interface RrdGraphConstants { /** * Default minor grid color */ - Color DEFAULT_GRID_COLOR = new Color(171, 171, 171, 95); + Color DEFAULT_GRID_COLOR = new Color(100, 100, 100, 75); // Color DEFAULT_GRID_COLOR = new Color(140, 140, 140); /** * Default major grid color */ - Color DEFAULT_MGRID_COLOR = new Color(255, 91, 91, 95); + Color DEFAULT_MGRID_COLOR = new Color(255, 91, 91, 110); // Color DEFAULT_MGRID_COLOR = new Color(130, 30, 30); /** * Default font color @@ -251,7 +251,7 @@ public interface RrdGraphConstants { * Default font name, determined based on the current operating system */ String DEFAULT_FONT_NAME = System.getProperty("os.name").toLowerCase().contains("windows") ? - "Lucida Sans Typewriter" : "Monospaced"; + "Lucida Console" : "Monospaced"; /** * Default graph small font @@ -278,7 +278,7 @@ public interface RrdGraphConstants { /** * Used internally */ - double LEGEND_BOX = 0.9; // chars + double LEGEND_BOX = 0.7; // chars /** * Used internally */ @@ -286,27 +286,27 @@ public interface RrdGraphConstants { /** * Used internally */ - int PADDING_LEFT = 10; // pix + int PADDING_LEFT = 5; // pix /** * Used internally */ - int PADDING_TOP = 12; // pix + int PADDING_TOP = 9; // pix /** * Used internally */ - int PADDING_TITLE = 6; // pix + int PADDING_TITLE = 7; // pix /** * Used internally */ - int PADDING_RIGHT = 16; // pix + int PADDING_RIGHT = 20; // pix /** * Used internally */ - int PADDING_PLOT = 2; //chars + double PADDING_PLOT = 1.7; //chars /** * Used internally */ - int PADDING_LEGEND = 2; // chars + double PADDING_LEGEND = 2.1; // chars /** * Used internally */ @@ -320,10 +320,10 @@ public interface RrdGraphConstants { * Stroke used to draw grid */ // solid line - Stroke GRID_STROKE = new BasicStroke(1); + //Stroke GRID_STROKE = new BasicStroke(1); // dotted line - // Stroke GRID_STROKE = new BasicStroke(1, BasicStroke.CAP_BUTT, BasicStroke.JOIN_MITER, 1, new float[] {1, 1}, 0); + Stroke GRID_STROKE = new BasicStroke(1, BasicStroke.CAP_BUTT, BasicStroke.JOIN_MITER, 1, new float[] {1, 1}, 0); /** * Stroke used to draw ticks */ diff --git a/apps/jrobin/java/src/org/jrobin/graph/RrdGraphDef.java b/apps/jrobin/java/src/org/jrobin/graph/RrdGraphDef.java index 6f4e966a3..2f1221cd0 100644 --- a/apps/jrobin/java/src/org/jrobin/graph/RrdGraphDef.java +++ b/apps/jrobin/java/src/org/jrobin/graph/RrdGraphDef.java @@ -132,11 +132,11 @@ public class RrdGraphDef implements RrdGraphConstants { fontDir = new File(fontdirProperty); } - fonts[FONTTAG_DEFAULT] = new Font(DEFAULT_FONT_NAME, Font.PLAIN, 8); - fonts[FONTTAG_TITLE] = new Font(DEFAULT_FONT_NAME, Font.PLAIN, 9); - fonts[FONTTAG_AXIS] = new Font(DEFAULT_FONT_NAME, Font.PLAIN, 7); - fonts[FONTTAG_UNIT] = new Font(DEFAULT_FONT_NAME, Font.PLAIN, 8); - fonts[FONTTAG_LEGEND] = new Font(DEFAULT_FONT_NAME, Font.PLAIN, 8); + fonts[FONTTAG_DEFAULT] = new Font(DEFAULT_FONT_NAME, Font.PLAIN, 10); + fonts[FONTTAG_TITLE] = new Font(DEFAULT_FONT_NAME, Font.PLAIN, 10); + fonts[FONTTAG_AXIS] = new Font("Droid Sans Mono", Font.PLAIN, 10); + fonts[FONTTAG_UNIT] = new Font(DEFAULT_FONT_NAME, Font.PLAIN, 10); + fonts[FONTTAG_LEGEND] = new Font("Droid Sans Mono", Font.PLAIN, 10); fonts[FONTTAG_WATERMARK] = new Font(DEFAULT_FONT_NAME, Font.PLAIN, 1).deriveFont(5.5F); } @@ -173,7 +173,7 @@ public class RrdGraphDef implements RrdGraphConstants { if (exception != null) { System.err.println(exception.getLocalizedMessage()); } - font = new Font(DEFAULT_FONT_NAME, Font.PLAIN, 10); + font = new Font("Monospaced", Font.PLAIN, 10); } if (font == null) { diff --git a/apps/routerconsole/java/src/net/i2p/router/web/SummaryRenderer.java b/apps/routerconsole/java/src/net/i2p/router/web/SummaryRenderer.java index dd58ef8af..be16bf077 100644 --- a/apps/routerconsole/java/src/net/i2p/router/web/SummaryRenderer.java +++ b/apps/routerconsole/java/src/net/i2p/router/web/SummaryRenderer.java @@ -35,7 +35,7 @@ class SummaryRenderer { private final Log _log; private final SummaryListener _listener; private final I2PAppContext _context; - private static final Color AREA_COLOR = new Color(100, 160, 200, 240); + private static final Color AREA_COLOR = new Color(100, 160, 200, 200); private static final Color LINE_COLOR = new Color(0, 30, 110, 255); private static final Color RESTART_BAR_COLOR = new Color(223, 13, 13, 255); @@ -135,7 +135,7 @@ class SummaryRenderer { } else { // small = small.deriveFont(small.getSize2D() + 1.0f); // if specified font family is missing, jrobin will use fallback - small = new Font("Droid Sans Mono", Font.PLAIN, 11); + small = new Font("Droid Sans Mono", Font.PLAIN, 10); // large = large.deriveFont(large.getSize2D() + 1.0f); large = new Font("Droid Sans", Font.PLAIN, 13); } diff --git a/history.txt b/history.txt index 75a49d7cf..0500b5ce1 100644 --- a/history.txt +++ b/history.txt @@ -44,6 +44,11 @@ - De-emphasise siderbar app icons with background-blend-mode: luminosity - Change sidebar snark icon to match homepage icon - Bump div.main text color from #222 to #333 (reduce contrast) + - (light, dark, midnight) fix minor alignment issues with Arabic CSS + - JRobin (graphs): + - Fix font size issue for non-title text on graphs + - Optimise layout (tweaked padding, legend box size etc) + - Tweak graph lines (now dotted, slightly less opaque) * i2ptunnel: - Remove redundant labels and spans for keyaccess - Edit Server: diff --git a/installer/resources/themes/console/dark/console.css b/installer/resources/themes/console/dark/console.css index 83b8850d9..71a22a6c0 100644 --- a/installer/resources/themes/console/dark/console.css +++ b/installer/resources/themes/console/dark/console.css @@ -3296,7 +3296,7 @@ table#sidebarconf { } #sidebarconf td:nth-child(3), #sidebarconf td:nth-child(4) { - width: 75px; + width: 1%; padding: 0; white-space: nowrap; } @@ -3307,7 +3307,7 @@ table#sidebarconf { #sidebarconf td:nth-child(4) { text-align: left; - padding-right: 0; + padding-right: 5px; } #sidebarconf tr:last-child { @@ -3317,7 +3317,7 @@ table#sidebarconf { #sidebarconf tr:last-child td:last-child { padding: 0; - text-align: left; + text-align: center; } #sidebarconf select { diff --git a/installer/resources/themes/console/dark/console_ar.css b/installer/resources/themes/console/dark/console_ar.css index 675e73bec..307ba6b95 100644 --- a/installer/resources/themes/console/dark/console_ar.css +++ b/installer/resources/themes/console/dark/console_ar.css @@ -315,6 +315,67 @@ td.optionsave { text-align: right; } +.h3navlinks, h3#servicedebug a, h3#graphinfo a, #config_stats.main h3 a, #config_logging.main h3 a, #configstats th a { + float: left; +} + +#i2pupdates .optbox { + margin-right: 10px; +} + +#reseedconfig input { + margin-left: 8px !important; + margin-right: 0 !important; +} + +#reseedconfig textarea { + width: calc(100% - 20px) !important +} + +#configstats th { + text-align: right !important; +} + +#configstats td:first-child { + text-align: center !important; +} + +#configstats td.optionsave { + text-align: left !important; +} + +#configstats td:nth-child(2) { + padding-right: 15px; +} + +#clientconfig th:first-child, #clientconfig td:first-child, #loggingoptions td:first-child, #i2pupdates td:first-child, #tunnelconfig td:first-child, +table#i2pupdates input[name*="URL"], table#i2pupdates textarea, #addkeyring td:first-child, #reseedconfig td:first-child { + text-align: left !important; +} + +#config_logging p, #reseedconfig td.infohelp { + text-align: right !important; +} + +#clientconfig td:nth-child(2) { + text-align: center !important; +} + +#bannedips, #bannedips table { + direction: ltr !important; +} + +table#addkeyring td.infohelp { + text-align: right !important; +} + +p#helptranslate, #floodfillconfig tr:first-child .infohelp { + text-align: right !important; + padding-right: 50px !important; + background-image: url(images/infohelp.png); + background-position: right 12px center !important; +} + #consolepass input[name="nofilter_pw"], #externali2cp input[name="nofilter_pw"], #consolepass input[name="nofilter_pw"]:focus, #externali2cp input[name="nofilter_pw"]:focus, #consolepass input[name="name"], #externali2cp input[name="user"], #consolepass input[name="name"]:focus, #externali2cp input[name="user"]:focus { background-position: right 3px center, center center !important; @@ -325,7 +386,7 @@ td.optionsave { @-moz-document url-prefix() { select, select:hover, select:focus { background-position: left center !important; - padding: 3px 2px 3px 16px; + padding: 3px 2px 3px 16px !important; } } diff --git a/installer/resources/themes/console/light/console.css b/installer/resources/themes/console/light/console.css index 17d972574..e524d77f3 100644 --- a/installer/resources/themes/console/light/console.css +++ b/installer/resources/themes/console/light/console.css @@ -3801,7 +3801,7 @@ h3#scheduledjobs + ol li:before { } .cells { - border-left: 1px outset #ddf; + border-left: 1px inset #ddf; border-top: 1px inset #ddf !important; border-bottom: 1px inset #ddf !important; } @@ -5620,6 +5620,12 @@ input[name="pluginURL"] { } } +@media screen and (min-width: 1200px) { +#ntcpconnections td:first-child, #udpconnections td:first-child { + padding-left: 5px !important; +} +} + @media screen and (min-width: 1500px) { body, .main, .main td, .news p, #news p, .tab, .tab2, .main li b, div.joblog li, .themelabel, .ui_lang, .applabel a, #changelog pre, .routersummary button.download, #peerdefs, #profile_defs, #thresholds, #configinfo, .infohelp, .infowarn, button, input, select, textarea, #configinfo th, tt, code, th, .statusnotes { @@ -5822,3 +5828,58 @@ _:-ms-lang(x), .tunnels_client th:first-child::after { /* end Edge/IE tweaks */ +/* /peers */ +/* TODO: merge with main classes */ + +#ntcpconnections th:nth-child(6), #ntcpconnections th:nth-child(7), #ntcpconnections th:nth-child(8), #ntcpconnections th:nth-child(9), #ntcpconnections th:nth-child(10), +#ntcpconnections td:nth-child(6), #ntcpconnections td:nth-child(7), #ntcpconnections td:nth-child(8), #ntcpconnections td:nth-child(9), #ntcpconnections td:nth-child(10), +#udpconnections td:nth-child(6), #udpconnections td:nth-child(7), #udpconnections td:nth-child(9), #udpconnections td:nth-child(10), #udpconnections td:nth-child(11), +#udpconnections td:nth-child(13), #udpconnections td:nth-child(14), #udpconnections td:nth-child(15), #udpconnections td:nth-child(16) { + text-align: right; + white-space: nowrap; +} + +#ntcpconnections .tablefooter td:nth-child(3), #ntcpconnections .tablefooter td:nth-child(4), #ntcpconnections .tablefooter td:nth-child(5), #ntcpconnections .tablefooter td:nth-child(6), +#udpconnections .tablefooter td:nth-child(3), #udpconnections .tablefooter td:nth-child(4), #udpconnections .tablefooter td:nth-child(7), #udpconnections .tablefooter td:nth-child(8), +#udpconnections .tablefooter td:nth-child(10), #udpconnections .tablefooter td:nth-child(11), #udpconnections .tablefooter td:nth-child(12), #udpconnections .tablefooter td:nth-child(13) { + text-align: right; +} + +#udpconnections .tablefooter td:nth-child(9) { + text-align: center !important; +} + +#ntcpconnections td:nth-child(6), #ntcpconnections td:nth-child(7), #ntcpconnections td:nth-child(8), #ntcpconnections td:nth-child(9), #ntcpconnections td:nth-child(10), +#ntcpconnections .tablefooter td:nth-child(3), #ntcpconnections .tablefooter td:nth-child(4), #ntcpconnections .tablefooter td:nth-child(5), #ntcpconnections .tablefooter td:nth-child(6) { + padding-left: 1vw !important; + padding-right: 1vw !important; +} + +#ntcpconnections td:nth-child(4), #ntcpconnections td:nth-child(5), #udpconnections td:nth-child(4), +#udpconnections td:nth-child(5), #udpconnections td:nth-child(8), #udpconnections td:nth-child(12) { + white-space: nowrap; +} + +#udpconnections .tablefooter td { + padding-left: 5px; + padding-right: 5px; +} + +@media screen and (min-width: 1500px) { +#ntcpconnections td:nth-child(6), #ntcpconnections td:nth-child(7), #ntcpconnections td:nth-child(8), #ntcpconnections td:nth-child(9), #ntcpconnections td:nth-child(10), +#udpconnections td:nth-child(6), #udpconnections td:nth-child(7), #udpconnections td:nth-child(9), #udpconnections td:nth-child(10), #udpconnections td:nth-child(11), +#udpconnections td:nth-child(13), #udpconnections td:nth-child(14), #udpconnections td:nth-child(15), #udpconnections td:nth-child(16), +#ntcpconnections .tablefooter td:nth-child(3), #ntcpconnections .tablefooter td:nth-child(4), #ntcpconnections .tablefooter td:nth-child(5), #ntcpconnections .tablefooter td:nth-child(6), +#udpconnections .tablefooter td:nth-child(3), #udpconnections .tablefooter td:nth-child(4), #udpconnections .tablefooter td:nth-child(7), #udpconnections .tablefooter td:nth-child(8), +#udpconnections .tablefooter td:nth-child(10), #udpconnections .tablefooter td:nth-child(11), #udpconnections .tablefooter td:nth-child(12), #udpconnections .tablefooter td:nth-child(13) { + padding-right: 10px !important; +} + +.cells { + border-left: none; + border-right: none; +} +} + +/* end peers */ + diff --git a/installer/resources/themes/console/light/console_ar.css b/installer/resources/themes/console/light/console_ar.css index 73f73a0a3..289cce287 100644 --- a/installer/resources/themes/console/light/console_ar.css +++ b/installer/resources/themes/console/light/console_ar.css @@ -77,11 +77,11 @@ button.search:hover, input[type="submit"]:hover, input[type="reset"]:hover, button.search:focus, input[type="submit"]:focus, input[type="reset"]:focus, button.search:active, input[type="submit"]:active, input[type="reset"]:active { background-position: right 6px center !important; - padding: 5px 22px 5px 7px !important; + padding: 5px 24px 5px 7px !important; } select, select:hover, select:focus, select:active { - padding: 4px 4px 4px 16px; + padding: 4px 4px 4px 16px !important; background-position: left center !important; text-align: right !important; } @@ -198,6 +198,11 @@ div.graphspanel form { text-align: right; } +#graphs td.infohelp { + text-align: right; + padding-right: 40px !important; +} + .langbox { float: left; text-align: left; @@ -205,6 +210,18 @@ div.graphspanel form { margin-left: 4px; } +p#helptranslate { + padding-right: 50px !important; + text-align: right !important; + background-position: right 14px center !important; + background-image: url("/themes/console/images/info/infohelp.png"); + background-size: 28px auto !important; +} + +#loggingoptions p { + text-align: right; +} + .confignav { margin-left: -19px !important; margin-right: -19px !important; @@ -432,6 +449,18 @@ textarea#advancedsettings, #i2pupdates textarea, #addkeyring textarea, #reseedco direction: ltr; } +.main[id^="config_"] select, .main[id^="config_"] textarea, .main[id^="config_"] .optbox { + margin-right: 3px; +} + +#i2pupdates input[type="text"]:not([readonly]), #i2pupdates textarea, .main[id^="config_"] textarea, input[name="newsURL"] { + width: calc(100% - 10px); +} + +#i2pupdates td:first-child, #reseedconfig td:first-child { + text-align: left; +} + .homelinkedit th:first-child, .homelinkedit td:first-child { text-align: center; } @@ -487,7 +516,7 @@ table#addkeyring tr:last-child td { } .tab, .tab2 { - font-size: 10pt; + font-size: 12pt !important; margin-top: -5px; } @@ -648,12 +677,12 @@ table.netdbentry td:nth-child(2) { margin-right: 20px; } -p#profiles_overview, #profiles .widescroll + h3, #thresholds + h3, ul#banlist { +p#profiles_overview, #profiles .widescroll + h3, #thresholds + h3, #profiles #banlist { margin-right: -16px !important; } -p#profiles_overview, #profiles .widescroll + h3, #thresholds + h3, ul#banlist { - margin-left: 16px; +p#profiles_overview, #profiles .widescroll + h3, #thresholds + h3, #profiles #banlist { + margin-left: 16px !important; } #profiles_overview + .widescroll { @@ -668,11 +697,15 @@ p#profiles_overview, #profiles .widescroll + h3, #thresholds + h3, ul#banlist { margin: 0 !important; } -#profilelist th:last-child, #profilelist td:last-child { +#profilelist th:last-child, #profilelist td:last-child, #addkeyring td:first-child { text-align: left; } -#profiledefs td:last-child { +#profile_defs td:first-child { + text-align: left !important; +} + +#profile_defs td:last-child, td.infohelp { text-align: right !important; } @@ -708,7 +741,7 @@ p#profiles_overview, #profiles .widescroll + h3, #thresholds + h3, ul#banlist { .logtable tr:first-child td { direction: ltr; -} +} #wrapperlogs pre { text-align: left; @@ -763,6 +796,19 @@ pre#transports { margin: 5px 3px 5px 15px !important; } +label { + text-align: right !important; + display: inline-block; +} + +#graphs input { + margin-left: 8px !important; +} + +#graphs td:first-child { + padding-right: 10px; +} + #consolepass tr:first-child td, p#clientconf.infohelp, p#webappconfigtext.infohelp, #floodfillconfig .infohelp, #bandwidthconfig tr:first-child .infohelp, h3#shutdownrouter + p.infohelp, h3#restartrouter + p.infohelp, h3#systray + p.infohelp, h3#servicedebug + p.infohelp, h3#browseronstart + p.infohelp, table#addkeyring td:first-child, #config_peers tr:nth-child(3) td.infohelp, diff --git a/installer/resources/themes/console/midnight/console.css b/installer/resources/themes/console/midnight/console.css index ddb47269b..dde0bd042 100644 --- a/installer/resources/themes/console/midnight/console.css +++ b/installer/resources/themes/console/midnight/console.css @@ -4832,11 +4832,11 @@ table#jardump { /* /jars */ .main#tunnelmgr { padding: 0 5px; - min-width: 1000px; + min-width: 630px; } #i2ptunnelframe { - margin: -5px 0 -10px; + margin: -5px 0; } .main#debug th { diff --git a/installer/resources/themes/console/midnight/console_ar.css b/installer/resources/themes/console/midnight/console_ar.css index ee70de981..23d40530f 100644 --- a/installer/resources/themes/console/midnight/console_ar.css +++ b/installer/resources/themes/console/midnight/console_ar.css @@ -306,6 +306,67 @@ td.optionsave { text-align: right; } +.h3navlinks, h3#servicedebug a, h3#graphinfo a, #config_stats.main h3 a, #config_logging.main h3 a, #configstats th a { + float: left; +} + +#i2pupdates .optbox { + margin-right: 10px; +} + +#reseedconfig input { + margin-left: 8px !important; + margin-right: 0 !important; +} + +#reseedconfig textarea { + width: calc(100% - 20px) !important +} + +#configstats th { + text-align: right !important; +} + +#configstats td:first-child { + text-align: center !important; +} + +#configstats td.optionsave { + text-align: left !important; +} + +#configstats td:nth-child(2) { + padding-right: 15px; +} + +#clientconfig th:first-child, #clientconfig td:first-child, #loggingoptions td:first-child, #i2pupdates td:first-child, #tunnelconfig td:first-child, +table#i2pupdates input[name*="URL"], table#i2pupdates textarea, #addkeyring td:first-child, #reseedconfig td:first-child { + text-align: left !important; +} + +#config_logging p, #reseedconfig td.infohelp { + text-align: right !important; +} + +#clientconfig td:nth-child(2) { + text-align: center !important; +} + +#bannedips, #bannedips table { + direction: ltr !important; +} + +table#addkeyring td.infohelp { + text-align: right !important; +} + +p#helptranslate, #floodfillconfig tr:first-child .infohelp { + text-align: right !important; + padding-right: 50px !important; + background-image: url(/themes/console/images/info/infohelp.png); + background-position: right 12px center !important; +} + #consolepass input[name="nofilter_pw"], #externali2cp input[name="nofilter_pw"], #consolepass input[name="nofilter_pw"]:focus, #externali2cp input[name="nofilter_pw"]:focus, #consolepass input[name="name"], #externali2cp input[name="user"], #consolepass input[name="name"]:focus, #externali2cp input[name="user"]:focus { background-position: right 3px center, center center !important;