Layout suggestion

Steve_B

Thanks Donny,

That button is big because it is a Bootstrap "Pill".

It would be fun to add those icons to the available widget list, but unfortunately, the way the code is structured at the moment (reading packages from a foreach loop) it would be tricky. I will keep it in mind next time I visit that code though :)

robi

@Steve_B:

That button is big because it is a Bootstrap "Pill".

And looks very dull indeed.

heper

so, i've been seeing the fa-icons popping up in multiple places for edit/copy/disable/delete

so should i spend time in doing the same on other pages?
has it been decided/confirmed that these will be the ones to use for next couple of years ?

@steve_b @coredevs ???

Steve_B

I changed the appearance of the vpn_ipsec.php page today. All those large buttons on every row looked out of place in my opinion, particularly at smaller viewport sizes where the buttons would wrap onto two lines or more. Yesterday I needed to visit the pages that use sortable table rows and while I was editing, I did some icon work too.

It's definitely not an "official policy" but for my part as I review each page in the system I will be paying attention to those pages with HTML tables that have action buttons at the end of the rows, and those that seem crowded or less than attractive I will change to fa icons as time permits. Outside of HTML tables, I think we should continue to use Bootstrap buttons. When we do use icons, I would suggest that we use only the fa icon set now.

So I am not planning a system wide campaign to add icons, but as I work on pages for whatever reason I will look at the buttons too.

Any help that anyone would like to contribute in the process would be very welcome indeed. I very much enjoy the cooperation and idea sharing.

I think we are at the point in the Bootstrap project now where we can think about refining and optimizing it. Having the fa icons offers a lot more choices that the Glyphicons and many of them are more natural choices for pfSense.

heper

when all the related pull-requests are processed, most of the tables will have been adjusted to use the new icons.
when you come across a page that is still missing icons: please post the name of the page and someone will try to fix it.

Donny

Hello

I just thinking about pfSense menu bar and have some idea.
My suggestion pfSense menu bar layout. I have made mockup picture (see on mockup picture) you will be understand more than my poor English.

example:
When you click on menu "System" the submenu appear and stay like the other on dashboard example: Interface or Service status and etc
This is very useful and easy to use and more attractive. When you don't need its just click back on the menu "System" again then they are disappear.

So for another menu: Interface, Firewall, Services, VPN, Status and etc, should be the same like menu "System". What is your suggestion?

Donny

pfSenseMenuLayout3.png_thumb
pfSenseMenuLayout4.png_thumb

jimp

@Donny:

My suggestion pfSense menu bar layout. I have made mockup picture (see on mockup picture) you will be understand more than my poor English.

Personally I find that style of menus irksome and difficult to navigate compared to a simple list like we have now.

Donny

@jimp:

@Donny:

My suggestion pfSense menu bar layout. I have made mockup picture (see on mockup picture) you will be understand more than my poor English.

Personally I find that style of menus irksome and difficult to navigate compared to a simple list like we have now.

Ok thank you Jimp. It is just only my idea.

router_wang

@Donny:

@divsys:

Ok, I see you edited a previous posting.

Just a suggestion, but it might be useful the post changes in a new message so we can see the "progression" of the layout changes proposed.

Just my $.02.

Ok thank u, I have make 2 new mockup. Maybe can help pfSense team to change something or maybe not in the future.

The legends are a very bad idea from an ergonomic standpoint. The icons should be a colored block with white text denoting what the function is: pass/block/positive/negative etc….
And this should be consistent throughout the design of the interface.

Donny

Thank you to Heper and Steve_B and the people to help suggestion for Firewall Layout.
I really like firewall layout that you are make it. really look attractive, clearly and easy to use.

Donny