Shoehorn theme (BETA) for Moodle 2.6 released.

Shoehorn theme (BETA) for Moodle 2.6 released.

by Gareth J Barnard -
Number of replies: 19
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hi all,

I have developed a brand new theme, called 'Shoehorn', based upon the excellent work being done by Bas Brands, David Scotson and others on the Bootstrap theme.  

I was inspired by what I had already created with the 'Shoelace' and 'Mutant Banjo' themes and with what Julian has been creating.  But unlike 'Elegance' it does depend on the Bootstrap V3 theme for Moodle (full details in the Readme.md file).  It does require release (and above) 2.6.1.4 of Collapsed Topics and 2.6.1.5 of the Grid course formats.

I wanted to create a theme that has all of the modern features you would want, along with an experimental ways of interacting with courses.

Feature list:

  • Bespoke copyright statement.
  • Bespoke login page message.
  • Dynamic and customisable footer menu.
  • Dynamic social icons sign with correct icon colours.
  • Front page slider that can be disabled on mobiles / tablets reducing bandwidth.
  • Footer blocks.
  • Image bank for storing images that you can use anywhere on the site.
  • Individual control over: front page slides, marketing spots and site pages with:
    • 'Draft' / 'Published' state.
    • 'before login', 'after login' or 'always' visibility.
    • Set specific language only visibility.
  • Marketing spots.
  • Page bottom blocks.
  • Site pages that you can customise with your own content.
  • Slider navigation of course content with the 'One section per page' course layout setting.

 

Download

Download from: https://github.com/gjb2048/moodle-theme_shoehorn/releases/tag/V2.6.0.2

Parent Bootstrap V3 from: https://github.com/gjb2048/theme_bootstrap/releases/tag/V2014032100

 

Demonstration of features:

Development gource render:

 

I cannot stress enough that this is BETA code and MUST NOT be used on PRODUCTION servers.  It is for Moodle 2.6+, although I have not tested on M2.7  The theme has a new layout type 'page' which is not standard in core and therefore will not work in other themes.

 

I hope that you enjoy the theme and look forward to positive feedback.

 

Cheers,

Gareth

Average of ratings: Useful (4)
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by David Scotson -
Very nice. I like the sun/sky/clouds/grass color scheme, quite restful.

The image bank seems like a good idea for letting people do quite advanced customisitions on servers they don't control, though I notice the url has a unique number in it. Does that still work after a cache purge?
Average of ratings: Useful (1)
In reply to David Scotson

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Thank you David.

The image bank URL does, but it could change, I think the code could produce CSS 'classes' instead to use (just like the logo code) and you would use them.  Then CSS pre-processing would to it's job and cope as it already does.

Cheers,

Gareth

Average of ratings: -
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

This really is a lovely theme, and as David said, restful.

I like it a lot. Some nice features too.

I have it running on top of the due-date fix in 2.7 (master) on WAMP 2 server and seems much faster than More theme.

I'll let you know it anything breaks.

Well done Gareth

Cheers

Mary

Average of ratings: Useful (1)
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Danny Wahl -

Gareth,

 

It's really awesome to see a theme leveraging dependencies - rather than trying to cram featuresets into a theme, where (IMO) they don't belong.  I think plugin "sets" are a great thing Yes

Average of ratings: Useful (1)
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Hartmut Scherer -

Hi Gareth,

Thank you for providing another bootstrap-based theme. I just started playing with it and I like it very much. Do you know whether docking will be possible for this theme in M2.7?

With kind regards,
Hartmut

Average of ratings: -
In reply to Hartmut Scherer

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hi Hartmut,

Thank you.

The docking code in M2.7 is for Bootstrap 2.3.2 based themes.  Shoehorn is a Bootstrap 3.x based theme and as such would need to adapt the docking code to work with it.  How hard this would be I'm not sure.

I'm going to sit on the fence about docking as some people love it and others think its bad user interface design.  I've not quite made up my mind.

If you follow the changes on GitHub, then I'm working on V2.6.0.3 which fixes some things I've found to be broken.

Cheers,

Gareth

Average of ratings: -
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hi all,

Beta version 2.6.0.3 is now available:

https://github.com/gjb2048/moodle-theme_shoehorn/releases/tag/V2.6.0.3

requiring Bootstrap:

https://github.com/gjb2048/theme_bootstrap/releases/tag/V2014032100_2

because of:

https://github.com/bmbrands/theme_bootstrap/pull/250

It has the following fixes:

  1. Fixed no navbar on the login page.
  2. Fixed enrolment button not showing background colour.
  3. Fixed search box and icon at the top of forums.
  4. Fixed hover over messages in message drop-down.
  5. Fixed user profile picture on view profile page of course participants.
  6. Fixed pop-up user message.
  7. Fixed bottom colour needing to be the footer colour and the body background the top of page for the 'navbar' by applying the bottom footer colour to the 'html' tag.
  8. Fixed validator links to be inline in page info section with dividers.
  9. Added favicon.
  10. Separated out course format renderers and updated for bootstrap fix https://github.com/bmbrands/theme_bootstrap/pull/250.
  11. Created 'imagebank.php' to serve image bank images so that theme designer mode off can be used and therefore using 'purge all caches' will not affect the url. Need to think of perhaps shortening the process by somehow using '$theme->setting_file_serve' in 'theme_shoehorn_pluginfile' of lib.php, but current process has safeguards.  However, this is implementation-al and should not affect 'imagebank.php' URLs.

Cheers,

Gareth

Average of ratings: -
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Hartmut Scherer -

Hi Gareth,

Thank you for updating your theme Shoehorn and for your recent reply about docking (would be nice feature).

I played a bit with the lesson module. If edit mode is enabled and using a menu on the right in lesson, I have to click twice on the next topic, if I want to see it. The first click reduces the column on the left, but I still see the same topic. Clicking again on the next topic will change the width to full and will display the next topic.

Topic 1 with full width

Topic 2 selected, text of topic 1 displayed, width reduced

Topic 2 selected again, correct text displayed, full width

With kind regards,

Hartmut

Average of ratings: -
In reply to Hartmut Scherer

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hi Hartmut,

Thank you for that, I've never really used the lesson module before and I'll have a look.  First impression is that its a JavaScript issue, so will affect all Bootstrap 3 based themes including Elegance if it is.

Cheers,

Gareth

Average of ratings: -
In reply to Hartmut Scherer

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hi Hartmut,

I can indeed replicate.  And in Bootstrap and Clean too.  It's just in Shoehorn the blocks are on the right because of the layout so stands out more.

The issue is the block editing JS as the lesson menu is a fake block and clicking on it causes the core JS to think you are editing and about to possibly move a block on that page so it adapts the body classes to 'has-side-post' such that the post area with no blocks shows up as a drop zone.  But as there is no move icon, the JS should ignore it, but does not.

This means that all Bootstrap based themes, core and contributed are affected by this behaviour.  It needs a tracker issue raising if there is not one already.  The effect on the Clean theme is to shrink the content area.

Cheers,

Gareth

P.S. I might get around this a little by having 'incourse' as a 'side-pre' only layout.

Average of ratings: -
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Be careful with the Lesson module as this problem was visible in March 2010. I never really understood Moodle back then, but I keep seeing this every now and again, I am not convinced it is the page layout I rekon its another fake block problem.

I am not sure, but I think Joseph Rézeau has some connection with the Lesson mod, however I may be wrong, but even so he knows a lot about it and how it works. smile

Mary

Average of ratings: -
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

I think the solution might be adding the 'menu' class here: https://github.com/moodle/moodle/blob/MOODLE_26_STABLE/lib/yui/src/blocks/js/manager.js#L102.  If the 'menu' class is also used for the Book module menu then would be the same there.

Average of ratings: -
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Think FAKE block!!!

Average of ratings: -
In reply to Mary Evans

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

I am smile - but the core DND JS code thinks they are real blocks and delegates an onclick event to them thinking that they can be moved to the empty regions when they cannot.  Also the Book module uses the 'block_book_toc' class instead of 'menu' as used by the Lesson for the same concept!  Ode for less granularity and a list of Moodle 'widgets' / 'concepts' to class name mapping design document - if there is one, where is it please?

Average of ratings: -
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

But there is a data-block="_fake" attribute, so some code somewhere must add that for fake blocks, so could add in a 'fake' CSS class for the JS to pick up on for all fake blocks.  However this would make the test plan tricky to write as identifying all the usages of fake blocks would be the same as the iconsmall / smallicon issue that I have nightmares over.

Average of ratings: -
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Did that icon-small get trashed?

Average of ratings: -
In reply to Mary Evans

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hi Mary,

I had to call it quits on MDL-43112 for a while for the reasons I stated in my last comment of the 25th Feb 2014.

Regarding the "Moodle 'widgets' / 'concepts' to class name mapping design document" I believe that a list of concepts should be generated with a mapping to the classes to use, i.e.:

  1. Fake block menu -> apply 'fakeblock' and 'menu' classes.
  2. Block -> apply 'block' and 'block-blockname' classes.

.... etc.

Then we could eliminate duplicate classes for the same concept, like 'block_book_toc' which is conceptually the same as 'menu' for lesson.  And prevent further infinite granularity in the styles resulting in a ton of work for theme designers to have to target every single little thing rather than generic 'elements' or 'building blocks'.

Cheers,

Gareth

Average of ratings: -
In reply to Gareth J Barnard

Re: Shoehorn theme (BETA) for Moodle 2.6 released.

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

I have no idea what you are talking about with the mapping doc, if one exist? As for where is it I don't have the foggiest!

Average of ratings: -