[luci] Bootstrap theme for LuCI

Wed Feb 8 19:46:23 CET 2012

Hi

Now its fine with this patch.
http://luci.subsignal.org/trac/changeset/8222
@Jow is it OK?

with bootstrap theme
http://twitpic.com/8hbzi7

with openwrt theme
http://twitpic.com/8hc0m0

Gruss
                   Pat

Am 06.02.2012 um 07:30 schrieb David Menting | Nut & Bolt:

> 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

-------------- n?chster Teil --------------
Ein Dateianhang mit Binärdaten wurde abgetrennt...
Dateiname   : PGP.sig
Dateityp    : application/pgp-signature
Dateigröße  : 243 bytes
Beschreibung: Signierter Teil der Nachricht
URL         : <http://lists.subsignal.org/pipermail/luci/attachments/20120208/e246e28c/attachment.pgp>