pfSense » Bootstrap

No problem. I have attached a screen shot of the the OpenVPN widget on my home pfSense "TestOffice" with 3 site-to-site clients connected.

Here is one from 2.2.4 with a Road Warrior server, site-to-site servers and site-to-site client.

No changes have been made to the layout for now, but I have added UP/Down icons so that at least you can see the status.

I'll look at the layout at a later date after I get through some more pressing issues.

To record progress so far I have attached a screen shot from 2.3-ALPHA (amd64) built on Mon Oct 05 18:44:18 CDT 2015 showing 3 clients (2 up and 1 down). The up and down status arrows are showing correctly.

arrows look good. Put this back to assigned for the remainder

Widget tables have been updated to Bootstrap classes, header tags and rowspans corrected.

The appearance seems to be improved, but further testing with a variety of OpenVPN configurations is required.

This screen shot is from a system with 1 OpenVPN road-warrior server and 3 site-to-site clients.

The server section does not format - that "Abc" is the description in the server settings, which is correctly listening on UDP:1194. There are currently no client connections.

Client Instance Statistics - the Name/Time and Remote/Virtual IP column headings are shifted 1 column to the right. Name and Remote IP shows OK. THe Time and Virtual IP data is showing as that long string of text, rather than separated and formatted under each relevant client entry.

Applied in changeset pfsense:b18303f197f95a6591d5684771a9fe8166b286be.

Widget revised to use Bootstrap panels instead of outer tables. Table layout and classes corrected. There is a somewhat annoying alignment difference between certain panels within the widget, but that is what you get with fluid table layout.

Tested with JimP

Jarred: Would you play with the panel-heading class colors in this widget please? We should probably make a new class called widget-panel-heading and give it a different/lighter shade.

That looks much better.
I see what you mean about the columns - in each section the columns will adjust depending on content... and so the middle columns of each section do not all line up with each other.

Steve Beaver wrote:

Jarred: Would you play with the panel-heading class colors in this widget please? We should probably make a new class called widget-panel-heading and give it a different/lighter shade.

I added support for styling widget panels differently and lightened the shade of the OpnVPN widget panel headings.