Skip to content

Commit 402b135

Browse files
committed
fixed more bugs
1 parent b4467d9 commit 402b135

4 files changed

Lines changed: 28 additions & 28 deletions

File tree

downloads/cmake_setup.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -46,10 +46,10 @@
4646
.next-steps a { font-size: 14px; font-weight: 600; border-bottom: 1px solid #ccc; padding-bottom: 2px; }
4747
.next-steps a:hover { border-bottom-color: #111; }
4848

49-
.shot-placeholder { background: #f7f7f7; border: 1px dashed #ccc; border-radius: 8px; aspect-ratio: 16/9; max-width: 560px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #999; font-size: 12.5px; text-align: center; padding: 1rem; margin: 0.5rem 0 1.5rem; }
49+
.shot-placeholder { display: none; }
50+
.shot-placeholder.visible { background: #f7f7f7; border: 1px dashed #ccc; border-radius: 8px; aspect-ratio: 16/9; max-width: 560px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #999; font-size: 12.5px; text-align: center; padding: 1rem; margin: 0.5rem 0 1.5rem; }
5051
.shot-placeholder .shot-filename { font-family: "SF Mono","Fira Code",monospace; font-weight: 700; margin-bottom: 0.35rem; color: #777; }
5152
.shot-img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 8px; display: block; margin: 0.5rem 0 1.5rem; }
52-
.shot-img[hidden] { display: none; }
5353

5454
footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
5555
@media (max-width: 768px) {
@@ -146,8 +146,8 @@ <h2>Step 11 Run</h2>
146146
<pre><code>./build/MySketch.exe</code></pre>
147147

148148
<img class="shot-img" src="../assets/screenshot13.png" alt="MSYS2 terminal running cmake build, MySketch.exe open"
149-
onerror="this.hidden=true; this.nextElementSibling.hidden=false;">
150-
<div class="shot-placeholder" hidden>
149+
onerror="this.style.display='none'; this.nextElementSibling.classList.add('visible');">
150+
<div class="shot-placeholder">
151151
<span class="shot-filename">assets/screenshot13.png</span>
152152
<span>MSYS2 terminal running cmake --build, MySketch.exe running</span>
153153
</div>
@@ -170,8 +170,8 @@ <h2>Configure, build, and run</h2>
170170
./build/MySketch</code></pre>
171171

172172
<img class="shot-img" src="../assets/screenshot14.png" alt="macOS Terminal running cmake build, sketch window open"
173-
onerror="this.hidden=true; this.nextElementSibling.hidden=false;">
174-
<div class="shot-placeholder" hidden>
173+
onerror="this.style.display='none'; this.nextElementSibling.classList.add('visible');">
174+
<div class="shot-placeholder">
175175
<span class="shot-filename">assets/screenshot14.png</span>
176176
<span>macOS Terminal running cmake --build, sketch window running</span>
177177
</div>

downloads/dragdrop_setup.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -47,10 +47,10 @@
4747
.next-steps a { font-size: 14px; font-weight: 600; border-bottom: 1px solid #ccc; padding-bottom: 2px; }
4848
.next-steps a:hover { border-bottom-color: #111; }
4949

50-
.shot-placeholder { background: #f7f7f7; border: 1px dashed #ccc; border-radius: 8px; aspect-ratio: 16/9; max-width: 560px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #999; font-size: 12.5px; text-align: center; padding: 1rem; margin: 0.5rem 0 1.5rem; }
50+
.shot-placeholder { display: none; }
51+
.shot-placeholder.visible { background: #f7f7f7; border: 1px dashed #ccc; border-radius: 8px; aspect-ratio: 16/9; max-width: 560px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #999; font-size: 12.5px; text-align: center; padding: 1rem; margin: 0.5rem 0 1.5rem; }
5152
.shot-placeholder .shot-filename { font-family: "SF Mono","Fira Code",monospace; font-weight: 700; margin-bottom: 0.35rem; color: #777; }
5253
.shot-img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 8px; display: block; margin: 0.5rem 0 1.5rem; }
53-
.shot-img[hidden] { display: none; }
5454

5555
footer { border-top: 1px solid #e0e0e0; padding: 2rem; text-align: center; font-size: 13px; color: #888; }
5656
@media (max-width: 768px) {
@@ -135,8 +135,8 @@ <h2>Step 6 Run it</h2>
135135
<p>The first run takes about 15 seconds because it's compiling the engine. After that a window opens with an orange circle that follows your mouse. Every run after the first is much faster since the engine is already built.</p>
136136

137137
<img class="shot-img" src="../assets/screenshot11.png" alt="MSYS2 MinGW terminal running run.bat, sketch window open with orange circle"
138-
onerror="this.hidden=true; this.nextElementSibling.hidden=false;">
139-
<div class="shot-placeholder" hidden>
138+
onerror="this.style.display='none'; this.nextElementSibling.classList.add('visible');">
139+
<div class="shot-placeholder">
140140
<span class="shot-filename">assets/screenshot11.png</span>
141141
<span>MSYS2 MinGW terminal running run.bat, sketch window open with orange circle</span>
142142
</div>
@@ -165,8 +165,8 @@ <h2>Step 6 Run it</h2>
165165
<p>First run compiles the engine (~15 seconds). Then a window opens. Every run after that is fast.</p>
166166

167167
<img class="shot-img" src="../assets/screenshot12.png" alt="macOS Terminal running run.sh, sketch window open"
168-
onerror="this.hidden=true; this.nextElementSibling.hidden=false;">
169-
<div class="shot-placeholder" hidden>
168+
onerror="this.style.display='none'; this.nextElementSibling.classList.add('visible');">
169+
<div class="shot-placeholder">
170170
<span class="shot-filename">assets/screenshot12.png</span>
171171
<span>macOS Terminal running run.sh, sketch window open</span>
172172
</div>

downloads/index.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,8 @@
3434
.mode-callout h2 { margin-top: 0; font-size: 1.15rem; }
3535
.mode-callout p { color: #6b5a1f; }
3636
.mode-callout .shots { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 1.25rem 0; }
37-
.shot-placeholder {
37+
.shot-placeholder { display: none; }
38+
.shot-placeholder.visible {
3839
background: #fff;
3940
border: 1px dashed #d8c27a;
4041
border-radius: 8px;
@@ -50,7 +51,6 @@
5051
}
5152
.shot-placeholder .shot-filename { font-family: "SF Mono","Fira Code",monospace; font-weight: 700; margin-bottom: 0.35rem; }
5253
.shot-img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 8px; display: block; }
53-
.shot-img[hidden] { display: none; }
5454
.mode-callout .step-list { color: #6b5a1f; font-size: 13.5px; line-height: 1.9; margin: 0 0 1rem 1.1rem; }
5555

5656
/* Header library downloads */
@@ -105,16 +105,16 @@ <h2>Looking for the C++ Mode?</h2>
105105
<div class="shots">
106106
<div>
107107
<img class="shot-img" src="../assets/screenshot1.png" alt="Mode dropdown open, &quot;Add Mode...&quot; highlighted"
108-
onerror="this.hidden=true; this.nextElementSibling.hidden=false;">
109-
<div class="shot-placeholder" hidden>
108+
onerror="this.style.display='none'; this.nextElementSibling.classList.add('visible');">
109+
<div class="shot-placeholder">
110110
<span class="shot-filename">assets/screenshot1.png</span>
111111
<span>Mode dropdown open, "Add Mode..." highlighted</span>
112112
</div>
113113
</div>
114114
<div>
115115
<img class="shot-img" src="../assets/screenshot2.png" alt="Contribution Manager showing C++ Mode"
116-
onerror="this.hidden=true; this.nextElementSibling.hidden=false;">
117-
<div class="shot-placeholder" hidden>
116+
onerror="this.style.display='none'; this.nextElementSibling.classList.add('visible');">
117+
<div class="shot-placeholder">
118118
<span class="shot-filename">assets/screenshot2.png</span>
119119
<span>Contribution Manager showing C++ Mode</span>
120120
</div>

gettingstarted/index.html

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,8 @@
6868
}
6969
.step-body { flex: 1; padding-top: 1px; }
7070
.step-body p { margin-bottom: 0.5rem; }
71-
.shot-placeholder {
71+
.shot-placeholder { display: none; }
72+
.shot-placeholder.visible {
7273
background: #f7f7f7;
7374
border: 1px dashed #ccc;
7475
border-radius: 8px;
@@ -85,7 +86,6 @@
8586
}
8687
.shot-placeholder .shot-filename { font-family: "SF Mono","Fira Code",monospace; font-weight: 700; margin-bottom: 0.35rem; color: #777; }
8788
.shot-img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 8px; display: block; margin: 0.5rem 0 1.5rem; }
88-
.shot-img[hidden] { display: none; }
8989

9090
.next-steps { border-top: 1px solid #e0e0e0; margin-top: 3rem; padding-top: 2rem; display: flex; gap: 1.5rem; flex-wrap: wrap; }
9191
.next-steps a { font-size: 14px; font-weight: 600; border-bottom: 1px solid #ccc; padding-bottom: 2px; }
@@ -129,8 +129,8 @@ <h2>2. Open a new sketch</h2>
129129
<div class="step-body">
130130
<p>Restart Processing, open the mode dropdown again, and select <strong>C++</strong>.</p>
131131
<img class="shot-img" src="../assets/screenshot7.png" alt="Mode dropdown with C++ selected"
132-
onerror="this.hidden=true; this.nextElementSibling.hidden=false;">
133-
<div class="shot-placeholder" hidden>
132+
onerror="this.style.display='none'; this.nextElementSibling.classList.add('visible');">
133+
<div class="shot-placeholder">
134134
<span class="shot-filename">assets/screenshot7.png</span>
135135
<span>Mode dropdown with C++ selected</span>
136136
</div>
@@ -141,8 +141,8 @@ <h2>2. Open a new sketch</h2>
141141
<div class="step-body">
142142
<p>You'll see a blank editor, just like Java mode. This is where you'll write your sketch.</p>
143143
<img class="shot-img" src="../assets/screenshot8.png" alt="Blank C++ Mode editor"
144-
onerror="this.hidden=true; this.nextElementSibling.hidden=false;">
145-
<div class="shot-placeholder" hidden>
144+
onerror="this.style.display='none'; this.nextElementSibling.classList.add('visible');">
145+
<div class="shot-placeholder">
146146
<span class="shot-filename">assets/screenshot8.png</span>
147147
<span>Blank C++ Mode editor</span>
148148
</div>
@@ -167,8 +167,8 @@ <h2>4. Run it</h2>
167167
<div class="step-body">
168168
<p>Click the Run button (the play icon) in the top-left of the editor, or press <code>Ctrl+R</code> (<code>Cmd+R</code> on Mac).</p>
169169
<img class="shot-img" src="../assets/screenshot9.png" alt="Run button in the toolbar"
170-
onerror="this.hidden=true; this.nextElementSibling.hidden=false;">
171-
<div class="shot-placeholder" hidden>
170+
onerror="this.style.display='none'; this.nextElementSibling.classList.add('visible');">
171+
<div class="shot-placeholder">
172172
<span class="shot-filename">assets/screenshot9.png</span>
173173
<span>Run button in the toolbar</span>
174174
</div>
@@ -179,8 +179,8 @@ <h2>4. Run it</h2>
179179
<div class="step-body">
180180
<p>A window opens with a dark gray background. Move your mouse over it and a circle follows the cursor.</p>
181181
<img class="shot-img" src="../assets/screenshot10.png" alt="The sketch running, circle following the cursor"
182-
onerror="this.hidden=true; this.nextElementSibling.hidden=false;">
183-
<div class="shot-placeholder" hidden>
182+
onerror="this.style.display='none'; this.nextElementSibling.classList.add('visible');">
183+
<div class="shot-placeholder">
184184
<span class="shot-filename">assets/screenshot10.png</span>
185185
<span>The sketch running, circle following the cursor</span>
186186
</div>

0 commit comments

Comments
 (0)