follow-up to 3c3a5e2b1a
Retain original monospace properties since those are handled by the system
anyway.
Signed-off-by: Paul Donald <newtwen+github@gmail.com>
Replace hardcoded font-family declarations with CSS custom properties
(--font-sans, --font-serif, --font-mono) that fall back to system UI fonts.
Signed-off-by: Akihiro Nagai <bashing.tremors_0f@icloud.com>
Disable Dark Deader since the bootstap theme has built-in
dark and light modes, as well as a mode which auto-detects
the user's preference. Dark Reader also doesn't work well
with the bootstrap theme.
Signed-off-by: Mikael Magnusson <mikma@users.sourceforge.net>
Replaced L.bind with arrow functions, used Array.from for array conversion,
applied concise method syntax, and switched to block-scoped declarations.
Signed-off-by: Eamon Xiong <eamonxiong@gmail.com>
follow-up to 788e47034b
Some of the CSS changes have knock-on effects and change behaviour in
other display areas, especially when the CSS is minified.
Simplified to change between label flavours on hide/show status.
Signed-off-by: Paul Donald <newtwen+github@gmail.com>
Add support to show/hide index cards. A card's state is saved using the
browser localstorage and its state is restored on page reload/relogin.
Rework the pool function to check and skip loading of hidden cards.
Rework themes to address new button position.
Signed-off-by: Christian Marangi <ansuelsmth@gmail.com>
[ changed tabs in CSS ]
Signed-off-by: Paul Donald <newtwen+github@gmail.com>
Many LuCI icons doubled in size during migration to vector graphics
in commit ae5d91da90 (16px to 32px).
Sizing of their instances is mostly controlled by CSS, but there's
an exception - network interface boxes of "Interfaces" page in LuCI.
Current CSS doesn't specify any particular size requirements to follow,
so the icons just scale with the images served, thus effectively
doubling in width and height compared to state before the vectorization
commit. Such a big icons look odd and take up too much space, especially
for bridge interfaces with many ports.
Instead of reverting to the original 16×16px, this commit proposes
compromise of 24×24px as most of other icons within LuCI became a bit
bigger as well.
Signed-off-by: Dávid Benko <davidbenko@davidbenko.dev>
Instead of enumerating each SVG graph that the dark mode is applicable to,
apply --background-color-high to each SVG element that is a child of
<div style="…"> and --text-color-highest to each LINE inside such SVG.
This allows dark mode to work in all SVG widgets by default, in any
current or future LuCI component.
Signed-off-by: Marko Mäkelä <marko.makela@iki.fi>
Clear, crisp, resolution independent vector graphics replace the trusty
microscopic PNG. Some minor CSS changes were needed to constrain images
in some locations to make sure they don't consume too much space.
Iconography taken from Mate desktop theme with minor adjustments:
https://github.com/mate-desktop/mate-icon-theme/
Signed-off-by: Paul Donald <newtwen+github@gmail.com>
Implement a dynamic menu item width to allow item unwrapped and visible:
'min-width: max-content;' or 'max-width: max-content;'
Remove IE hacks and fix a console error for -webkit-scrollbar-thumb
Signed-off-by: Paul Donald <newtwen+github@gmail.com>
In CSS, the flex-wrap property is used in a flex container to control
how flex items are laid out when there is not enough space in a single
line.
If a modal is displayed on small screens, the buttons are not wrapped. They
remain on one line. This breaks the layout and does not look good.
Signed-off-by: Florian Eckert <fe@dev.tdt.de>
first-child:
Selects an element that is the first child of its parent. The element must
be the very first child of its parent, regardless of its type.
first-of-type:
Selects the first element of its type among its siblings. The element must
be the first of its type (e.g., <p>, <div>, etc.) within its parent, but it
does *not* have to be the first child.
Makes the CSS usage more robust if the layout changes and new html elements
are added.
Signed-off-by: Florian Eckert <fe@dev.tdt.de>
Upstream color is defined as #808080, so for better distinction the
color is changed to var(--white-color).
Signed-off-by: Christian Korber <ck@dev.tdt.de>
Replace all calc() doing maths on compatible numbers with their final values (to 2 decimal points).
Signed-off-by: Griffen Edge <griffen@griffenedge.com>
Convert the theme's Lua templates to ucode to avoid the implicit dependency
on the luci-lua-runtime package.
Signed-off-by: Jo-Philipp Wich <jo@mein.io>
This fixes the graphs after extra divs were added.
Signed-off-by: James Lindstrom <jameslindstrom2@gmail.com>
* Customize commit message
Signed-off-by: Florian Eckert <fe@dev.tdt.de>
This note is also not displayed in the theme luci-theme-boostrap. Also, for
security reasons, we should not explicitly point this out on the login page,
that no password is set.
Signed-off-by: Florian Eckert <fe@dev.tdt.de>
The current implementation made the commands from the app luci-app-commands absolutely positioned which resulted in hiding elements which was underneath it, ie. the buttons. This implementation removes the absolutely positioned behavior making the buttons visible again and as an upside aligns it with how the Bootstrap theme handles commands.
Signed-off-by: Daniel Nilsson <daniel.nilsson94@outlook.com>
Partially reverts 2bdabf14c30320ef0433828b1a080f6b8fe9c430 by adding back the deleted color variables as the custom.css was used by users to override the theme with their own colors. To maintain backwards compatibility with users we should not remove/rename these as it will result in colors being applied incorrectly.
Signed-off-by: Daniel Nilsson <daniel.nilsson94@outlook.com>
Fine tuning #6991
Bugfix for the wireless graphs, reorder everything to the same level
as displayed in the menu and make the spaces even.
Signed-off-by: Thomas Schröder <tschroeder_github@outlook.com>
