openwrt/luci
1
0
Fork 0
mirror of https://github.com/openwrt/luci.git synced 2026-04-15 10:51:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

luci-theme-openwrt-2020: refining hide/show buttons

Browse Source 
Create larger buttons for smaller
screens (same behaviour as
luci-theme-bootstrap).
Swap the "hide" and "show" button
styles to match all other luci-theme,
as "hide" is currently using primary
style and "show" is currently using
secondary style. Also, change mouse
icon from text cursor to pointer.
Slightly fade "show" button:
no variable for disabled opacity
like luci-theme-bootstrap,
assuming 0.7.
Remove fade when hovered.

Signed-off-by: Joshua Criss <owlsy@outlook.com.au>
This commit is contained in:
Joshua Criss
2026-04-02 15:42:08 +11:00
committed by Paul Donald
parent ec33f41105
commit d90696cca7
1 changed files with 35 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css
View File

@@ -2015,3 +2015,38 @@ ul.errors {
display: none;
}
}
/* === STATUS OVERVIEW: HIDE/SHOW BUTTONS === */
/* Create larger buttons for smaller screens (same behaviour as luci-theme-bootstrap) */
@media screen and (max-width: 480px) {
body[data-page='admin-status-overview'] h3, .cbi-section > legend:first-child {
line-height: 2em;
}
}
/* Swap the "hide" and "show" button styles to match all other luci-theme, as "hide" is currently using primary style and "show" is currently using secondary style. Also, change mouse icon from text cursor to pointer */
body[data-page='admin-status-overview'] .cbi-title .label.notice {
background: var(--main-bright-color);
color: var(--secondary-bright-color);
border: 0;
}
body[data-page='admin-status-overview'] .cbi-title .label {
background: var(--secondary-bright-color);
color: var(--main-bright-color);
border: 1px solid var(--main-bright-color);
opacity: 1;
cursor: pointer;
}
/* Slightly fade "show" button: no variable for disabled opacity like luci-theme-bootstrap, assuming 0.7 */
body[data-page='admin-status-overview'] .cbi-title .label.notice {
opacity: 0.7;
}
/* Remove fade when hovered */
body[data-page='admin-status-overview'] .cbi-title .label.notice:hover {
opacity: initial;
}
/* === END STATUS OVERVIEW: HIDE/SHOW BUTTONS === */