diff --git a/apps/routerconsole/java/src/net/i2p/router/web/HelperBase.java b/apps/routerconsole/java/src/net/i2p/router/web/HelperBase.java index 8515e4df1b..60a2b28930 100644 --- a/apps/routerconsole/java/src/net/i2p/router/web/HelperBase.java +++ b/apps/routerconsole/java/src/net/i2p/router/web/HelperBase.java @@ -15,6 +15,7 @@ public abstract class HelperBase { public static final String PROP_ADVANCED = "routerconsole.advanced"; /** @since public since 0.9.33, was package private */ public static final String CHECKED = " checked=\"checked\" "; + public static final String SELECTED = " selected=\"selected\" "; /** * Configure this bean to query a particular router context diff --git a/apps/routerconsole/java/src/net/i2p/router/web/helpers/ConfigUIHelper.java b/apps/routerconsole/java/src/net/i2p/router/web/helpers/ConfigUIHelper.java index 5aef38ee57..c0fe0090e4 100644 --- a/apps/routerconsole/java/src/net/i2p/router/web/helpers/ConfigUIHelper.java +++ b/apps/routerconsole/java/src/net/i2p/router/web/helpers/ConfigUIHelper.java @@ -186,19 +186,23 @@ public class ConfigUIHelper extends HelperBase { current = "en"; } StringBuilder buf = new StringBuilder(512); + //buf.append("
\n"); + buf.append(" " + - "\"\"" + - "
"); + buf.append(SELECTED); + + buf.append(" value=\"").append(lang).append("\""); + buf.append(" id=\"").append(lang).append("\"").append(">"); + //buf.append(" style=\"").append("background-image:url(/flags.jsp?s=48&c=").append(langs[i][1]).append("\">\n"); int under = lang.indexOf('_'); String slang = (under > 0) ? lang.substring(0, under) : lang; + //buf.append(" "); buf.append(langs[i][2]); String name = langs[i][3]; if (name != null) { @@ -206,8 +210,10 @@ public class ConfigUIHelper extends HelperBase { .append(name) .append(')'); } - buf.append("
\n"); + buf.append("\n"); } + buf.append(" \n"); + //buf.append("
\n"); return buf.toString(); } diff --git a/apps/routerconsole/jsp/welcome.jsp b/apps/routerconsole/jsp/welcome.jsp index fdd00f5edc..c56751ed02 100644 --- a/apps/routerconsole/jsp/welcome.jsp +++ b/apps/routerconsole/jsp/welcome.jsp @@ -92,7 +92,7 @@ <% } %> -

<%=intl._t("New Install Wizard")%> <%=ipg%>/<%=LAST_PAGE%>

+
<% @@ -112,28 +112,35 @@ <%-- needed for CSS: --%>
<%-- needed for lang setting in css.jsi: --%> -

<%=uihelper._t("Router Console Language")%>

-
+ +

<%=uihelper._t("Router Console Language")%>

+ +
-
+
+
<% } else if (ipg == 2) { // I2P Philosophy // license info? %> -

<%=intl._t("Why I2P?")%>

-
+ +

<%=intl._t("Why I2P?")%>

+ +
<%=intl._t("I2P is a communication tool for people who value privacy and wish to remain anonymous online.")%> <%=intl._t("I2P is a peer to peer network where you can browse and create hidden services.")%> -
+ <% } else if (ipg == 3) { // Overview of bandwidth test %> -

<%=intl._t("Bandwidth Test")%>

-
+ +

<%=intl._t("Bandwidth Test")%>

+ +

<%=intl._t("I2P will now test your internet connection to identify the optimal speed settings.")%> <%=intl._t("Bandwidth participation improves the anonymity level of all users on the network and maximizes your download speed.")%> @@ -145,18 +152,20 @@ <%=intl._t("M-Lab Privacy Policy")%>
<%=intl._t("M-Lab Name Server Privacy Policy")%>

-
+ <% } else if (ipg == 4) { // Bandwidth test in progress (w/ AJAX) %> -

<%=intl._t("Bandwidth Test in Progress")%>

-
+ +

<%=intl._t("Bandwidth Test in Progress")%>

+ +
<%=intl._t("Javascript is disabled - wait 60 seconds for the bandwidth test to complete and then click Next")%>
-
+
<% @@ -170,8 +179,10 @@ if (request.getParameter("skipbw") == null) { // don't display this if we skipped the test %> -

<%=intl._t("Bandwidth Test Results")%>

- + +

<%=intl._t("Bandwidth Test Results")%>

+ +
@@ -191,24 +202,34 @@ <% } // skipbw %> -

<%=intl._t("Bandwidth Configuration")%>

-
<%=intl._t("Test running?")%><%=wizhelper.isNDTRunning()%>
<%=intl._t("Test complete?")%><%=wizhelper.isNDTComplete()%>
<%=intl._t("Test server location")%><%=wizhelper.getServerLocation()%>
+ +

<%=intl._t("Bandwidth Configuration")%>

+ + +
- + + <%-- display burst, set standard, handler will fix up --%> - + + -
<%=intl._t("I2P will work best if you configure your rates to match the speed of your internet connection.")%>
" > <%=intl._t("KBps In")%> ()
" > <%=intl._t("KBps Out")%> ()
<%=intl._t("Share")%> ()
+
+
<% int share = Math.round(wizhelper.getShareBandwidth() * 1.024f); if (share < 12) { out.print(""); @@ -226,16 +247,23 @@ out.print(intl._t("The higher the share bandwidth the more you improve your anonymity and help the network.")); } -%> - +%> +
<% } else if (ipg == 6) { // Browser setup %> -

<%=intl._t("Browser Setup")%>

-

+ +

<%=intl._t("Browser Setup")%>

+ +

<%=intl._t("Your browser needs to be configured to work with I2P.")%> +<%=intl._t("We currently provide an I2P Browser which configures itself automatically")%> +<%=intl._t("that you may retrieve from here.")%> +<%=intl._t("Be aware that this product is currently in beta-testing.")%> +

+<%=intl._t("Alternatively, you can configure your browser of choice to use I2P.")%> <%=intl._t("If you want to do this yourself, here are instructions.")%> <% if (net.i2p.util.SystemVersion.isWindows()) { @@ -248,31 +276,32 @@ <% } //isWindows() %> -

+

<% } else if (ipg == LAST_PAGE) { // Done %> -

<%=intl._t("Welcome to I2P!")%>

-
+

<%=intl._t("Welcome to I2P!")%>

+ +

<%=intl._t("When you start I2P, it may take a few minutes to bootstrap (integrate) your router into the network and find additional peers, so please be patient.")%>

<%=intl._t("When I2P starts up, and during normal operation, I2P's tunnel build readiness indicator in the side panel may indicate that I2P is \"Rejecting Tunnels\"; this is normal behavior.")%> <%=intl._t("Once green stars are indicated next to your Local Tunnels, there is a wide variety of things you can do with I2P.")%>

-
+
<% } else { %> -
unknown wizard page
+
unknown wizard page
<% } %> -
-
+
+
<% if (ipg != 1) { %> diff --git a/installer/resources/themes/console/dark/console.css b/installer/resources/themes/console/dark/console.css index 27b886aa33..737a0bafa8 100644 --- a/installer/resources/themes/console/dark/console.css +++ b/installer/resources/themes/console/dark/console.css @@ -1245,6 +1245,26 @@ div.widescroll { /* only scroll content, not entire page eg /peers */ /* end topnav */ +.messages { + margin: 15px 0; + padding: 10px 15px; + z-index: 999; + border-radius: 2px; + border: 1px solid #7778bf; + background: #eef; + background: linear-gradient(to right, #fafaff, #eef); + background-size: auto 100%, 100% 100%; + box-shadow: inset 0 0 0 1px #fff; + filter: drop-shadow(0 0 1px #ccf); + font-weight: bold; + line-height: 130%; + filter: drop-shadow(0 0 1px #ccf); + position: absolute; + top: 5%; + right: 5%; + width: 20%; + } + div.messages { padding: 20px 10px 20px 50px; margin: 10px 0 15px 0; @@ -1879,6 +1899,12 @@ h1 { box-shadow: 0 1px 5px #000; } +.mlabtable { + width: 30%; + position: absolute; + top: 36%; +} + span.newtab { text-align: right; font-size: 8pt; @@ -2292,6 +2318,7 @@ input[type="submit"], input[type="reset"], select, button { input[type="submit"], input[type="reset"], button { padding: 5px 8px !important; outline: none; + font-size: large } .statusnotes { @@ -2991,7 +3018,6 @@ tr#addnew, tr#addnew:hover { p#helptranslate { position: relative; top: 8px; - margin: 0 -7px; padding: 15px 10px 15px 50px !important; text-align: left !important; border-top: 1px solid #494; @@ -3021,7 +3047,7 @@ p#helptranslate { white-space: nowrap; } -h3#themeheading, h3#langheading, h3#passwordheading { +h3#themeheading, h3#passwordheading { border-radius: 0; border: 1px solid #494; padding: 8px 10px; @@ -3053,15 +3079,15 @@ td#themeselect { } .langselect { /* containing box for lang selection */ - background: #000; - background: linear-gradient(to bottom, #010 0%, #000 80%); - width: 120px; + width: 40%; float: left; margin: 4px; text-align: center; - border: 1px solid #262; padding: 8px 4px 0; border-radius: 2px; + border: none; + float: left; + margin-left: 15%; } .langselect:hover { @@ -3202,6 +3228,58 @@ td#themeselect { /* end flag as radio icons */ +#wizardheading { + border: none; + width: 50%; + padding: 2%; + margin: 2% 24%; + top: 2%; + font-size: xx-large; + text-transform: uppercase; + letter-spacing: 0.08em; + word-spacing: 0.1em; + color: #41465f; + position: absolute; + background: none !important; + box-shadow: none !important; + z-index: 999; +} + +#infodiv { + position: absolute; + right: 12%; + width: 16%; + top: 36%; + background: linear-gradient(to right, #fafaff, #000); + background-size: auto 100%, 100% 100%; + box-shadow: inset 0 0 0 1px #fff; + filter: drop-shadow(0 0 1px #ccf); +} + +#bandwidthconfig { + border: 1px solid #7778bf; +} + +#bandwidthconfig.configtable.wizard { + width: 35%; + top: 36%; + left: 31%; + position: absolute; + background: none; + font-size: larger; +} + +.configtable.wizard { + width: 20%; + bottom: 5rem; + right: 10rem; + position: absolute; + box-shadow: none !important; + white-space: normal; + background: none; + font-size: larger; +} + div.ui_lang { /* lang text label */ text-align: center; background: #001000; @@ -3227,12 +3305,26 @@ h3#langheading { margin-bottom: 0; } -div#langsettings { +select#langsettings { border: 1px solid #494; padding: 8px 7px 12px; margin-top: -1px; margin-bottom: -12px; background: #000; + font-size: large; + height: 3rem; + width: 15rem; +} + +div#langsettings { + border: 1px solid #7778bf; +} + +div#wizlangsettings.wizard { + border: none; + position: absolute; + left: 15rem; + bottom: 10rem; } #langsettings hr { @@ -3240,7 +3332,7 @@ div#langsettings { } .formaction#langui { - margin: 7px -8px -15px; + margin: 5px 0 0; padding: 5px; border: 1px solid #494; background: #000; @@ -3451,6 +3543,75 @@ p#ipconfig, p#ipv4config, p#udpconfig, p#externaltcp { background: #001000; } +#bandwidthconfig table.configtable { + border: none; + bottom: 5rem; + right: 10rem; +} + +.configtable tr:last-child td { + border-top: 1px solid #7778bf !important; +} + +.configtable.wizard tr:last-child td { + border-top: none; +} + +img.wizard.progress { + position: absolute; + top: 2%; + left: 0%; + width: 31%; + max-width: 31%; + -webkit-filter: invert(1); + filter: invert(1); + z-index: 500; +} + +.wizard { + border: none !important; + background: none !important; + box-shadow: none !important; + border-top: none !important; +} + +#bwconfigheader { + background: white; +} + +.wizardtext { + width: 25%; + position: absolute; + top: 36%; + left: 5%; + font-size: larger; +} + +#wizard { + z-index: -1; + position: absolute; + left: 0px; + top: 0px; + height: 100%; + width: 100%; + background-color: #000; +} + +.wizardimg { + max-width: 100%; + max-height: 100vh; + margin: auto; + -webkit-filter: invert(1); + filter: invert(1); + z-index: -1; + position: absolute; + left: 31%; +} + +#bandwidthconfig .configtable tr:last-child td { + border: none; +} + table#bandwidthconfig { margin-bottom: 1px; } @@ -3460,6 +3621,48 @@ table#bandwidthconfig td:first-child { white-space: nowrap; } +#bandwidthconfig td:last-child { + white-space: normal; + background: none; + font-size: larger; +} + +#bandwidthconfig.configtable td { + white-space: normal; + background: none; + font-size: larger; +} + +#bandwidthconfig.configtable.wizard td { + white-space: normal; + background: none; + font-size: small; +} + +#xhr.notification { + width: 30%; + position: absolute; + left: 30%; + top: 38%; + font-size: larger; + background: #000; + box-shadow: inset 0 0 0 1px #fff; + filter: drop-shadow(0 0 1px #ccf); +} + +#xhr2.notification { + width: 30%; + position: absolute; + left: 30%; + top: 40%; + font-size: larger; + background: #000; + background: linear-gradient(to right, #fafaff, #000); + background-size: auto 100%, 100% 100%; + box-shadow: inset 0 0 0 1px #fff; + filter: drop-shadow(0 0 1px #ccf); +} + table#bandwidthconfig { padding: 5px 10px !important; } @@ -3695,6 +3898,16 @@ table#tunnelconfig td:first-child { /* end /configtunnels */ +input.cancel, button.cancel { + padding: 5px 7px 5px 22px; + /*font-size: large;*/ +} + +input.go, button.go, input[value="GO"] { + padding: 5px 7px 5px 22px; + /*font-size: large;*/ +} + /* /configupdate */ #i2pupdates { @@ -5695,8 +5908,8 @@ textarea#advancedsettings { padding: 15px 15px 15px 50px !important; text-align: justify; line-height: 130% !important; - border-bottom: 1px solid #494; - border-top: 1px solid #494; + /*border-bottom: 1px solid #494; + border-top: 1px solid #494;*/ white-space: normal !important; font-weight: normal !important; background-size: 28px 28px !important; @@ -5728,7 +5941,7 @@ td.optionsave { padding: 5px !important; white-space: nowrap; /* width: 50px;*/ - background: #000; + background: none; } #floodfillconfig form, #plugininstall form, #plugininstall2 form, #updateplugins form, .configtable form { diff --git a/installer/resources/themes/console/images/wizard/logogrey1.png b/installer/resources/themes/console/images/wizard/logogrey1.png new file mode 100644 index 0000000000..84992adcb8 Binary files /dev/null and b/installer/resources/themes/console/images/wizard/logogrey1.png differ diff --git a/installer/resources/themes/console/images/wizard/logogrey2.png b/installer/resources/themes/console/images/wizard/logogrey2.png new file mode 100644 index 0000000000..97592514b8 Binary files /dev/null and b/installer/resources/themes/console/images/wizard/logogrey2.png differ diff --git a/installer/resources/themes/console/images/wizard/logogrey3.png b/installer/resources/themes/console/images/wizard/logogrey3.png new file mode 100644 index 0000000000..ee57f61431 Binary files /dev/null and b/installer/resources/themes/console/images/wizard/logogrey3.png differ diff --git a/installer/resources/themes/console/images/wizard/logogrey4.png b/installer/resources/themes/console/images/wizard/logogrey4.png new file mode 100644 index 0000000000..0b8da82d1c Binary files /dev/null and b/installer/resources/themes/console/images/wizard/logogrey4.png differ diff --git a/installer/resources/themes/console/images/wizard/logogrey5.png b/installer/resources/themes/console/images/wizard/logogrey5.png new file mode 100644 index 0000000000..9ae0190e09 Binary files /dev/null and b/installer/resources/themes/console/images/wizard/logogrey5.png differ diff --git a/installer/resources/themes/console/images/wizard/logogrey6.png b/installer/resources/themes/console/images/wizard/logogrey6.png new file mode 100644 index 0000000000..d36f09b308 Binary files /dev/null and b/installer/resources/themes/console/images/wizard/logogrey6.png differ diff --git a/installer/resources/themes/console/images/wizard/logogrey7.png b/installer/resources/themes/console/images/wizard/logogrey7.png new file mode 100644 index 0000000000..1a5ba08e81 Binary files /dev/null and b/installer/resources/themes/console/images/wizard/logogrey7.png differ diff --git a/installer/resources/themes/console/images/wizard/undraw_High_five.png b/installer/resources/themes/console/images/wizard/undraw_High_five.png new file mode 100644 index 0000000000..bb7598ff5f Binary files /dev/null and b/installer/resources/themes/console/images/wizard/undraw_High_five.png differ diff --git a/installer/resources/themes/console/images/wizard/undraw_connected_world.png b/installer/resources/themes/console/images/wizard/undraw_connected_world.png new file mode 100644 index 0000000000..431ff7af5b Binary files /dev/null and b/installer/resources/themes/console/images/wizard/undraw_connected_world.png differ diff --git a/installer/resources/themes/console/images/wizard/undraw_globe.png b/installer/resources/themes/console/images/wizard/undraw_globe.png new file mode 100644 index 0000000000..a17f90e0c1 Binary files /dev/null and b/installer/resources/themes/console/images/wizard/undraw_globe.png differ diff --git a/installer/resources/themes/console/images/wizard/undraw_in_progress.png b/installer/resources/themes/console/images/wizard/undraw_in_progress.png new file mode 100644 index 0000000000..99ff40dbc8 Binary files /dev/null and b/installer/resources/themes/console/images/wizard/undraw_in_progress.png differ diff --git a/installer/resources/themes/console/images/wizard/undraw_metrics.png b/installer/resources/themes/console/images/wizard/undraw_metrics.png new file mode 100644 index 0000000000..587f93f782 Binary files /dev/null and b/installer/resources/themes/console/images/wizard/undraw_metrics.png differ diff --git a/installer/resources/themes/console/images/wizard/undraw_speed_test.png b/installer/resources/themes/console/images/wizard/undraw_speed_test.png new file mode 100644 index 0000000000..c5f01c65bc Binary files /dev/null and b/installer/resources/themes/console/images/wizard/undraw_speed_test.png differ diff --git a/installer/resources/themes/console/images/wizard/undraw_startup_life.png b/installer/resources/themes/console/images/wizard/undraw_startup_life.png new file mode 100644 index 0000000000..5b9f2ee98f Binary files /dev/null and b/installer/resources/themes/console/images/wizard/undraw_startup_life.png differ diff --git a/installer/resources/themes/console/light/console.css b/installer/resources/themes/console/light/console.css index 880af67661..241700c637 100644 --- a/installer/resources/themes/console/light/console.css +++ b/installer/resources/themes/console/light/console.css @@ -1881,7 +1881,13 @@ h3#passwordheading { filter: none; } -h3#langheading, h3#themeheading, h3#pluginmanage, h3#pconfig, h3#webappconfig, h3#advancedclientconfig, h3#i2pclientconfig, #config_stats h3 { +.mlabtable { + width: 30%; + position: absolute; + top: 36%; +} + +h3#themeheading, h3#pluginmanage, h3#pconfig, h3#webappconfig, h3#advancedclientconfig, h3#i2pclientconfig, #config_stats h3 { border: 1px solid #7778bf; border-radius: 0; box-shadow: inset 0 0 0 1px #fff; @@ -2152,15 +2158,20 @@ h3#graphdisplay { .messages { margin: 15px 0; padding: 10px 15px; + z-index: 999; border-radius: 2px; border: 1px solid #7778bf; background: #eef; background: linear-gradient(to right, #fafaff, #eef); background-size: auto 100%, 100% 100%; - font-weight: bold; box-shadow: inset 0 0 0 1px #fff; - line-height: 130%; filter: drop-shadow(0 0 1px #ccf); + font-weight: bold; + line-height: 130%; + position: absolute; + top: 5%; + right: 5%; + width: 20%; } .main#config_update .messages { @@ -2233,11 +2244,11 @@ table { td.optionsave { text-align: right; padding: 5px !important; - background: #fafaff; - border-top: 1px solid #7778bf !important; + background: none; + /*border-top: 1px solid #7778bf !important;*/ } -td.optionsave, .formaction, form[action="configpeer"] tr:last-child td, table#addkeyring tr:last-child td { +.formaction, form[action="configpeer"] tr:last-child td, table#addkeyring tr:last-child td { background: linear-gradient(to bottom, #fafaff 50%, rgba(220,220,255,0.3)), repeating-linear-gradient(135deg, rgba(255,255,255,0.5) 2px, rgba(221, 221, 255, 0.3) 3px, #fff 5px) !important; } @@ -2249,6 +2260,13 @@ td.optionsave, .formaction, form[action="configpeer"] tr:last-child td, table#ad .configtable { box-shadow: none !important; + white-space: normal; +} + +#bandwidthconfig table.configtable { + border: none; + bottom: 5rem; + right: 10rem; } .configtable td { @@ -2256,15 +2274,24 @@ td.optionsave, .formaction, form[action="configpeer"] tr:last-child td, table#ad } .configtable tr:last-child td { - border-top: 1px solid #7778bf !important; + border-top: 1px solid #7778bf; +} + +.wizard tr:last-child td { + border-top: none !important; +} + +#bandwidthconfig .configtable tr:last-child td { + border: none; } td.infohelp, #help tr:hover td.infohelp, #eventlog tr:hover .infohelp { background: #fff url(/themes/console/images/info/infohelp.png) 12px center no-repeat; background: url(/themes/console/images/info/infohelp.png) 12px center no-repeat, linear-gradient(135deg, #fafaff, #f8f8ff); padding: 15px 15px 15px 50px; - border-bottom: 1px solid #7778bf !important; - border-top: 1px solid #7778bf !important; + /*border-bottom: 1px solid #7778bf !important; + border-top: 1px solid #7778bf !important;*/ + border: unset; text-align: justify; } @@ -2549,6 +2576,57 @@ td { margin-left: 3px !important; } +#wizardheading { + border: none; + width: 50%; + padding: 2%; + margin: 2% 24%; + top: 2%; + font-size: xx-large; + text-transform: uppercase; + letter-spacing: 0.08em; + word-spacing: 0.1em; + color: #41465f; + position: absolute; + background: none !important; + box-shadow: none !important; +} + +#infodiv { + position: absolute; + right: 12%; + width: 16%; + top: 36%; + background: #eef linear-gradient(to right, #fafaff, #eef); + background-size: auto 100%, 100% 100%; + box-shadow: inset 0 0 0 1px #fff; + filter: drop-shadow(0 0 1px #ccf); +} + +#bandwidthconfig { + border: 1px solid #7778bf; +} + +#bandwidthconfig.configtable.wizard { + width: 35%; + top: 36%; + left: 31%; + position: absolute; + background: none; + font-size: larger; +} + +.configtable.wizard { + width: 20%; + bottom: 5rem; + right: 10rem; + position: absolute; + box-shadow: none !important; + white-space: normal; + background: none; + font-size: larger; +} + #bandwidthconfig td:first-child { width: 200px; white-space: nowrap; @@ -2557,6 +2635,44 @@ td { #bandwidthconfig td:last-child { white-space: normal; + background: none; + font-size: larger; +} + +#bandwidthconfig.configtable td { + white-space: normal; + background: none; + font-size: larger; +} + +#bandwidthconfig.configtable.wizard td { + white-space: normal; + background: none; + font-size: small; +} + +#xhr.notification { + width: 30%; + position: absolute; + left: 30%; + top: 38%; + font-size: larger; + background: #eef; + box-shadow: inset 0 0 0 1px #fff; + filter: drop-shadow(0 0 1px #ccf); +} + +#xhr2.notification { + width: 30%; + position: absolute; + left: 30%; + top: 40%; + font-size: larger; + background: #eef; + background: linear-gradient(to right, #fafaff, #eef); + background-size: auto 100%, 100% 100%; + box-shadow: inset 0 0 0 1px #fff; + filter: drop-shadow(0 0 1px #ccf); } /* begin home page */ @@ -3758,6 +3874,7 @@ button:active, input[type="submit"]:active, input[type="reset"]:active { input.accept, button.accept { background: url(/themes/console/images/buttons/yes.png) no-repeat 6px center, linear-gradient(to bottom, #fff, #efefff); padding: 5px 7px 5px 22px; + font-size: large; } input.accept:hover, button.accept:hover, input.accept:focus, button.accept:focus { @@ -3797,6 +3914,7 @@ input.accept[value^="Filter"]:focus, button.accept[value^="Filter"]:focus { input.add, button.add { background: url(/themes/console/images/buttons/add.png) no-repeat 6px center, linear-gradient(to bottom, #fff, #efefff); padding: 5px 7px 5px 22px; + font-size: large; } input.add:hover, button.add:hover, @@ -3817,6 +3935,7 @@ input.add[value^="Adjust"]:focus, button.add[value^="Adjust"]:focus { input.cancel, button.cancel { background: url(/themes/console/images/buttons/no.png) no-repeat 6px center, linear-gradient(to bottom, #fff, #efefff); padding: 5px 7px 5px 22px; + font-size: large; } input.cancel:hover, button.cancel:hover, @@ -3873,6 +3992,7 @@ input.check[value$="updates"]:focus, button.check[value$="updates"]:focus { input.delete, button.delete { background: url(/themes/console/images/buttons/delete.png) no-repeat 6px center, linear-gradient(to bottom, #fff, #efefff); padding: 5px 7px 5px 22px; + font-size: large; } input.delete:hover, button.delete:hover, @@ -3893,6 +4013,7 @@ input.delete[value^="Ban"]:focus, button.delete[value^="Ban"]:focus { input.download, button.download { background: url(/themes/console/images/buttons/download.png) no-repeat 6px center, linear-gradient(to bottom, #fff, #efefff); padding: 5px 7px 5px 22px; + font-size: large; } input.download:hover, button.download:hover, @@ -3936,6 +4057,7 @@ input.download[value^="Dump"]:focus, button.download[value^="Dump"]:focus { input.go, button.go, input[value="GO"] { background: url(/themes/console/images/buttons/go.png) no-repeat 6px center, linear-gradient(to bottom, #fff, #efefff); padding: 5px 7px 5px 22px; + font-size: large; } input.go:hover, button.go:hover, input[value="GO"]:hover, @@ -3966,6 +4088,7 @@ input.back:focus { input.reload, button.reload { background: url(/themes/console/images/buttons/restore.png) no-repeat 6px center, linear-gradient(to bottom, #fff, #efefff); padding: 5px 7px 5px 22px; + font-size: large; } input.reload:hover, button.reload:hover, @@ -4595,13 +4718,20 @@ body.iframed { /* Theme choice & Language selection in /configui */ -#themeui.formaction, #langui.formaction { +#themeui.formaction { border: none; border-top: 1px solid #7778bf; background: none; margin: 5px -5px 0; } +#langui.formaction { + border: none; + border-top: 1px solid #7778bf; + background: none; + margin: 5px 0 0; +} + #consolepass.formaction { margin-top: -6px; margin-bottom: -3px; @@ -4704,8 +4834,8 @@ body.iframed { p#helptranslate { position: relative; top: 4px; - padding: 15px 10px 15px 50px !important; text-align: left !important; + padding: 15px 10px 15px 50px !important; border-top: 1px solid #7778bf; background: url(/themes/console/images/info/notice.png) left 14px center no-repeat, #fff; background: url(/themes/console/images/info/notice.png) left 14px center no-repeat, linear-gradient(135deg, #fafaff, #f8f8ff); @@ -4771,34 +4901,87 @@ div#themesettings { background: repeating-linear-gradient(135deg, rgba(255,255,255,0.5) 2px, rgba(248, 248, 255, 0.3) 3px, #fafaff 5px); } -div#langsettings { +select#langsettings { padding: 4px 5px 0; - border: 1px solid #7778bf; - margin: -16px 0 0; - background: #fafaff; - background: repeating-linear-gradient(135deg, rgba(255,255,255,0.5) 2px, rgba(248, 248, 255, 0.3) 3px, #fafaff 5px); + font-size: large; + height: 3rem; + width: 15rem; +} + +div#langsettings { + border: 1px solid #7778bf; +} + +div#wizlangsettings.wizard { + position: absolute; + left: 15rem; + bottom: 10rem; } #themesettings hr, #langsettings hr { display: none; } +img.wizard.progress { + position: absolute; + top: 2%; + left: 0%; + width: 31%; + max-width: 31%; + mix-blend-mode: multiply; +} + +.wizard { + border: none !important; + background: none !important; + box-shadow: none !important; + border-top: none !important; +} + +#bwconfigheader { + background: white; +} + +.wizardtext { + width: 25%; + position: absolute; + top: 36%; + left: 5%; + font-size: larger; +} + +#wizard { + z-index: -1; + position: absolute; + left: 0px; + top: 0px; + height: 100%; + width: 100%; + background-color: #f8f9fa; +} + .langselect { /* containing box for lang selection */ - width: 115px; + width: 40%; min-height: 64px; float: left; margin: 4px; text-align: center; - border: 1px solid #7778bf; padding: 4px 4px 0; - border-radius: 2px; - background: #fff; - background: linear-gradient(to bottom, #fff, #ddf); + background-color: white; + border: none; + float: left; + margin-left: 15%; transition: transform 0.3s ease 0s; - box-shadow: inset 0 0 0 1px #fff; filter: drop-shadow(0 0 1px #ccf); } +.wizardimg { + max-width: 100%; + max-height: 100vh; + margin: auto; + mix-blend-mode: multiply; +} + .langselect:hover { border: 1px solid #f60; background: #fff; @@ -4964,7 +5147,6 @@ p#helptranslate { clear: both; padding: 5px 10px 10px; text-align: right; - margin: 0 -5px; } /* configui password*/