Below-mentioned is a list of various CSS codes to make minor tweaks to the eLumine theme to help you ensure personalization of your LMS.
To increase/decrease the height of the header
@media screen and (min-width: 992px){
header#masthead {
min-height: 70px;
}
.site-content-contain {
margin-top: 70px; //This value should be same as the above
}
.header-container{
height: 70px; //This value should be same as the above
}
}
To adjust the size of the site logo
@media screen and (min-width: 992px){
header#masthead .elumine-site-logo img {
height: 70px;
}
header.site-header.sps--abv .site-branding img {
max-height: 70px; //This value should be same as the above
}
}
To change the font size of header menu items
.navigation-secondary .menu-item a, .main-navigation .menu-item a{
font-size: 18px;
}
To change the font weight of the header menu items
@media screen and (min-width: 992px){
#site-navigation>div>ul>li>a, .navigation-secondary .menu-item a, .main-navigation .menu-item a {
font-weight: 600;
}
}
To make sure images on the blogs are not cropped
.wdm-blog-content .article img {
min-height: initial;
max-height: initial;
}
Change the colour of your Course Banner Background (Swift Loading Layouts)
.elumine-course-buy .el-banner{
background-color: #222222;
}
To hide instructors details on courses page
.el-cls-instructor{
display: none !important;
}
To display description on LearnDash course grid
.el-cls-desc {
display: block;
}
To hide the course price on LearnDash course grid
.el-cls-status{
display: none;
}
To change the background color and text color of the ribbon for the LearnDash Course Grid
.ld_course_grid_price{
background-color: #ee9823 !important;
color: #ffffff !important;
}
To hide ribbon on course grid
.ld_course_grid_price {
display: none;
}
To change the color of see more button on course grid
.ld-course-list-items .el-cls.ld_course_grid .thumbnail.course a.btn-primary{
background-color: transparent;
color: #000000 !important;
}
To hide ratings from course grid
.el-cls-ratings{
display: none !important;
}