SuiteCRM Responsive Theme

SuiteCRM Responsive Theme

This topic is dedicated to any responsive theme suggestions, discussions, examples and contributions of/to a responsive theme for SuiteCRM.

For any general/current theme questions/issues please use the other topics/threads.

Kind Regards,

Will.

Some screen shots below of a new Bootstrap based theme/UI with enhancements such as sidebar(can be toggled on/off), new quick links, responsive top menu, flat/simple focused UI design.

2 Likes

Adding to the responsive theme, dashlets now fold down/collapse for smaller screen resolutions meaning the user does not need to scroll horizontally or have dashlet views cut off.

Note: Dashlet content is not yet responsive(if dashlet is larger than screen in px it will overflow).

Dashlets collapsed in smaller view:

Full screen view:

Thanks,

Will.

Hello Will,
Is this currently available for suitecrm?

Regards:
Hemant

Hi Hemant,

It is very early in development. As you can see from the posts I have detailed some of the functionality. The theme is not currently available with the production releases or Beta for SuiteCRM.

If/when the code is accepted into the main release, we will let you know.

Thanks,

Will.

1 Like

Simply astounding. This is gonna be pivotal. Keep up the great work, Will.

Some updates to the UI. Tables are now contained within the view and do not overflow. They do however require some horizontal scrolling(but contained within the table). I will work to find a long term solution, but this is simply a progression/modification to the theme.

Admin panel is now tabbed so there is no scrolling required.

Quick Create option added to the sidebar for easy record creation.


1 Like

Looks awesome. 99% of field sales reps are on tablets, phones, and “phablets” and cannot function without responsive bootstrap theme that auto adapts to their touch screen size resolution.

Hi Chris,

Thanks for the feedback.

The new theme, once completed, should be fully responsive and adapt/fit to all screen sizes.

Currently, the menus, sidebars and admin panel have been made responsive with some enhancements/addition to current functionality. Dashlets fold down to 2 or 1 wide dependent on screen size too.

I have implemented the bootstrap table class so that tables are responsive, in a way, but require horizontal scrolling(of the tables, not the whole page).

The end goal will be to have fully responsive views where data folds down/responds fully dependent on the device.

Any suggestions/contributions are welcome, and you can see all theme developments by looking at the ‘responsivetheme’ branch on GitHub.

Thanks,

Will.

Hello Will,
Thanks for information.
It’s looks awesome. Thanks to you and your team for suitecrm work and we will wait for it.

Regards:
Hemant

Awesome! This looks unbelievable! This is going to make a huge difference in adoption. I was being forced to look at OROcrm and Zurmo because they are responsive.
Not meaning to be picky but is there anyway to change the coloured icons? They look like their from the 90’s.
Thanks for the excellent upgrade!

Hi bashish,

I agree the icons are outdated. It has not yet been done, but may be in the pipeline somewhere. Most of the new icons I have implemented are vector fonts which are text, not images, and reduce the load. I don’t think the icons can all be replaced by vector fonts in an upgrade safe way, but we will try to optimise and modernise all areas of the theme.

Thanks,

Will.

Great thanks! Hopefully the responsive charts at http://www.chartjs.org/ can be implemented with this at some stage. I wouldn’t know where to start building this as a plugin.
cheers

Some modifications/fixes/updates to the theme changer/colour selector for the SuiteCRM theme.

The colour picker will work with both the original theme and the new theme. It works with a js popup when the user clicks on the field, allowing a colour to be selected from a pallete or for a hexidecimal code to be manually entered.

This allows full customisation of button colours, menu colours, drop down menu colours and more.

Note: These colours are just an example to show how the theme can be modified.

Thanks,

Will.

Hi Will,

I’m very interested in this development on suitecrm. A responsive theme would easily increase the appeal given the adoption by so many of tablets/touch screens.

Of specific interest to me though is the ability to manage suitecrm from fully from my tablet.

Regards
John.

Hi John,

That is the aim. With this Theme, I(we) hope to modernise the interface and the way data/CRM can be managed on all devices. The theme is available on GitHub so you can pull down the project, select the ‘responsivetheme’ branch and test on your tablet(given you can access where the CRM is).

I would really appreciate any feed back, and any customisations/thoughts anyone has to improve on the Responsive Theme build.

Thanks,

Will.

Hi Will,

I’ve downloaded this and run some basic visual tests using my desktop, an iPad2 and a Nexus4. I know that this is a work in progress so these are just observations. I’ll have a chance to dig a bit more at the weekend.

On the desktop the theme renders well for me unless the ‘Display actions within menus’ is unchecked. Then it looses its feel.

On the Nexus the mobile menu appears. One suggestion here is that the search bar is moved to the top. For mobile users perhaps the convenience of global search will be more appealing than wading through the menus.

On the iPad the point at which the menu changes from desktop to mobile needs to be adjusted slightly as it doesn’t quite kick in leaving the menu doubled up. Screen space of course is valuable on a tablet.

In general I very much like the left hand menu bar. The complete set of recently viewed items makes good sense. As does moving the Create new record button. I always felt that the small plus sign in the corner was just too obscure. It may be worth considering a show hide on this to maximise desk space.

One of the things I would like to see is perhaps moving the ‘admin’ button from the users sub menu. The main reason for this is the extra clicks when wanting to access the administrators section. I have often found myself ‘editing my record’ instead.

I’m also a fan of being able to click on a menu item and going where I want to be. Rather than the extra click just to get down the list. Although I appreciate that it’s just a matter of practice, it was for sure a big ‘end user’ niggle when I rolled out SuiteCRM. (If that’s all they had to moan about then we have all done something right).
The recently viewed section on the menu items is a big plus too.

I like this theme and where its going. My users don’t like having mobile apps and for me its just another layer of admin headache to support.

Regards
John.

1 Like

Hi John,

Thank you for your great and thorough review/testing of the theme so far, on the various devices. I had seen the issue with the menu on the iPad, not quite sure why that is(may be retina display, or simply the resolution it uses).

The theme is certainly a work in progress and a large area of the CRM is still to be tackled and rigorous testing to be done.

I will take on board your considerations and develop/modify features of the theme to implement the changes you have suggested.

Thanks,

Will.

Hi Will,

On the my iPad it’s too old to be retina but the resolution is 1024x768 so for the menu to change we need to change the minimum references in the css files to 768px need to be dropped to 767px this will allow the responsive theme to render the mobile menu on an iPad or other similar sized device. Although not thoroughly tested it does resolve the iPad menu issue in part.

On another note and perhaps a contentious one! Most good projects open-source or otherwise, are driven by those who know how. That is those of us that are technical minded and can do the job run it!
Love or hate apple or even Google for that matter, they built simplicity for their end user. They built a sleek design. Not just with the designed hardware but with the interface the user interacts with. This is how they dominate the game.

I think what you are doing is key to the future of SuiteCRM. ‘Make the end user experience an easy one’ and the rest can be as complex or as easy as you like.

Regards
John.