Commit graph

648 commits

Author SHA1 Message Date
Jo-Philipp Wich
e496014760 luci-theme-material: convert Lua templates to ucode
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2022-10-25 01:03:37 +02:00
Jo-Philipp Wich
2e3282e624 luci-theme-bootstrap: translate Lua templates to ucode equivalents
Add ucode template equivalents for the Lua templates used by the theme.

Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2022-10-25 01:03:37 +02:00
Viktor Tsvetkov
3e9d9a9dbb sysauth: add autocomplete and id attributes to login inputs
this let browser automatically fill according to HTML spec for input elements.
luci-theme-bootstrap and luci-base are affected.

Signed-off-by: Viktor Tsvetkov <zwetvik@gmail.com>
[indentation fix]
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2022-10-15 14:31:47 +02:00
Rosen Penev
5466452399 luci-theme-openwrt-2020: quantize png image
Small size reduction.

From: 5908
To:   3896

Signed-off-by: Rosen Penev <rosenp@gmail.com>
2022-10-14 13:25:24 -07:00
Rosen Penev
28193247bc luci-theme-openwrt-2020: add iOS webapp support
This way instead of opening a Safari tab, it opens in its own instance.

Signed-off-by: Rosen Penev <rosenp@gmail.com>
2022-10-11 14:50:40 -07:00
Rosen Penev
1be885064e luci-theme-openwrt-2020: add iOS icon support
Used when adding LuCI to Springboard. Image generated from logo.svg.

Signed-off-by: Rosen Penev <rosenp@gmail.com>
2022-10-11 14:48:54 -07:00
INAGAKI Hiroshi
2a55839363 luci-theme-material: fix typo in recovery mode message
Fix the message from "Sytem" to "System" and merge with the existing
message on the other themes.

Signed-off-by: INAGAKI Hiroshi <musashino.open@gmail.com>
2022-07-27 11:21:54 +09:00
y04
5a3cc88a67
luci-theme-openwrt: optimized image filesize
Optimized PNG filesize from 152 to 80 bytes without any quality loss.

Signed-off-by: Alexander Semukhin <semukhin@mail.com>
2022-06-25 01:44:22 +02:00
y04
ec8bdab76c
luci-theme-material: optimized image filesize
Optimized PNG filesize from 6280 to 3939 bytes. Visually looks the same, technically the image is 99.9% identical.

Signed-off-by: Alexander Semukhin <semukhin@mail.com>
2022-06-25 01:43:23 +02:00
y04
d4c4afeabc
luci-theme-bootstrap: optimized favicon filesize
Optimized PNG filesize from 733 to 592 bytes without any quality loss.

Signed-off-by: Alexander Semukhin <semukhin@mail.com>
2022-06-25 01:42:30 +02:00
Quentin Baker
4ee2bc644a luci-theme-material: CSS Fix for previous update
Commit b0f13ef Changed the color of a CSS element from a bright blue to
a dark blue. This resulted in a modal with difficult-to-read text (black
text on dark blue).

This commit sets the modal text-color to #000, in line with style
guidelines.

Signed-off-by: Quentin Baker <opensource@quentb.com>
2022-06-17 00:02:09 -04:00
Quentin Baker
b0f13efa9c luci-theme-material: Update brand logo/colors
I have updated the brand.png logo to the 2020 version, and I have
made a small adjustment to the CSS to reflect its slightly larger
vertical height.

I also have made small tweaks to the system theme colors to use
the brand colors as recommended on page 5 of the logo usage
guidelines document avalible at
openwrt/branding/blob/master/openwrt-styleguide.pdf

Signed-off-by: Quentin Baker <opensource@quentb.com>
2022-06-05 21:46:27 -04:00
Jo-Philipp Wich
c19020b2a4 luci-theme-bootstrap: various style tweaks
- Make control-group containers flex and ensure proper spacing between
   elements, fixes e.g. unwanted break for reveal/hide password button
   on narrow mobile views

 - Decrease top margin of modal popups

 - Fix displaying cell titles on mobile wrapped table rows

 - Tune mobile flex table styles

Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2022-05-17 15:09:25 +02:00
Jo-Philipp Wich
56fab648ca luci-theme-bootstrap: restore initramfs warning
Restore accidentally removed the initramfs boot warning banner.

Ref: 8055acc9be (commitcomment-73447330)
Fixes: 8055acc9be ("luci-theme-bootstrap: overhaul styles")
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2022-05-16 11:47:00 +02:00
Jo-Philipp Wich
f1fd03ddb3
Merge pull request #5798 from McGiverGim/add_gap_badge
luci-material-theme: replace margin by gap in ifacebadge
2022-05-06 13:45:21 +02:00
Jo-Philipp Wich
c40dd71b84 luci-theme-bootstrap: use medium dark text color for version footer
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2022-05-06 13:42:54 +02:00
Miguel Angel Mulero Martinez
1cd615787a luci-material-theme: replace margin by gap in ifacebadge
Material is a "flex" theme. Better to use "gap" in place of "margin" to
add some space between elements inside "flex" elements.

This fixes the problem specially when there are text elements inside the
"flex" and don't hurt when there are images.

Signed-off-by: Miguel Angel Mulero Martinez <migmul@gmail.com>
2022-05-04 10:53:35 +02:00
Jo-Philipp Wich
a000cf9c01
Merge pull request #5794 from McGiverGim/material_align_button_text_center
luci-material-theme: align text buttons center
2022-05-02 10:37:15 +02:00
Miguel Angel Mulero Martinez
56aeaa8ac8 luci-material-theme: fix localizated left menu
The latest fix to fix the logout worked, but it was not applied to all
the resolutions, and I have observed the same problem exists for the
dasboard optional component.
Looking at the code, it seems only the components without submenu, have the
data-title element, so this fix modifies the style for all of them, not
relying on the position or text content.

Signed-off-by: Miguel Angel Mulero Martinez <migmul@gmail.com>
2022-05-02 09:47:36 +02:00
Miguel Angel Mulero Martinez
9e73a04adb luci-material-theme: align text buttons center
The text inside the buttons is aligned to the top. This change mades
it aligned to the center.

Signed-off-by: Miguel Angel Mulero Martinez <migmul@gmail.com>
2022-05-01 09:23:04 +02:00
Jo-Philipp Wich
0a8bf7583e
Merge pull request #5791 from McGiverGim/fix_td_align
luci-material-theme: align td text width 33%
2022-04-30 15:35:06 +02:00
Jo-Philipp Wich
0a49bbe87f
Merge pull request #5792 from McGiverGim/controlgroup_flex
luci-material-theme: make control-group flex
2022-04-30 15:34:41 +02:00
Miguel Angel Mulero Martinez
17ddeb7b57 luci-material-theme: make control-group flex
The control-group div does not flex. The buttons overflow the screen.

This change mades them flex.

Signed-off-by: Miguel Angel Mulero Martinez <migmul@gmail.com>
2022-04-30 10:37:08 +02:00
Miguel Angel Mulero Martinez
3333fd6695 luci-material-theme: align td text width 33%
The CSS applies a different padding for td elements with 33% width. This
misaligns the text from this td to the others td.

This change modifies the CSS to apply the same padding to all of the
sibling td.

Signed-off-by: Miguel Angel Mulero Martinez <migmul@gmail.com>
2022-04-30 09:57:02 +02:00
Miguel Angel Mulero Martinez
f8e52aa85d luci-material-theme: adjust data-title for logout
The data-title attribute style depends on the content in the css rule.
When translated to other language, the css rule fails.
This change uses the position and not the content to apply the style.

Signed-off-by: Miguel Angel Mulero Martinez <migmul@gmail.com>
2022-04-30 09:15:40 +02:00
Miguel Angel Mulero Martinez
d452dee8ce Revert "luci-material-theme: reduce size of logout icon"
This reverts commit 3758ab9479.

The solution is not good. It breaks in some way the English UI to fix
localizated UI.

It will be fixed again in other commit.

Signed-off-by: Miguel Angel Mulero Martinez <migmul@gmail.com>
2022-04-30 09:13:32 +02:00
Jo-Philipp Wich
5ccef2421b
Merge pull request #5788 from McGiverGim/fix_logout_icon_material_theme
luci-material-theme: reduce size of logout icon
2022-04-29 19:58:50 +02:00
Miguel Angel Mulero Martinez
3758ab9479 luci-material-theme: reduce size of logout icon
The icon of the logout option overflows the text. This reduces the size of the icon to not overflow.

Signed-off-by: Miguel Angel Mulero <mcgivergim@gmail.com>
2022-04-29 16:55:21 +02:00
Miguel Angel Mulero Martinez
35fb253adb luci-theme-material: fix size of progressbar text
The text of the progressbar is bigger than the progressbar height. This removes the font-size element that produced that.

Signed-off-by: Miguel Angel Mulero <mcgivergim@gmail.com>
2022-04-29 16:32:58 +02:00
Jo-Philipp Wich
8e09f1833b luci-theme-bootstrap: fix incorrect wrap arounds in nested cbi sections
Fixes: #5743
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2022-03-25 11:49:57 +01:00
Jo-Philipp Wich
06b351722e luci-theme-bootstrap: add table column sort indicators
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2022-02-24 23:45:18 +01:00
Jo-Philipp Wich
edbde448b8 luci-theme-bootstrap: fix display glitch with combo buttons in row actions
Fixes: #5693
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2022-02-21 23:42:16 +01:00
Jo-Philipp Wich
6a60d2434e luci-theme-bootstrap: fix translation for username and password captions
Fixes: c81b09ec3d ("luci-theme-bootstrap: simplify login dialog")
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-12-21 09:57:33 +01:00
Jo-Philipp Wich
c81b09ec3d luci-theme-bootstrap: simplify login dialog
Use an traditional HTML form with post submit action to the same URL in
order to simplify the login process and not rely on the discarded login
XHR reply properly setting the login cookie.

This will also avoid one useless request on login and hopefully fix login
issues reported with various browser environments.

As a bonus, the resulting code is somewhat smaller as well.

Ref: https://forum.openwrt.org/t/login-does-not-work/113360
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-12-09 19:52:48 +01:00
Sergey V. Lobanov
13949cb887 luci-theme-openwrt-2020: fix font issue when mixing latin and non-latin symbols
The GalanoGrotesque font used by the openwrt2020 theme does not support non-
latin symbols.

If latin and non-latin symbols are used together in one line it looks strange
because for latin symbols GalanoGrotesque is used but for non-latin symbols a
fallback font is used (sans-serif).

This patch changes default font to Helvetica for the "bg", "ru", "uk", "el"
and "he" locales.

Original patch was written by Jo-Philipp Wich

Fixes: #5580
Signed-off-by: Sergey V. Lobanov <sergey@lobanov.in>
[reword commit message, drop "de" from exception list]
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-12-09 17:03:25 +01:00
Jo-Philipp Wich
1a9afa2a90 luci-theme-bootstrap: add bottom margin to log views
Prevent the log output textareas to touch the footer border.

Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-12-01 15:09:44 +01:00
Jo-Philipp Wich
e0888d70a9 luci-theme-bootstrap: prevent hiding header bar on long vertical scrolls
Ref: b11a7d8e49 (commitcomment-60968071)
Fixes: 8055acc9be ("luci-theme-bootstrap: overhaul styles")
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-11-27 19:50:27 +01:00
Jo-Philipp Wich
b11a7d8e49 luci-theme-bootstrap: various style corrections
- Add proper top and bottom margin for tab descriptions
 - Allow flex wrapping for cbi-value rows
 - Ensure that nested table/grid sections always take the full width
 - Make table/grid section row action buttons are as narrow as possible

Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-11-22 09:43:12 +01:00
Jo-Philipp Wich
4720a025e8 luci-theme-bootstrap: fix cbi-value caption alignment
Since the removal of the clearfix styles, overlong captions will displace
subsequent input field rows.

Fix the issue by replace floating label + field margin with flexbox styles.

Fixes: #5535
Fixes: 8055acc9be ("luci-theme-bootstrap: overhaul styles")
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-11-21 23:03:49 +01:00
Jo-Philipp Wich
6f4708ca68 luci-theme-bootstrap: fix inner border radius in ifaceboxes, progressbars
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-11-21 18:53:59 +01:00
Jo-Philipp Wich
7f26e86a9f luci-theme-bootstrap: hide scrollbars in modal overlay
Only enable scrollbars if content overflows.

Fixes: #5505
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-11-18 11:27:36 +01:00
Jo-Philipp Wich
00dc07bb84 luci-theme-bootstrap: further uci changelog style fixes
- Use the proper dialog class name to apply changelog styles
 - Darken grey background and borders

Fixes: 5bd111f58f ("luci-theme-bootstrap: fix uci changelog and readonly input styles")
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-11-17 13:12:09 +01:00
Jo-Philipp Wich
5bd111f58f luci-theme-bootstrap: fix uci changelog and readonly input styles
- Rework uci changelog styling rules to work with unmodified markup
 - Drop redundant readonly input styles, don't fade readonly input texts

Fixes: 8055acc9be ("luci-theme-bootstrap: overhaul styles")
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-11-17 00:34:54 +01:00
Jo-Philipp Wich
0bc09cc749 luci-theme-bootstrap: don't overwrite theme selection upon install
Revert to the previous uci-defaults behaviour of only setting the
selected theme to Bootstrap if the Bootstrap entry didn't exist yet
in the configuration.

Ref: https://forum.openwrt.org/t/luci-theme-behaviour-change/112047
Fixes: ed86f03a9f ("luci-theme-bootstrap: add explicit dark/light mode selection")
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-11-16 13:19:29 +01:00
Jo-Philipp Wich
8055acc9be luci-theme-bootstrap: overhaul styles
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-11-16 13:06:04 +01:00
Jo-Philipp Wich
f16a2f3fba luci-theme-bootstrap: light/dark mode releated CSS fixes
- Fix progress bar shadow in light mode
 - Fix color schema preference in light and dark modes

Fixes: #5498
Fixes: #5499
Fixes: ed86f03a9f ("luci-theme-bootstrap: add explicit dark/light mode selection")
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-11-08 09:58:36 +01:00
Jo-Philipp Wich
ed86f03a9f luci-theme-bootstrap: add explicit dark/light mode selection
Register two further "virtual" themes called BootstrapDark and
BootstrapLight which force dark and light mode respectively.

The actual Bootstrap theme itself will continue to auto-select
dark mode preference based on OS/Browser preference settings.

Fixes: #5492
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-11-07 11:06:33 +01:00
Jo-Philipp Wich
37e40e04ef luci-theme-bootstrap: work around csstidy bug
Ref: 26047fb967 (commitcomment-58638390)
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-10-25 23:59:02 +02:00
Paul Dee
d1035c1f69 luci-theme-bootstrap: fix overlay display failures
Fixed overlay display failures for users on mobile, or users who booted
up in safe mode XD. Noticeable when vertical or horizontal real-estate
is too small for the displayed overlay.

This failure is most evident when you "edit" an interface, or display
your unsaved changes.

When content is wider than the screen view, the table hugs the (widest)
content maximally, and the overlay window becomes scrollable.

Disabled -webkit-overflow-scrolling, left, and right, because both FF
and Safari disable them as invalid anyway.

Signed-off-by: Paul Dee <systemcrash@users.noreply.github.com>
[Merge duplicate modal declarations, remove not applicable modal
 flexbox properties]
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-10-25 20:55:10 +02:00
Jo-Philipp Wich
8fc78a26da luci-theme-bootstrap: fix header width
Fixes: 588e24f9ca ("luci-theme-bootstrap: various tweaks and cleanups")
Ref: 588e24f9ca (r58625289)
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
2021-10-25 19:39:47 +02:00