Pages

Monday, June 3, 2013

Tweak for Danny Wahl's Autohide for Moodle 2.x when using the Topics Format

If you're using Danny Wahl's Autohide creation with the Topics Format course format in Moodle 2.x, here's a tweak for the autohide.css file that allows the Settings icon to appear on mouse hover. Before this, I was using the Weekly Format and all was fine. Then I switched over to the Topics Format and suddenly I realised that there was no way to change a topic's description as the Settings icon refused to appear on mouseover!


What a strange phenomena. Upon further investigation, thanks to Sakshi Goel and Mary Cooch in this forum, I was finally able to solve this puzzle by changing this section of the code:

.section_add_menus, /* Add Resource/Activity dropdowns (2.2) */
.addresourcemodchooser, /* Add Resource/Activity Link (2.3) */
.editing .block .title .commands .icon, /* Block Title Controls */
.editing .block .content li .commands a, /* Command in block content (add resources/activities in Main menu) */
.editing .block .editbutton a, /* Edit button in custom HTML blocks */
.editing .section .side > *:not(br), /* Section controls (can't use 'a' b/c ajax uses 'span') */
.topics .section .content .summary ,
.editing .section .summary a:first-child, 
.editing .section .activity .commands > *, /* Individual activity and resource controls (can't use 'a' b/c ajax uses 'span') */
.editing .sitetopic > a {
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transition: opacity 0.5s linear 0s;
    -moz-transition: opacity 0.5s linear 0s;
    -ms-transition: opacity 0.5s linear 0s;
    -o-transition: opacity 0.5s linear 0s;
    transition: opacity 0.5s linear 0s; /* half-second fade in */
}

to

.section_add_menus, /* Add Resource/Activity dropdowns (2.2) */
.addresourcemodchooser, /* Add Resource/Activity Link (2.3) */
.editing .block .title .commands .icon, /* Block Title Controls */
.editing .block .content li .commands a, /* Command in block content (add resources/activities in Main menu) */
.editing .block .editbutton a, /* Edit button in custom HTML blocks */
.editing .section .side > *:not(br), /* Section controls (can't use 'a' b/c ajax uses 'span') */
.editing .section .activity .commands > *, /* Individual activity and resource controls (can't use 'a' b/c ajax uses 'span') */
.editing .section .summary a:first-child, 
.editing .sitetopic > a {
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transition: opacity 0.5s linear 0s;
    -moz-transition: opacity 0.5s linear 0s;
    -ms-transition: opacity 0.5s linear 0s;
    -o-transition: opacity 0.5s linear 0s;
    transition: opacity 0.5s linear 0s; /* half-second fade in */
}

.topics .section .content .summary {
   filter: alpha(opacity=0.5);
    opacity: 0.8;
    -webkit-transition: opacity 0.5s linear 0s;
    -moz-transition: opacity 0.5s linear 0s;
    -ms-transition: opacity 0.5s linear 0s;
    -o-transition: opacity 0.5s linear 0s;
    transition: opacity 0.5s linear 0s; /* half-second fade in */
}

Now the Settings (gear icon) symbol appears on mouseover as it should.


Yippee!!
You can download the tweaked autohide.css file from here.

Regards
Frankie Kam



Ratings and Recommendations by outbrain