Custom CSS allows you to modify the style of your TutorCruncher platform, including colours and fonts. You will need some prior experience with CSS and HTML to effectively modify TutorCruncher’s theme.
To customise the styling of your company’s TutorCruncher dashboard, navigate to System > Settings > System Customization > Custom CSS. Here you will see a CSS editor containing several of the main classes used on TutorCruncher pages. Once you make your desired changes, delete the /* on the first line of the editor and click 'Save'. Your site's style should automatically change according to your custom CSS.
The Edit CSS page.
See here for an example of a custom CSS template code that you can import and edit.
/* General */
body {
background: #FFF;
font-family: 'Inter', sans-serif;
font-weight: 400;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Titillium Web', sans-serif;
font-weight: 800;
}
.tc-colour, .bg-primary, .navbar .user-photo-button, #headline-figures, #sidebar a.menu-item.active {
background-color: blue !important;
}
.btn-primary, .badge-primary, .btn.action-btn, .top-tips .title-label {
background-color: dodgerblue !important;
border-color: dodgerblue !important;
}
.btn-secondary {
background-color: white !important;
border-color: dodgerblue !important;
color: dodgerblue !important;
}
.btn-success {
background-color: red !important;
border-color: red !important;
}
.btn.btn-danger {
background-color: white !important;
border-color: red !important;
color: red !important;
}
a, a:hover,
.subtle-link,
.card-custom > .card-header .card-title a,
.card-custom > .card-body .card-title a,
.btn.btn-link {
color: dodgerblue;
}