Skip to content

Commit dd18bce

Browse files
fix(showcase): remove Thebe configuration and update CSS for improved styling
1 parent 96bd36d commit dd18bce

3 files changed

Lines changed: 85 additions & 66 deletions

File tree

docs/showcase/pluto/corporate.css

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
/* Brand colors from LaTeX beamer template */
2+
:root {
3+
--etch-dark: #006145; /* etchdark RGB(0,97,69) */
4+
--etch-light: #34ca71; /* etchlight RGB(52,202,113) */
5+
--pes-groen: #4e7738; /* pesgroen */
6+
--text: #0f1a14;
7+
}
8+
9+
/* Base typography */
10+
html, body {
11+
font-family: "Inter", "Segoe UI", Roboto, Arial, sans-serif;
12+
color: var(--text);
13+
}
14+
15+
/* Headings use the light accent */
16+
main h1, main h2, main h3 {
17+
color: var(--etch-light) !important;
18+
letter-spacing: 0.2px;
19+
}
20+
21+
/* Links and interactive accents */
22+
a { color: var(--etch-light) !important; }
23+
a:hover { color: var(--pes-groen) !important; }
24+
25+
/* Cells and output subtle separation */
26+
pluto-cell {
27+
border-left: 3px solid rgba(0,97,69,0.15);
28+
}
29+
30+
/* Code blocks */
31+
pluto-output pre, pluto-input pre, .cm-editor {
32+
border-radius: 6px !important;
33+
}
34+
35+
/* Requested layout overrides */
36+
/* occupy full width */
37+
body main {
38+
max-width: calc(100% - 2em) !important;
39+
margin-left: 1em !important;
40+
margin-right: 1em !important;
41+
}
42+
43+
/* larger images in arrays when expanded */
44+
pluto-tree img {
45+
max-width: none !important;
46+
max-height: none !important;
47+
}
48+
49+
/* somewhat larger images in arrays when collapsed */
50+
pluto-tree.collapsed img {
51+
max-width: 15rem !important;
52+
max-height: 15rem !important;
53+
}
54+
55+
/* move cell popup menu to the left of its button */
56+
pluto-input > .open.input_context_menu > ul {
57+
margin-left: -200px;
58+
margin-right: 20px;
59+
}
60+
pluto-input > .open.input_context_menu > ul,
61+
pluto-input > .open.input_context_menu {
62+
z-index: 31 !important;
63+
}
64+
65+
/* popup max size + responsive */
66+
pluto-popup {
67+
--max-size: 451px;
68+
width: min(90vw,var(--max-size));
69+
}
70+
71+
/* package terminal height */
72+
pkg-terminal > .scroller {
73+
max-height: 70vh;
74+
}
75+

docs/showcase/slides/_quarto.yml

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,6 @@ metadata:
77

88
format:
99
revealjs:
10-
thebe: true
11-
code-tools: true
1210
theme: [default, assets/corporate.scss]
1311
slide-number: true
1412
controls: true

docs/showcase/slides/index.qmd

Lines changed: 10 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -2,21 +2,6 @@
22
title: "Julia Showcase (Hello World)"
33
engine: julia
44
format: revealjs
5-
# Thebe config to make code blocks live via Binder
6-
include-in-header:
7-
text: |
8-
<script type="text/x-thebe-config">
9-
{
10-
"requestKernel": true,
11-
"binderOptions": {
12-
"repo": "Electa-Git/LineCableModels.jl",
13-
"ref": "HEAD",
14-
"repoProvider": "github"
15-
},
16-
"kernelOptions": { "name": "julia-1.11", "path": "." },
17-
"selector": "[data-executable]"
18-
}
19-
</script>
205
---
216

227
# Hello
@@ -29,44 +14,21 @@ println("Hello, world from Julia $(VERSION)")
2914

3015
---
3116

32-
# Live cell (click “Activate”)
17+
# A simple computation
3318

34-
After the deck loads, hit **Activate** (Thebe) → Binder spins up a Julia kernel → run:
19+
This is rendered at build time (if execution is enabled):
3520

3621
```{julia}
37-
#| thebe: true
38-
#| eval: false
39-
# Minimal "computation" to prove execution
4022
sum(i^2 for i in 1:10), prod(i for i in 1:5)
4123
```
4224

4325
---
4426

45-
# Activate Kernel (if needed)
27+
# Your package hook (static)
4628

47-
If you don’t see Thebe’s Activate control, click the button below:
48-
49-
<button id="thebe-activate" style="padding:8px 12px; font-size:0.9rem;">Activate (start Binder)</button>
50-
<script>
51-
window.addEventListener('DOMContentLoaded', () => {
52-
const btn = document.getElementById('thebe-activate');
53-
if (btn && window.thebe) {
54-
btn.addEventListener('click', async () => {
55-
try { await thebe.bootstrap(); btn.textContent = 'Activated'; } catch (e) { console.error(e); btn.textContent = 'Activation failed'; }
56-
});
57-
}
58-
});
59-
</script>
60-
61-
---
62-
63-
# Your package hook (optional live)
64-
65-
Uncomment and replace with your package to smoke-test imports.
29+
Uncomment and replace with your package to smoke-test imports locally:
6630

6731
```{julia}
68-
#| thebe: true
69-
#| eval: false
7032
# using YourPackage
7133
# YourPackage.versioninfo()
7234
"ready"
@@ -80,30 +42,14 @@ Uncomment and replace with your package to smoke-test imports.
8042

8143
---
8244

83-
# Pluto Widget (live)
84-
85-
If Thebe feels limited for UI widgets, here is a Pluto cell embedded via Binder. First load can take a minute.
45+
# Pluto (live, new tab)
8646

87-
<iframe
88-
class="pluto-frame"
89-
src="https://mybinder.org/v2/gh/Electa-Git/LineCableModels.jl/HEAD?urlpath=pluto/open?path=docs/showcase/pluto/hello.jl"
90-
loading="lazy"
91-
></iframe>
47+
Open these Pluto notebooks on Binder (first launch can take a few minutes):
9248

93-
If the frame doesn't load, open in a new tab:
94-
95-
[Open Pluto on Binder](https://mybinder.org/v2/gh/Electa-Git/LineCableModels.jl/HEAD?urlpath=pluto/open?path=docs/showcase/pluto/hello.jl)
49+
- Hello demo: https://mybinder.org/v2/gh/Electa-Git/LineCableModels.jl/HEAD?urlpath=pluto/open?path=docs/showcase/pluto/hello.jl
50+
- Plot demo: https://mybinder.org/v2/gh/Electa-Git/LineCableModels.jl/HEAD?urlpath=pluto/open?path=docs/showcase/pluto/plot.jl
51+
- Showcase: https://mybinder.org/v2/gh/Electa-Git/LineCableModels.jl/HEAD?urlpath=pluto/open?path=docs/showcase/pluto/showcase.jl
9652

9753
---
9854

99-
# Pluto Plot (live)
100-
101-
Interactive plot using Plots.jl inside Pluto.
102-
103-
<iframe
104-
class="pluto-frame"
105-
src="https://mybinder.org/v2/gh/Electa-Git/LineCableModels.jl/HEAD?urlpath=pluto/open?path=docs/showcase/pluto/plot.jl"
106-
loading="lazy"
107-
></iframe>
108-
109-
[Open Pluto Plot on Binder](https://mybinder.org/v2/gh/Electa-Git/LineCableModels.jl/HEAD?urlpath=pluto/open?path=docs/showcase/pluto/plot.jl)
55+
---

0 commit comments

Comments
 (0)