This might be a simple little fix, but I'm trying to theme the course listing on the front page to have a slightly different positioning than I've seen in any other theme.
Currently the course list looks like this:
Course Name -------- Description
Guest Access Icon
What I'd like is:
Course Name
Guest Access Icon - Description
or
Course Name Guest Access Icon
Description.
Is it possible to do this through theming? Thanks for your help.
In reply to Jonathan Schmid
Re: Possible to theme course listing on front page?
by Maryel Mendiola -
Jonatahan
hi
Try changes in your header.html . . . and keep the one you like
cheers
hi
Try changes in your header.html . . . and keep the one you like
cheers
Hi,
I'd suggest making some changes to your CSS.
I don't know how the header.html may influence the course listing, it's below the header?
I don't know how to achieve your first idea without going into the source-code or create some very inflexible CSS.
Your second solution could be achieved by adding the following in your css-file. However, I don't think it's good practice either, because if forces you to limit your course description to a single line, otherwise the last line will be shown below the border of the box.
.coursebox .summary {
position:relative;
top:20px;
}
I'd like to add a solution to a slightly different issue I recently had.
I wanted to hide the accessicons for a very empty design.
I added
.coursebox .info a {
display:none;
height:0px;
line-height:0px;
position:relative;
}
However, then there were two  's that create an additional line in my course-description box (s. picture, the  's are highlighted). I wanted to remove or not-display them to keep the size of the box small.
My solution for now was to add
.coursebox .info {
height:1px;
}
This keeps the boxes at their minimum size. Maybe someone has another solution for your problem?
Best
I'd suggest making some changes to your CSS.
I don't know how the header.html may influence the course listing, it's below the header?
I don't know how to achieve your first idea without going into the source-code or create some very inflexible CSS.
Your second solution could be achieved by adding the following in your css-file. However, I don't think it's good practice either, because if forces you to limit your course description to a single line, otherwise the last line will be shown below the border of the box.
.coursebox .summary {
position:relative;
top:20px;
}
I'd like to add a solution to a slightly different issue I recently had.
I wanted to hide the accessicons for a very empty design.
I added
.coursebox .info a {
display:none;
height:0px;
line-height:0px;
position:relative;
}
However, then there were two  's that create an additional line in my course-description box (s. picture, the  's are highlighted). I wanted to remove or not-display them to keep the size of the box small.
My solution for now was to add
.coursebox .info {
height:1px;
}
This keeps the boxes at their minimum size. Maybe someone has another solution for your problem?
Best