impress/impress.js

fallback-message not hidden correctly

janishutz opened this issue · 7 comments

I have been playing around with the fallback messages a little lately, I have copied the code over from the demo and it did not hide properly. I have read through the source code and found no code that takes care of that (except I did overlook something). I will add a fix for this today and open a PR

Does anybody know if I am right or not?

The div of class fallback-message is hidden via CSS. See for instance css/impress-demo.css:

.impress-supported .fallback-message {
display: none;
}

The impress-supported class is added to HTML's <body> element as part of the impress.js script:

impress.js/src/impress.js

Lines 219 to 220 in 64d66bf

body.classList.remove( "impress-not-supported" );
body.classList.add( "impress-supported" );

@henrikingo, I would suggest to move this CSS snippet to css/impress-common.css instead. This is supported by the fact that this snippet is currently present in all of the CSS files in the examples directory.

@simplePCBuilding, would you mind to create a pull request following these suggestions?

Right, why don't we hide it in JS if it exists? This would eliminate the need for extra CSS code

We basically do by adding the impress-supported CSS class via JS. Don't worry about the extra CSS code, IMO it is easier to maintain and more common to just use two classes (here: impress-not-supported and impress-supported) in JS and do everything else via CSS.

Fair point. I will fix this once I am home

Opened a PR

Linking here to pull request #840 which aims to resolve what I suggested in #839 (comment):

@henrikingo, I would suggest to move this CSS snippet to css/impress-common.css instead. This is supported by the fact that this snippet is currently present in all of the CSS files in the examples directory.