css loading, header and footer: a proposal #296
Conversation
* css-loading (inspired by PR #200, a little extended), in that order * ./rise.css (so this will apply to all notebooks in the current dir) * ./<notebookname>.css - this namely is what PR #200 was about * header and footer * looks for config tag 'overlay' - if found, this is used to build the constant background; it is wrapped in a <div>, so can be text or html in this case user is entirely responsible for styling * otherwise looks for config tags 'header' and 'footer' in this case minimum styling is applied (floor and ceiling) but user is still responsible for cosmetic styling See the examples directory for usages I've taken that chance to add an example named showflow to demonstrate other features related to controlling the slideshow with space and shift-enter this is unrelated but a harmless addition imho Relates to: #173 for header and footer #200 for adding css loading
|
Wonderful @parmentelat, I would love to have more time to give you feedback on these PR more quickly. Hopefully I can review, test and merge several of them at the weekend. Sorry for the delay and thank you very much for your multiple contributions! |
|
Wonderful @parmentelat, I would love to have more time to give you feedback on these PR more quickly. Hopefully I can review, test and merge several of them at the weekend. Sorry for the delay and thank you very much for your multiple contributions!
not at all, thank *you* for putting this together in the first place :)
I’m rushing to get ready before we start our video recording session, that’s why I am frantically trying to get this to work as smoothly as I can, and that’s why you’re getting this flood of changes
|
| let overlay = config.get_sync('overlay'); | ||
| let header = config.get_sync('header'); | ||
| let footer = config.get_sync('footer'); | ||
| let backimage = config.get_sync('backimage'); |
There was a problem hiding this comment.
I think we need to put default values here https://github.com/parmentelat/RISE/blob/master/rise/static/main.js#L25, for these options. Don't you think?
There was a problem hiding this comment.
well, I'm not quite sure now, but I think at the time I considered it but rules it out because of the config logic; IIRC having overlay defined kind of hides the ability to use header/footer/backimge (or it it the other way around?)
So probably having them in a comment could be helpful, but more than that I don't know
There was a problem hiding this comment.
OK, a comment sound like a good compromise.
| // Attempt to load CSS with the same path as the .ipynb but with .css extension instead | ||
| let notebook_css = window.location.pathname.replace(/\.ipynb$/,'.css'); | ||
| $('head').append(`<link rel="stylesheet" href="${notebook_css}" id="notebook-custom-css" />`); | ||
|
|
There was a problem hiding this comment.
Makes sense, you have a rise.css that could be more general applied first and then the notebook specific one applied on top of that...
|
Some things:
|
|
|
I need to go for today; let me know if you need anything else on my end for merging this |
Great, would love to hear those thoughts.
That's ok. We can do that 😉
OK, I will probably do that to play safe. |
I think we are OK, have a fun rest of your day. |
|
Adding some more minor pieces in #310. |
This commit adds a couple features and related examples
css-loading (inspired by PR Added companion CSS file #200, a little extended), in that order
header and footer
looks for config tag 'overlay' - if found, this is used
to build the constant background;
it is wrapped in a
in this case user is entirely responsible for styling
otherwise looks for config tags 'header' and 'footer'
in this case minimum styling is applied (floor and ceiling)
but user is still responsible for cosmetic styling
See the examples directory for usages
I've taken that chance to add an example named showflow
to demonstrate other features related to controlling
the slideshow with space and shift-enter
this is unrelated but a harmless addition imho
Relates to:
#173 for header and footer
#200 for adding css loading