HOME / COMMUNITY Switch to knowledge base

Global CSS template


#1

Introduction

This CSS template will be embedded into all pages within your account (excluding the Client control panel, which has it’s own style-sheet). You can use this CSS template to overwrite specific styles within the web application, e.g. fonts, colour schemes, and page orientation.

Please note: when activating the global CSS template for the first time you will need to log out and back in again before it will take effect. You may also need to do a hard refresh by holding the ctrl button and clicking your browser refresh button in order to clear the cache.

Example 1: Modify tag/untag button colours

As the default buttons for many tag/untag routines are coloured in red and green this can make it difficult to differentiate the two with certain types of colour blindness. In the following example we have changed the default colours of these buttons within the bank statement and Receipt Hub areas.

You can of course changes these colours as you please, there’s a handy colour picker here that will help you find the optimum combination.

.taggedButton, .recButton_View {
    background-color: #3366ff !important;
    border: #0066ff !important;
}
.tdTagged {
    background-color: #99ccff !important;
}
.tagmeButton .recButton_TagMe {
    background-color: #ff3399 !important;
    border: #ff0066 !important;
}
.tdUntagged {
    background-color: #ffccff !important;
}

Example 2: Hide the left hand menu column to increase viewable area

Hiding particular elements within the QuickFile user interface is simple once you know the relevant class to invoke. In the below example we will hide the left hand navigation column.

.vMenuColumn {
    display:none;
}

Change a colour of a tag in Estimates