Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

luci-theme-openwrt-2020: button rendering (wireguard/ advanced-reboot)

See original GitHub issue

Using current OpenWrt/ master on ipq806x/ nbg6817 (also seen on ipq40xx/ map-ac2200)

master/r12964-35f208da3c
src-git packages https://git.openwrt.org/feed/packages.git^a4d19d8
src-git luci https://git.openwrt.org/project/luci.git^d0daa2c
src-git routing https://git.openwrt.org/feed/routing.git^f71d733
src-git telephony https://git.openwrt.org/feed/telephony.git^bf49bc5

I notice a strange rendering for the buttons used in luci-app-wireguard and luci-app-advanced-reboot, all other buttons I’ve seen so far seem to work fine - and it’s working nicely using luci-theme-bootstrap.

Screenshot_2020-04-14 nbg6817 - Advanced Reboot - LuCI


<div class="cbi-section"><h3>Interface wg0</h3>
	<div class="cbi-value" id="button" style="padding: 5px">
		<input class="cbi-button cbi-button-apply" type="button" name="qrcode_wg0" value="Show/Hide QR-Code" onclick="toggle_qrcode(this)" />
	</div><div class="cbi-section-node">

Screenshot_2020-04-14 nbg6817 - WireGuard Status - LuCI

			<div class="td"><form method="post" action="/cgi-bin/luci/admin/system/advanced_reboot/alternative_reboot">
				<input type="hidden" name="token" value="XXX" />
				<input id="altreboot-button" type="submit" class="cbi-button cbi-button-apply important" value="Reboot to alternative partition..." />
			</form></div>

			<div class="td"><form method="post" action="/cgi-bin/luci/admin/system/advanced_reboot/reboot">
						<input type="hidden" name="token" value="XXX" />
						<input id="reboot-button" type="submit" class="cbi-button cbi-button-apply important" value="Reboot to current partition" />
					</form></div>

</fieldset><hr /><form method="post" action="/cgi-bin/luci/admin/system/advanced_reboot/power_off">
	<input type="hidden" name="token" value="XXX" />
	<input id="poweroff-button" type="submit" class="cbi-button cbi-button-apply important" value="Perform power off..." />
</form>

The attached images have been made from firefox 74/ linux, but I’m seeing the same with chromium 81/ linux.

Issue Analytics

State:
Created 3 years ago
Comments:14 (12 by maintainers)

Top GitHub Comments

2reactions

jow-commented, Feb 9, 2021

LuCI base is transitioning towards using <button> elements and providing an additional .btn CSS class to style <input> elements like buttons. Ideally - where possible - apps should replace <input class="btn cbi-button" value="Label" ...> with just <button ...>Label</button>. In cases where this is not feasible (e.g. non-JS legacy CBI forms where you need actual submit buttons) a simple class="btn" should be sufficient.

2reactions

stangricommented, Feb 8, 2021

@feckert @pkgadd @cybrnook sorry it disappeared from my radar last year. Most of my luci apps are fixed, VPR is pending merge of the principal package.

Top Results From Across the Web

[OpenWrt Wiki] WireGuard extras

Navigate to LuCI → Status → WireGuard to view WireGuard status. Dynamic connection. Preserve default route to restore WAN connectivity when ...

OpenWrt 22.03.0-rc5 fifth release candidate

Hi, The OpenWrt community is proud to announce the fifth release candidate of the upcoming OpenWrt 22.03 stable version series.

Belkin RT3200/Linksys E8450 WiFi AX discussion

I use: a) WireGuard; b) adaptive bandwidth CAKE on LTE connection notwithstanding VPN PBR; c) WDS extended WiFi and separate WDS extended Guest- ......

Wireguard GUI in LuCI buggy? - Installing and Using OpenWrt

After reboot, all hell broke loose as all the peers are configured with the interface at the same time. One invalid public key...

Openwrt theme - SFSHOP

None of the other themes do luci-theme-openwrt-2020: button rendering (wireguard/ advanced-reboot). To make your theme OpenWrt-capable and selectable on the ...