As we have progressed through the chapters of this book, there are a few small changes that we could have made as we worked through them. We didn't make these changes because it would have made some of the chapters a little long, and I felt that it would be best if you (the reader) tried to change these with only a few small hints and tips.
Try to make the following changes by using some of the hints set out below.
One thing that I thought might need to be changed was the look and feel of the button elements in your theme. You can change the color, size, and font, or even implement a rollover so that the button changes color when the user places his or her mouse over the button. Set out below is an example of two buttons—one styled using CSS and in the active state and the other in a rollover state.
Active state:
Rollover state:
Let's see if you can make the form buttons in your theme look like the ones above. Remember: you can add backgrounds, borders, change the font type and size, and even have a rollover state for the buttons.
Here is a CSS hint:
input[type="button"], input[type="submit"] button:hover, input[type="button"]:hover, input[type="submit"]:hover
Another thing that you might want to sort out is the drop-down fields, such as the language chooser on the top right-hand corner of your theme. These can be styled, but not as much as the buttons. Another thing to look out for is that elements often share classes, so changing the width of one might have an effect on another.
So go and jump in and see if you can find the correct class that will alter the look of the language drop-down box on your theme, by using Firebug.
It's not there, is it? Well here is a tip: look in the standard theme's stylesheets for a style called select. Here is an example of a drop-down form field that has been styled:
Again, there are lots of form fields scattered around Moodle, and there is no reason why you shouldn't make these look a little better as well.
button, input[type="password"], input[type="text"]
The above CSS hint might help you with this, but make sure that the correct form fields are changed. Here is an example of a form text field that has been styled: