search

getnikola / nikola

A static website and blog generator
https://getnikola.com/
MIT License
2.62k stars 448 forks source link

mincss gives error on galleries page for glyphicons-halfling #570

Closed rogerbinns closed 11 years ago

rogerbinns commented 11 years ago

If you do a full reload before running mincss on the galleries page, the Chrome web dev tool shows that all urls load just fine. Run mincss and then full reload the page and glyphicons-halfling will be 404.

It is requesting /assets/css/output/assets/img/glyphicons-halflings.png

I am using USE_BUNDLES but the setting made no difference.

In any event this is all moot because the individual photos don't display correctly so you can't use mincss if you have any galleries.

screenshot from 2013-08-08 22 25 36

ralsina commented 11 years ago

This is probably because mincss is not seeing the nodes being created because they are done in runtime.

It should be possible to use phantomjs with mincss which should give better results but I have not seen exactly how that's done.

Another alternative is to tag specific bits of CSS as not-removable by adding a /no-mincss/ in the class that's getting killed.

rogerbinns commented 11 years ago

The first problem (halflings) isn't about being seen, but rather the completely wrong thing ending up in the output (relative/root directory issues)?

As long as nikola mincss works, I don't care how it works :)

There is another problem with the lightbox which is that longer labels aren't broken into multiple lines which makes the text overlay controls. I can't really fix it by changing labels since the label size is a percentage of the width of the page which is variable. Here is an example:

screenshot from 2013-08-09 15 22 12

This means it won't matter that much if you switch to a different lightbox that is friendlier to mincss, and also fixes problems like in the screenshot.

ralsina commented 11 years ago

That wrong path doesn't look like something I can fix, really.

The labels thing looks like a colorbox bug. I am tempted to remove colorbox and just do/use a bootstrap-based lightbox instead.

ralsina commented 11 years ago

I just pushed a change that should only make the title overlap on very long titles (or very narrow images ;-)

ralsina commented 11 years ago

With USE_BUNDLES set to False, and restoring colorbox.css after mincss mangles it, the lightbox works. Slides also seem to work except animations are missing (both with BUNDLES and without)

Honestly I am not sure mincss is worth the effort of having to check everything all the time.

rogerbinns commented 11 years ago

The 5.5.1 release notes didn't say mincss support was experimental, or potentially broken. You may want to add that.

mincss does have a good effect as I detailed here. Doesn't make much difference for desktops, but for mobile the size of the css and the amount of time to download it do matter.

For a 1000px wide window I still get the same mangling as the above screenshot. With wider the label is right justified which doesn't look that good.

I realise this is more work for you. The blueimp lightbox seems to be the current favourite. It doesn't have the label issues. Most importantly it works really well on mobile devices (I tested on Android tablet and iOS iPhone) both in taking up more of the screen, and in letting you swipe amongst the pictures. It also has full screen, handles rotation/resize nicely etc.

ralsina commented 11 years ago

Well, it does what mincss does. Perhaps you saw the hundred times it says TROUBLEMAKER when it runs? That's because all those are CSS descriptors mincss can't parse :-(

I am leaning towards something minimal like http://jbutz.github.io/bootstrap-lightbox/

rogerbinns commented 11 years ago

I suggest you change the release notes so that people won't expect mincss to work :-) I saw all the messages but ignored them. As an end user, either mincss works for nikola or it doesn't.

I had found that lightbox in my searches, but it doesn't appear to support multiple images (gallery). I also tested on mobile where it definitely doesn't do the right thing (no swiping, handles device rotation really poorly).

I understand your 'minimal' tastes (and agree with them) but blueimp does seem reasonable in that there isn't much markup, and it does handle all the modern use cases like mobile devices, rotation, being able to go full screen etc. Sadly I am slammed with work at the moment, otherwise I'd investigate further.

ralsina commented 11 years ago

a90057b does fix the broken URL for halflings, the remaining problems are ... well, other problems. Closing.