[luci] Bootstrap theme for LuCI

Victor Hooi victorhooi at yahoo.com
Mon Feb 6 13:44:44 CET 2012


heya,

This is awesome =).

Just thought I'd add my voice behind it - I'd love to see this integrated
into Luci proper.

Cheers,
Victor

On Mon, Feb 6, 2012 at 17:30, David Menting | Nut & Bolt
<david at nut-bolt.nl>wrote:

> Hi Patrick,
>
> I cannot reproduce your layout glitches (but I do not have a running OLSR
> configuration - unconfigured it looks fine). I'm not going to include the
> patch because it influences the other pages as well, but you can add a
> page-specific override at the bottom of the css as follows:
>
> .OLSR label,
> .Neighbours label,
> .HNA label,
> .Routes label {
> padding-top: 0;
> text-align: left;
> }
>
> Just have a look at the source to see which class the <body> has and add
> the corresponding lines.
>
>  David Menting | Nut & Bolt
>
> On 6 feb. 2012, at 01:40, Patrick Grimm wrote:
>
> Hi David
> Nice Work! :-)
>
> I have test it.
> The olsr stat page need to be fixt.
> http://twitpic.com/8gafmh
> with this patch it is a little bit better.
> http://twitpic.com/8gag0b
>
> diff --git a/files/htdocs/cascade.css b/files/htdocs/cascade.css
> index 31a4aa1..81c56a6 100644
> --- a/files/htdocs/cascade.css
> +++ b/files/htdocs/cascade.css
> @@ -412,12 +412,11 @@ textarea {
>   line-height: normal;
> }
> label {
> -  padding-top: 6px;
>   font-size: 13px;
>   line-height: 18px;
>   float: left;
>   width: 130px;
> -  text-align: right;
> +  text-align: left;
>   color: #404040;
> }
> form .input,
>
> Am 05.02.2012 um 15:34 schrieb David Menting | Nut & Bolt:
>
> Hi Jo-Philipp,
>
>
> I've fixed most of the issues. The theme now works nicely for all modules
> that are currently active on my device. If you find glitches in other
> modules please let me know so I can fix them.
>
>
> The cascade.css contains an adapted subset of styles from Twitter
> Bootstrap. At the bottom of the file you will find LuCI-specific fixes.
>
>
> It would be great if you could include it in the development branch.
> Sources can be found at https://github.com/Nut-Bolt/luci-theme-bootstrap
>
>
> Thanks!
>
>
> David Menting | Nut & Bolt
>
>
>
> On 3 feb. 2012, at 14:20, Jo-Philipp Wich wrote:
>
>
> Hi David.
>
>
> I've created a new theme for LuCI. It's clean, modern and based on
>
> Twitter Bootstrap. It's been tested on a TP-Link WR1043n and a Carambola
>
> under Firefox, Safari and IE8. The responses so far are quite positive,
>
> so if anyone feels like it it would be great to include it in the
>
> development repository.
>
>
> It looks great indeed! I just tried it on a 10.03.1 release.
>
> I could imagine this being the new default theme for the next release :)
>
>
> Unfortunately it breaks in various places but I can understand that its
>
> not up to the theme to fixup underlying HTML deficiencies, this must be
>
> sorted out separately.
>
>
> One thing I noticed is that it seems to use fixed (or minimal width?)
>
> table cells which introduces horizontal scrolling various places, e.g.
>
> the VLAN setup. Is this an inherent property of the bootstrap framework
>
> or a deliberate choice in the CSS? I haven't looked into the styling
>
> rules yet.
>
>
> Thanks for your contribution, very appreciated!
>
>
> Regards,
>
> Jow
>
> _______________________________________________
>
> luci mailing list
>
> luci at lists.subsignal.org
>
> https://lists.subsignal.org/mailman/listinfo/luci
>
>
> _______________________________________________
>
> luci mailing list
>
> luci at lists.subsignal.org
>
> https://lists.subsignal.org/mailman/listinfo/luci
>
>
> _______________________________________________
> luci mailing list
> luci at lists.subsignal.org
> https://lists.subsignal.org/mailman/listinfo/luci
>
>
>
> _______________________________________________
> luci mailing list
> luci at lists.subsignal.org
> https://lists.subsignal.org/mailman/listinfo/luci
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.subsignal.org/pipermail/luci/attachments/20120206/4af7af38/attachment-0001.html>


More information about the luci mailing list