CSS for completion checkboxes

CSS for completion checkboxes

Scott Karren -
回帖数：6

All,

I am using Moodle 2.4.4+ and the Aardvark theme.  I have noticed in Firefox and IE that the completion checkboxes do not appear at all.  I traced this to

.path-course-view li.activity span.autocompletion img, .path-course-view li.activity form.togglecompletion input {
    position: absolute;
    right: 0;
    top: 0.25em;
}
 
If I remove the position attribute then the checkboxes appear as normal, problem is this line appears to be in Base of Canvas and I don't really want to edit those if I don't have to.  Is there a way that I can rewrite these to appear in Firefox and IE?
 
Scott
平均分： -
回复Scott Karren

Re: CSS for completion checkboxes

Mary Evans -

Hi,

To over-ride CSS you can add it to the theme's CSS file. So with Aardvark it would be in the style/core.css. Just add it to the end of the file.

Technically the CSS from either Base theme or Canvas theme should present standard moodle elements correctly on the page. If they are not showing up then this could be a design fault or some errors in the theme CSS, which may be blocking the parent themes' CSS.

One way to test this is to upload the Aardvark CSS to the W3C Validator

Hope this helps?

Cheers

Mary

平均分： -
回复Mary Evans

Re: CSS for completion checkboxes

Scott Karren -

Mary

Thanks for the quick reply.  My biggest question right now would be what would I use to override the position: absolute; attribute since that seems to be the culprit right now.

I uploaded the core.css file to the link you provided and other than parse errors about settings it told me the file was clean. I am open to any other thoughts you might have.

Scott

平均分： -
回复Scott Karren

Re: CSS for completion checkboxes

Mary Evans -

The answer is ...

position: relative;

平均分： -
回复Mary Evans

Re: CSS for completion checkboxes

Scott Karren -

Mary

I added this to the core.css file, purged caches and the checkboxes are still not showing up.  If I remove the position element completely than the checkboxes appear.  Any ideas on this?

Scott

平均分： -
回复Scott Karren

Re: CSS for completion checkboxes

Scott Karren -

So, I have done some more testing on this and have discovered it only affects the checkbox if the activity completion is set to something other than "Student can manually mark the activity completed".  If I change the activity setting to anything other than this the checkbox disappears.  

If I change the position to relative it just moves the boxes out of alignment with the activities, if I remove the position css all together than everything works as is expected.  I don't want to hack canvas or base to remove this option if I don't have to.

Any thoughts on this?

Scott

平均分： -
回复Scott Karren

Re: CSS for completion checkboxes

Mary Evans -

These are being dealt with in Moodle Tracker. There is a problem and it has been noted.

The only CSS for this that I could find is in Base theme and NOT Canvas.

So to compensate add the same CSS to the Aardvark theme that you see in base them but change absolute to relative and change top: and right: values to 0 as in top: 0; right: 0;  If after testing this that the alignment is wrong adjust top and right values to suit the situation on your site.

平均分： -