SuiteCRM Responsive Theme

Will · 17 December 2014 21:06

Hi John,

Thank you, I’ll work with the media queries to override the bootstrap theme(don’t want to change the core bootstrap files).

Thanks again for the tips and advice. I definitely want to work on this theme for it to be the next generation interface for SuiteCRM, but that depends if the team accept it!

Thanks,

Will.

Dusza · 22 December 2014 20:33

no pun intended but things are going to get even sweeter

Will · 22 December 2014 20:39

Some updates.

Utilising media queries, I am focussing on enhancing key navigation and UI space to address specific devices.

Some screen shots of the new footer quick links for mobile, with quick create for records, that will save time and clicks.

Hope you guys like, and I will continue to post as the development progresses.

Thanks,

Will.

Will · 23 December 2014 08:40

Small update. Added the search bar into the top menu for mobile devices. This means the user doesn’t need to collapse the menu bar and scroll, saving time.

Dusza · 23 December 2014 15:43

Will, I’ve seen from some of your screen shots that you’re running this on a localhost. For the sake of getting quicker feedback from the community would you be able to put a version somewhere online so others can easily get to it, view it and provide quicker feedback?

Will · 23 December 2014 15:44

Hi Dusza,

It is on the ‘responsivetheme’ branch on GitHub.

Thanks,

Will.

Will · 23 December 2014 16:38

Would just like to update for John(Skutter) and all others interested. Utilising media queries, I am optimising the device UI such as the mobile footer. I am also fixing issues with the top menu to work on a variety of resolutions(using inspect elements mobile tools). Over the next couple of weeks, I will be building specific elements and enhancing the top menu, sidebar and other areas dependent on the device.

You will be able to see any progress and fixes on the responsivetheme branch.

Please feel free to contribute any suggestions/constructive criticism, enhancements and bugs to be fixed.

Thanks,

Will.

Will · 24 December 2014 16:19

Most likely the last update of 2014. I have been working, utilising media queries, to optimise the navigation bar on differing devices.

I have attached previous screen shots of mobile/desktop, I now attach some of the iPad navigation.

Working with some of the built-in mozilla developer tools I have been working/testing with various different resolutions.

Retina displays will also need to be handled as these can render differently(I have an original iPad 2 without retina to test).

Will keep you updated as the theme development progresses in 2015.

Thanks,

Will.

Will · 27 December 2014 12:52

Some new updates.

List view is now responsive. The first column in the row in the view is shown, and then the user can expand that row to show all other data/columns for that record/row. This means that the list view records can be easily seen on mobile/tablet devices, and also that no information or data is lost as it can be seen at the touch of a button.

Currently the view looks buggy/cluttered, but we will work on improving this as theme development progresses.

Thanks,

Will · 29 December 2014 14:26

Update as of 29/12/2014

The sidebar has been re-added. This was removed as I wanted to focus on other areas of the theme, fixing bugs and getting customisations stable.

I have fixed many bugs/issues with the sidebar, modifying CSS styles for the entire page area to handle the sidebar on different resolutions to maximise screen area using media queries.

I have also made some slight style changes, mainly adding icons to the recently viewed links so that the user knows which module the records relate to.

I’ll keep you posted on further developments such as sidebar set by user preference(toggle on/off) and much more.

Thanks again to those who contribute ideas and test.

Will.

christopher · 5 January 2015 09:57

Hi Will,

Fantastic work on the responsive theme, it looks great.

Do you have an estimated date of completion (i.e. after any bugs have been ironed out and it’s ready for general use)?

Thanks,

Chris

Will · 5 January 2015 11:08

Hi Christopher,

I cannot confirm a completion date as yet. There is still some work to be done improving views to be responsive, and then there is the admin area to tackle(studio etc).

I will continue to update with progress.

Thanks,

Will.

Skutter · 5 January 2015 15:54

Hi Will,

This is looking very good indeed. I’ve had a brief opportunity to test it over a few devices but will look in depth later.
I’m happy to devote testing time across a different devices if required.

Regards
John.

Will · 5 January 2015 16:00

Hi John,

Thank you for your feed back.

In recent times I’ve also made detail/edit view responsive.

There are a few small issues here and there I am aware of, and will continue to improve styling.

Any feed back on any issues and recommendations would be much appreciated.

Thanks,

Will.

Woodburn_Homes_Realt · 5 January 2015 19:47

I very much look forward to its release.

Will · 7 January 2015 16:02

Just to add some updates, there have been many bug-fixes lately.

Also, below are some screen shots of responsive detail/edit view.

This means records can be easily viewed/edited from mobile with the ability to expand/collapse sections/panels on the record to view data quickly.

I will continue to work on improving the UI and styling and fixing any bugs.

Sub-panels, pop-ups and dashlets will be the next items to be made responsive, and will keep you updated, as these are the last main items for the user facing side of the theme(not including admin/studio etc.).

Thanks,

Will.

Will · 11 January 2015 20:04

Another update to keep things rolling:

Pop-ups are now responsive.
Spent time to correctly format style.css throughout. Useful commenting added and redundant code removed.
Implemented a toggle on the sidebar which works by using jQuery using cookies. This may become a user preference in future.
Changed the standard theme colour to brighten the UI.
Fixed issues with and re-added the group tabs menu type.
Fixed language issues and bugs in the colour picker.
Fixed an issue with the Company/Brand logo in both System Settings and on the login page.
Search on list view is now hidden by default to save space. This can be toggled on/off.
Many other bug fixes, both in current code and legacy code.

Feel free to test the theme, report any issues and suggest enhancements.

Note: NOT to be used in a production environment.

Thanks,

Will.

Wieland · 13 January 2015 12:55

Hi Will,

great work. You work so tirelessly on the theme - late at night, even holidays are not holy … B)

I have the theme brought to work on our Clone. That was not easy. In order to achieve the same level as the source, it was necessary to overwrite some modules.

htdocs / modules / Administration
htdocs / modules / Users
htdocs / custom / modules / Administration
htdocs / custom / modules / Users

For several years SugarCRM - it can happen that some adjustments in with Costum modules are lost - at least for me.

Maybe this is important if the responsive theme would be integrated into the Upgrade.

many greetings
Werner

PS: Please do not try with the productive system

Matt · 13 January 2015 13:39

Yes Will is a robot we build specifically to do the theme, so doesn’t need sleep or holidays, can only seem to get it to do CSS though!

Will · 20 January 2015 09:55

Many bug-fixes have been implemented.

More optimisation of UI dependent on device/resolution.

Menu made simpler on mobile/tablet.

Sub-panels/Global Search/Advanced Open Discovery Search and dashlets are all now responsive.

Responsive Theme branch on GitHub is now ‘suite_responsive’.

We will continue to update with progress.

Thanks,

Will.