Jupyter notebook dark mode doesn't work on first load #1545
Comments
george-gca
changed the title
|
Same issue: I get this error: There is any workarround ? |
|
I finally build jekyll on docker |
|
Actually the error you reported is not related to this. As you already figured it out, you were just missing |
|
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. |
|
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. |
|
I couldn't reproduce this bug anymore. Maybe it is solved now. |
|
I'm getting this but after I push my code to Github Pages in the build step. Is there something I'm missing? |
|
Update on my issue: I was able to fix this by adding the missing Mermaid CLI and Jupyter to the - name: Install Node.js for Mermaid CLI
uses: actions/setup-node@v3
with:
node-version: "14"
- name: Install Mermaid CLI
run: npm install -g @mermaid-js/mermaid-cli
- name: Install Python for Jupyter
uses: actions/setup-python@v4
with:
python-version: "3.9"
- name: Install Jupyter
run: pip install jupyter |
Can't fix after adding those lines to yml :( |
|
Where is the This issue specifically is related to jupyter dark mode, but a lot of people used it to report a different bug. |
Hello @george-gca, my jekyll.yml file is located at .github/workflows/ directory. I'm using github pages. Everything is fine at local by running the docker compose file. I have the same issue as @lesterbotello, github pages is not building the Jekyll file because of the jupyter notebook issue. |
|
I believe you are using a very old version of the template, since currently there is no file named You probably have to update your code to get these changes, since the current building script does install jupyter. |
|
@george-gca Thanks. I don't think is an old version, since I have the same deploy.yml file that you show. I will try to update. |
|
Is that action that is currently running to deploy your site? |
|
Yes, it is. I've deleted the jekyll.yml file. It´s working but the theme is not renderizing. |
|
What do you mean? |
|
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. |
If it does install jupyter then what is the cause of error, as I am facing the same error |
|
@george-gca I am facing this error: Conversion error: JekyllJupyterNotebook::Converter encountered an error while converting 'assets/jupyter/blog.ipynb': What could be the problem? |
|
A lot of comments here deviated from the original issue. The issue here is about dark mode not working on the first load. Other issues must be discussed in their respective issues (or discussions) on the repository. @fareedqk check the comment above about related problems. If it doesn't solve your problem, please open a new issue for this matter. |
|
Can confirm the error below still exists even after jupyter installation. |
This is the solution that worked for me. Thanks. |
|
So is there a solution? I copied the most recent version of alshedivat.github.io today (June 2024), followed the instructions and hit this error. If the solution is to "build Jekyll on Docker" then please explain what that means and how to do it. |
|
If your error is not related to jupyter notebook dark mode not working, please open a new issue or Q&A to keep this focused on the error in question. |
|
The problem is related to your system path. In my case, I installed Jupyter through pip, and the installer put the exec on ~/.local/bin/. This folder wasn't on my path, so Jekyll did not find it when it required it. I just put this folder in the path and solved the problem. |
|
@george-gca I'm stil seeing the problem (of dark mode not working on first load). Still that page: https://alshedivat.github.io/al-folio/blog/2023/jupyter-notebook/, if I directly type in the URL it works on first load; if I navigate from somewhere else in the website then it does not work, e.g, try navigating from here: https://alshedivat.github.io/al-folio/blog/tag/jupyter/ |
|
Yeah, I know, but idk how to fix this yet. If someone can find a solution for this and is willing to send a PR, I am happy to review it. |
let jupyterTheme = determineComputedTheme();
$(".jupyter-notebook-iframe-container iframe").each(function () {
- $(this).contents().find("head").append(cssLink);
+ var iframe = $(this);
+ iframe.contents().find("head").append(cssLink);
- if (jupyterTheme == "dark") {
- $(this).bind("load", function () {
- $(this).contents().find("body").attr({
- "data-jp-theme-light": "false",
- "data-jp-theme-name": "JupyterLab Dark",
- });
+ function changeToJpDarkTheme() {
+ iframe.contents().find("body").attr({
+ "data-jp-theme-light": "false",
+ "data-jp-theme-name": "JupyterLab Dark",
});
+ };
+
+ if (jupyterTheme == "dark") {
+ if (iframe[0].contentWindow.document.readyState === "complete") {
+ changeToJpDarkTheme();
+ }
+ iframe.bind("load", changeToJpDarkTheme);
}
});Maybe something like this 🤔 Working for my site not sure if it's general solution... Please see #2693 |
|
I solved mine by install jupyter in python and adding the python path to PATH. |
|
Does it really work? Because it doesn't make sense. We install what is needed to convert jupyter to html in the GitHub actions and convert it using the plug-in. |
|
a complete |
|
@upunaprosk have you tested it? |
Acknowledge the following
[For usage questions, please post in the Discussions instead of raising an issue.]
Describe the bug
When first opening the blog post about jupyter notebooks, activating the dark mode doesn't affect the notebook. After a reload it works as expected.
To Reproduce
Steps to reproduce the behavior:
The text was updated successfully, but these errors were encountered: