More Interface Elements Enhanced on Golf Predictor

Old Prediction Rankings Page

Updated Prediction Rankings Page

Similar to the recent updates to the log in/log out pages on Golf Predictor, various other interface elements have also been enhanced with more attractive Twitter Bootstrap components. Elements improved include the following:

1. All the dropdown fields on the site e.g. the GP Season, Tour and Tournament drop down lists on most menu pages. The text labels have been replaced with graphical labels which are directly adjacent to the left hand side of the field. This can be seen in the second screenshot above.
2. Text boxes now have their label as default text within the field. Most have got new graphical labels also.
3. The Change Password page has been revamped similar to the log in page.
4. The Registration and Search pages have also been updated.
5. The background colour for the information panel on most menu pages (see screenshots above) has been changed to improve display on different monitors.

The before and after screenshots for the main Prediction Ranking page are shown above. As you can see, this new look is cleaner and modern looking. Some notes on these updates:

1. You can hover over the new graphical labels for the dropdown fields to see the associated label text. This does not work on mobile devices, so you can also click on the label to see the same text (click again to hide it).
2. Some text and formatting has been changed on the site to improve display on smaller mobile devices. Certain text has made smaller on such devices and/or been abbreviated. 
3. The HTML/CSS for some site elements has been changed to reflect these new updates (e.g. there is no longer a need for separate containers for the label and the dropdown list. This may result in slightly different display formatting.
4. I have tested these updates on desktop FireFox, Chrome IE11 and Edge and all appears to work as expected.  
5. I have also tested the changes on Android (Chrome) and iOS (Safari) phones. I had to make some small compromises to the display of these new features on mobile devices because of a minor layout issue on iOS. 
6. Despite the testing, there may be issues on other devices or issues that I have missed. Please contact me immediately if you experience any problems.
7. You may have to reload pages that you have recently viewed to see the updates or get the page to display properly. The updated style sheets will also have to be reloaded, so please press Ctrl + F5 (Windows) on any such page to force your browser cache to update.
8. Update: I have also tested the changes on a newer iPhone and an iPad and a similar minor issue as noted in point 5 exists in most orientations. It is very difficult to get the green boxes to align correctly on all mobile devices, but I will look to improve this in the coming days.

I trust you will agree that these cosmetic updates are an improvement. Just another way to make Golf Predictor a little better!