Import-Bootswatch.php breaks css

Import-Bootswatch.php breaks css

by Ray Pierce -
Number of replies: 15

I am using Moodle 3.3+ (Build: 20170601) with the Boost theme.

I'm trying to convert themes from Bootswatch.com into Boost presets. I am using the Import-Bootswatch.php script shipped with Moodle. I have successfully generated the preset.scss file. When I import it into Boost preset dialog, select the new preset, save changes, I get the following shown in the screen shot. I am easily able to revert to the working preset. I would so love to be able to use the great themes on Bootswatch.com. 

Any help in resolving this would be greatly appreciated. Thanks in advance!  Ray



Average of ratings: -
In reply to Ray Pierce

Re: Import-Bootswatch.php breaks css

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

Could be MDL-57875, but should not be MDL-57313.  Look in the php.log file for errors.

Average of ratings: -
In reply to Gareth J Barnard

Re: Import-Bootswatch.php breaks css

by Ray Pierce -
Hi Gareth,
Thank you for the reply. Since the script did what it was supposed to, there is no error log to review.
Ray

(Edited by Mary Evans - Removed Email Transcript - original submission Thursday, 3 August 2017, 4:12 PM)

Average of ratings: -
In reply to Ray Pierce

Re: Import-Bootswatch.php breaks css

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

But there will / could be an error not because of the script but because the generation of the cached 'all' file has failed!  Hence, please look in 'php.log'!

Average of ratings: -
In reply to Gareth J Barnard

Re: Import-Bootswatch.php breaks css

by Ray Pierce -

Gareth,

There is no php or error log for me to look in. I certainly would have.

Average of ratings: -
In reply to Ray Pierce

Re: Import-Bootswatch.php breaks css

by Mary Evans -

Ray,

If you are repling via email, please can you delete the message / conversation carried in the email you are replying to? Otherwise this clogs up the discussion with unnecessary duplication of comments.

Many thanks,

Mary

Average of ratings: -
In reply to Ray Pierce

Re: Import-Bootswatch.php breaks css

by Mary Evans -

What was the name of the preset file you uploaded?

Did you check it for errors?

Cheers

Mary

Average of ratings: -
In reply to Mary Evans

Re: Import-Bootswatch.php breaks css

by Ray Pierce -

Mary,

The file generated was called "preset.scss". Being as I'm new to SCSS, I don't know if I'm seeing an error. It looks pretty much like the other preset files, but again, since I'm new to it, I could be and probably am missing something. As I mentioned to Gareth, there is no php or error log to investigate.

I have attached the preset.scss file that was generated.

Ray


Average of ratings: -
In reply to Ray Pierce

Re: Import-Bootswatch.php breaks css

by Mary Evans -

Well what you have there is a preset of the Darkly theme.

So what you should have done is called it preset_darkly.scss

For example this is the preset that makes Boost look like my Morecandy theme.

https://github.com/lazydaisy/my-moodle-presets/blob/master/preset-morecandy/preset-morecandy.scss

Renaming the preset.scss allows you to add a whole load of different presets like the Darkly one Richard has in his Waxed theme.

Hope this helps...?

Mary

Average of ratings: -
In reply to Mary Evans

Re: Import-Bootswatch.php breaks css

by Ray Pierce -

Mary,


I renamed the preset.scss to 'preset_darkly.scss' and also tried 'preset-darkly.scss' with the same results; text on white background. I really appreciate that you are trying to help me with this. I'll keep plugging at it and hopefully figure it out.

Ray

Average of ratings: -
In reply to Ray Pierce

Re: Import-Bootswatch.php breaks css

by Richard Oelmann -
Picture of Core developers Picture of Plugin developers Picture of Testers
Remove L919 of your file

@import url($web-font-path);

If that fixes it, then the issue is the Tracker Gareth posted earlier and the fix is the one I suggested in my post earlier.
Average of ratings: -
In reply to Richard Oelmann

Re: Import-Bootswatch.php breaks css

by Ray Pierce -

Richard,

That did it!!

I'm in love with Moodle and all of you who take the time to help out those of us who are as Mary puts it, "dangling in a sea of fog".

Is there a SCSS for dummies that you could refer me to? I have lookes over the net a bit but most of it seems to be written for people who are already experts.

Thanks again for your help!!

Ray

Average of ratings: Useful (1)
In reply to Ray Pierce

Re: Import-Bootswatch.php breaks css

by Mary Evans -

Hi,

Yes well it would as there is a fault with that particular preset, as both Gareth and Richard have mentioned. My concern was the fact that there is a preset.scss file in Boost already, so my original thoughts were concerned with overwriting a core file. But as it turns out, as Richard has pointed out again, that the problem is in the original Darkly theme. Which Gareth pointed out at the start of this discussion.

I know that you are not as familar with coding as some people here, so it is hard for people to spend time explaining and so tend to be minimalistic in answering and so one is left dangling in a sea of fog.

If you do as Richard has mentioned then I am sure it will all work as you want it to.

Don't lose heart...you are nearly there.

Cheers

Mary

Average of ratings: Useful (1)
In reply to Ray Pierce

Re: Import-Bootswatch.php breaks css

by Mary Evans -

Read this discussion as it relates to your problem with this particular generated preset.

https://moodle.org/mod/forum/discuss.php?d=345659#p1394020

Hope it helps!

Mary

Average of ratings: -
In reply to Mary Evans

Re: Import-Bootswatch.php breaks css

by Richard Oelmann -
Picture of Core developers Picture of Plugin developers Picture of Testers

Yep, I think that's the original report of this error - there was also another one in the forum about the same time which Gareth picked up on and has some of his investigations detailed which led to the tracker he raised smile


- that other forum thread is here https://moodle.org/mod/forum/discuss.php?d=346241 (its linked from the tracker)


Note: Although, both this current thread and the one Mary linked to above relate to the Darkly preset, this issue in fact affects all the bootswatch presets and any other use of the @import url rule through the scss preprocessing.

Average of ratings: Useful (1)
In reply to Ray Pierce

Re: Import-Bootswatch.php breaks css

by Richard Oelmann -
Picture of Core developers Picture of Plugin developers Picture of Testers
If you download the Waxed theme, they are already there

Simply copy them from Waxed into your own theme - job done smile

There is an error that Gareth has linked to - I have allowed for this by removing those lines from the presets in Waxed. That means the fonts do not work via the presets. I got around that by putting a separate .css file containing the fonts in the Waxed styles folder.

So, take a look at Waxed and you will find both the whole set of bootswatch presets, and the work around for the font import.

Hope that helps.


Richard

Average of ratings: -