https://wikimalolos.com/wikimalolos/index.php?action=history&feed=atom&title=Sandbox%3A_Canva_Code
Sandbox: Canva Code - Revision history
2026-04-07T09:53:59Z
Revision history for this page on the wiki
MediaWiki 1.39.3
https://wikimalolos.com/wikimalolos/index.php?title=Sandbox:_Canva_Code&diff=6734&oldid=prev
User1 at 20:50, 20 November 2025
2025-11-20T20:50:35Z
<p></p>
<table style="background-color: #fff; color: #202122;" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="en">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Older revision</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Revision as of 20:50, 20 November 2025</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l4">Line 4:</td>
<td colspan="2" class="diff-lineno">Line 4:</td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> style="width:82%; height:600px; border:0;"></div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> style="width:82%; height:600px; border:0;"></div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td></tr>
<tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"></ins></div></td></tr>
<tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">[[Category:Sandbox]]</ins></div></td></tr>
</table>
User1
https://wikimalolos.com/wikimalolos/index.php?title=Sandbox:_Canva_Code&diff=6733&oldid=prev
User1 at 20:31, 20 November 2025
2025-11-20T20:31:10Z
<p></p>
<table style="background-color: #fff; color: #202122;" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="en">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Older revision</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Revision as of 20:31, 20 November 2025</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l1">Line 1:</td>
<td colspan="2" class="diff-lineno">Line 1:</td></tr>
<tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><html><iframe loading="lazy" src="https://www.canva.com/design/<del style="font-weight: bold; text-decoration: none;">DAG5RNZ2Zs4</del>/<del style="font-weight: bold; text-decoration: none;">L6l1bqt4Be61j2604c9_1A</del>/view?embed" </div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><html><iframe loading="lazy" src="https://www.canva.com/design/<ins style="font-weight: bold; text-decoration: none;">DAG5RJmS9Kc</ins>/<ins style="font-weight: bold; text-decoration: none;">KbCeGZFuBXVkRqly8ksGrQ</ins>/view?embed" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> style="width:82%; height:600px; border:0;"></div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> style="width:82%; height:600px; border:0;"></div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td></tr>
</table>
User1
https://wikimalolos.com/wikimalolos/index.php?title=Sandbox:_Canva_Code&diff=6732&oldid=prev
User1 at 20:22, 20 November 2025
2025-11-20T20:22:58Z
<p></p>
<table style="background-color: #fff; color: #202122;" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="en">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Older revision</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Revision as of 20:22, 20 November 2025</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l2">Line 2:</td>
<td colspan="2" class="diff-lineno">Line 2:</td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td></tr>
<tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div> style="width:<del style="font-weight: bold; text-decoration: none;">85</del>%; height:600px; border:0;"></div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> style="width:<ins style="font-weight: bold; text-decoration: none;">82</ins>%; height:600px; border:0;"></div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td></tr>
</table>
User1
https://wikimalolos.com/wikimalolos/index.php?title=Sandbox:_Canva_Code&diff=6731&oldid=prev
User1 at 20:22, 20 November 2025
2025-11-20T20:22:16Z
<p></p>
<table style="background-color: #fff; color: #202122;" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="en">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Older revision</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Revision as of 20:22, 20 November 2025</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l2">Line 2:</td>
<td colspan="2" class="diff-lineno">Line 2:</td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td></tr>
<tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div> style="width:<del style="font-weight: bold; text-decoration: none;">90</del>%; height:600px; border:0;"></div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> style="width:<ins style="font-weight: bold; text-decoration: none;">85</ins>%; height:600px; border:0;"></div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td></tr>
</table>
User1
https://wikimalolos.com/wikimalolos/index.php?title=Sandbox:_Canva_Code&diff=6730&oldid=prev
User1 at 20:21, 20 November 2025
2025-11-20T20:21:20Z
<p></p>
<table style="background-color: #fff; color: #202122;" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="en">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Older revision</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Revision as of 20:21, 20 November 2025</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l2">Line 2:</td>
<td colspan="2" class="diff-lineno">Line 2:</td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td></tr>
<tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div> style="width:<del style="font-weight: bold; text-decoration: none;">80</del>%; height:600px; border:0;"></div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> style="width:<ins style="font-weight: bold; text-decoration: none;">90</ins>%; height:600px; border:0;"></div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td></tr>
</table>
User1
https://wikimalolos.com/wikimalolos/index.php?title=Sandbox:_Canva_Code&diff=6729&oldid=prev
User1 at 20:20, 20 November 2025
2025-11-20T20:20:52Z
<p></p>
<table style="background-color: #fff; color: #202122;" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="en">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Older revision</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Revision as of 20:20, 20 November 2025</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l2">Line 2:</td>
<td colspan="2" class="diff-lineno">Line 2:</td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td></tr>
<tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div> style="width:<del style="font-weight: bold; text-decoration: none;">100</del>%; height:600px; border:0;"></div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div> style="width:<ins style="font-weight: bold; text-decoration: none;">80</ins>%; height:600px; border:0;"></div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td></tr>
</table>
User1
https://wikimalolos.com/wikimalolos/index.php?title=Sandbox:_Canva_Code&diff=6728&oldid=prev
User1 at 20:20, 20 November 2025
2025-11-20T20:20:05Z
<p></p>
<table style="background-color: #fff; color: #202122;" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="en">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Older revision</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Revision as of 20:20, 20 November 2025</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l1">Line 1:</td>
<td colspan="2" class="diff-lineno">Line 1:</td></tr>
<tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><html><iframe loading="lazy" src="https://www.canva.com/design/<del style="font-weight: bold; text-decoration: none;">XXXXXXXX</del>/view?embed" </div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><html><iframe loading="lazy" src="https://www.canva.com/design/<ins style="font-weight: bold; text-decoration: none;">DAG5RNZ2Zs4/L6l1bqt4Be61j2604c9_1A</ins>/view?embed" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> style="width:100%; height:600px; border:0;"></div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> style="width:100%; height:600px; border:0;"></div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div></iframe></html></div></td></tr>
</table>
User1
https://wikimalolos.com/wikimalolos/index.php?title=Sandbox:_Canva_Code&diff=6727&oldid=prev
User1 at 20:14, 20 November 2025
2025-11-20T20:14:39Z
<p></p>
<table style="background-color: #fff; color: #202122;" data-mw="interface">
<col class="diff-marker" />
<col class="diff-content" />
<col class="diff-marker" />
<col class="diff-content" />
<tr class="diff-title" lang="en">
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Older revision</td>
<td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Revision as of 20:14, 20 November 2025</td>
</tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l1">Line 1:</td>
<td colspan="2" class="diff-lineno">Line 1:</td></tr>
<tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div><iframe loading="lazy" src="https://www.canva.com/design/XXXXXXXX/view?embed" </div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"><html></ins><iframe loading="lazy" src="https://www.canva.com/design/XXXXXXXX/view?embed" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allowfullscreen="allowfullscreen" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> allow="fullscreen" </div></td></tr>
<tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> style="width:100%; height:600px; border:0;"></div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div> style="width:100%; height:600px; border:0;"></div></td></tr>
<tr><td class="diff-marker" data-marker="−"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #ffe49c; vertical-align: top; white-space: pre-wrap;"><div></iframe></div></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div></iframe<ins style="font-weight: bold; text-decoration: none;">></html</ins>></div></td></tr>
</table>
User1
https://wikimalolos.com/wikimalolos/index.php?title=Sandbox:_Canva_Code&diff=6726&oldid=prev
User1: Replaced content with "<iframe loading="lazy" src="https://www.canva.com/design/XXXXXXXX/view?embed" allowfullscreen="allowfullscreen" allow="fullscreen" style="width:100%; height:600px; border:0;"> </iframe>"
2025-11-20T20:13:21Z
<p>Replaced content with "<iframe loading="lazy" src="https://www.canva.com/design/XXXXXXXX/view?embed" allowfullscreen="allowfullscreen" allow="fullscreen" style="width:100%; height:600px; border:0;"> </iframe>"</p>
<a href="https://wikimalolos.com/wikimalolos/index.php?title=Sandbox:_Canva_Code&diff=6726&oldid=6725">Show changes</a>
User1
https://wikimalolos.com/wikimalolos/index.php?title=Sandbox:_Canva_Code&diff=6725&oldid=prev
User1: Created page with "<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Vocabulary Matching Game</title> <script src="/_sdk/element_sdk.js"></script> <style> body { box-sizing: border-box; margin: 0; padding: 0; font-family: 'Arial', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);..."
2025-11-20T20:00:47Z
<p>Created page with "<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Vocabulary Matching Game</title> <script src="/_sdk/element_sdk.js"></script> <style> body { box-sizing: border-box; margin: 0; padding: 0; font-family: 'Arial', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);..."</p>
<p><b>New page</b></p><div><!doctype html><br />
<html lang="en"><br />
<head><br />
<meta charset="UTF-8"><br />
<meta name="viewport" content="width=device-width, initial-scale=1.0"><br />
<title>Vocabulary Matching Game</title><br />
<script src="/_sdk/element_sdk.js"></script><br />
<style><br />
body {<br />
box-sizing: border-box;<br />
margin: 0;<br />
padding: 0;<br />
font-family: 'Arial', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;<br />
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);<br />
min-height: 100%;<br />
display: flex;<br />
align-items: center;<br />
justify-content: center;<br />
}<br />
<br />
* {<br />
box-sizing: border-box;<br />
}<br />
<br />
.container {<br />
width: 90%;<br />
max-width: 900px;<br />
padding: 32px;<br />
background: white;<br />
border-radius: 24px;<br />
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);<br />
}<br />
<br />
.header {<br />
text-align: center;<br />
margin-bottom: 32px;<br />
}<br />
<br />
h1 {<br />
font-size: 40px;<br />
margin: 0 0 12px 0;<br />
background: linear-gradient(135deg, #667eea, #764ba2);<br />
-webkit-background-clip: text;<br />
-webkit-text-fill-color: transparent;<br />
background-clip: text;<br />
}<br />
<br />
.instructions {<br />
font-size: 16px;<br />
color: #64748b;<br />
margin: 0;<br />
}<br />
<br />
.game-area {<br />
display: grid;<br />
grid-template-columns: 1fr 1fr;<br />
gap: 24px;<br />
margin-bottom: 24px;<br />
}<br />
<br />
.column h2 {<br />
font-size: 20px;<br />
margin: 0 0 16px 0;<br />
text-align: center;<br />
color: #1e293b;<br />
}<br />
<br />
.term-card, .definition-card {<br />
padding: 16px 20px;<br />
border-radius: 12px;<br />
margin-bottom: 12px;<br />
cursor: pointer;<br />
transition: all 0.3s ease;<br />
border: 3px solid transparent;<br />
font-size: 15px;<br />
position: relative;<br />
overflow: hidden;<br />
}<br />
<br />
.term-card {<br />
background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);<br />
color: #78350f;<br />
font-weight: bold;<br />
}<br />
<br />
.definition-card {<br />
background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);<br />
color: #1e3a8a;<br />
}<br />
<br />
.term-card:hover:not(.matched):not(.showing-hint), <br />
.definition-card:hover:not(.matched):not(.showing-hint) {<br />
transform: translateY(-4px);<br />
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);<br />
}<br />
<br />
.term-card.selected, .definition-card.selected {<br />
border-color: #8b5cf6;<br />
transform: scale(1.05);<br />
box-shadow: 0 8px 24px rgba(139, 92, 246, 0.4);<br />
}<br />
<br />
.term-card.matched, .definition-card.matched {<br />
background: linear-gradient(135deg, #34d399 0%, #10b981 100%);<br />
color: #064e3b;<br />
cursor: default;<br />
animation: matchPulse 0.6s ease;<br />
}<br />
<br />
.term-card.showing-hint {<br />
border-color: #8b5cf6;<br />
animation: hintPulse 1s ease-in-out;<br />
}<br />
<br />
@keyframes matchPulse {<br />
0%, 100% { transform: scale(1); }<br />
50% { transform: scale(1.1); }<br />
}<br />
<br />
@keyframes hintPulse {<br />
0%, 100% { transform: scale(1); }<br />
50% { transform: scale(1.05); }<br />
}<br />
<br />
.checkmark {<br />
position: absolute;<br />
top: 8px;<br />
right: 8px;<br />
font-size: 20px;<br />
animation: checkmarkPop 0.5s ease;<br />
}<br />
<br />
@keyframes checkmarkPop {<br />
0% { transform: scale(0) rotate(-45deg); }<br />
50% { transform: scale(1.2) rotate(10deg); }<br />
100% { transform: scale(1) rotate(0deg); }<br />
}<br />
<br />
.controls {<br />
display: flex;<br />
gap: 12px;<br />
justify-content: center;<br />
margin-bottom: 24px;<br />
}<br />
<br />
button {<br />
padding: 12px 24px;<br />
border: none;<br />
border-radius: 12px;<br />
font-size: 16px;<br />
font-weight: bold;<br />
cursor: pointer;<br />
transition: all 0.3s ease;<br />
}<br />
<br />
.hint-btn {<br />
background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);<br />
color: white;<br />
}<br />
<br />
.hint-btn:hover:not(:disabled) {<br />
transform: translateY(-2px);<br />
box-shadow: 0 6px 16px rgba(139, 92, 246, 0.4);<br />
}<br />
<br />
.hint-btn:disabled {<br />
opacity: 0.5;<br />
cursor: not-allowed;<br />
}<br />
<br />
.reset-btn {<br />
background: linear-gradient(135deg, #f87171 0%, #ef4444 100%);<br />
color: white;<br />
}<br />
<br />
.reset-btn:hover {<br />
transform: translateY(-2px);<br />
box-shadow: 0 6px 16px rgba(239, 68, 68, 0.4);<br />
}<br />
<br />
.progress {<br />
text-align: center;<br />
font-size: 18px;<br />
color: #475569;<br />
margin-bottom: 16px;<br />
}<br />
<br />
.progress-bar {<br />
width: 100%;<br />
height: 12px;<br />
background: #e2e8f0;<br />
border-radius: 6px;<br />
overflow: hidden;<br />
margin-bottom: 24px;<br />
}<br />
<br />
.progress-fill {<br />
height: 100%;<br />
background: linear-gradient(90deg, #34d399, #10b981);<br />
transition: width 0.5s ease;<br />
border-radius: 6px;<br />
}<br />
<br />
.success-message {<br />
text-align: center;<br />
padding: 24px;<br />
background: linear-gradient(135deg, #34d399 0%, #10b981 100%);<br />
border-radius: 16px;<br />
color: #064e3b;<br />
font-size: 24px;<br />
font-weight: bold;<br />
display: none;<br />
animation: successSlide 0.6s ease;<br />
}<br />
<br />
@keyframes successSlide {<br />
from {<br />
opacity: 0;<br />
transform: translateY(-20px);<br />
}<br />
to {<br />
opacity: 1;<br />
transform: translateY(0);<br />
}<br />
}<br />
<br />
.confetti {<br />
position: fixed;<br />
width: 10px;<br />
height: 10px;<br />
border-radius: 50%;<br />
animation: confettiFall 3s ease-out forwards;<br />
pointer-events: none;<br />
}<br />
<br />
@keyframes confettiFall {<br />
to {<br />
transform: translateY(100vh) rotate(720deg);<br />
opacity: 0;<br />
}<br />
}<br />
<br />
@media (max-width: 768px) {<br />
.game-area {<br />
grid-template-columns: 1fr;<br />
}<br />
<br />
h1 {<br />
font-size: 32px;<br />
}<br />
<br />
.container {<br />
padding: 24px;<br />
}<br />
}<br />
</style><br />
<style>@view-transition { navigation: auto; }</style><br />
<script src="/_sdk/data_sdk.js" type="text/javascript"></script><br />
<script src="https://cdn.tailwindcss.com" type="text/javascript"></script><br />
</head><br />
<body><br />
<div class="container"><br />
<div class="header"><br />
<h1 id="game-title">Geometry Match Challenge</h1><br />
<p class="instructions" id="instructions">Match each term with its correct definition</p><br />
</div><br />
<div class="progress" id="progress-text"><br />
Matched: 0 / 6<br />
</div><br />
<div class="progress-bar"><br />
<div class="progress-fill" id="progress-fill" style="width: 0%"></div><br />
</div><br />
<div class="game-area"><br />
<div class="column"><br />
<h2>📐 Terms</h2><br />
<div id="terms-container"></div><br />
</div><br />
<div class="column"><br />
<h2>📝 Definitions</h2><br />
<div id="definitions-container"></div><br />
</div><br />
</div><br />
<div class="controls"><button class="hint-btn" id="hint-btn">💡 <span id="hint-btn-text">Need a Hint?</span></button> <button class="reset-btn" id="reset-btn">🔄 Start Over</button><br />
</div><br />
<div class="success-message" id="success-message"><br />
🎉 <span id="success-text">Perfect! You matched all terms!</span> 🎉<br />
</div><br />
</div><br />
<script><br />
const defaultConfig = {<br />
game_title: "Geometry Match Challenge",<br />
hint_text: "Need a Hint?",<br />
success_message: "Perfect! You matched all terms!",<br />
primary_color: "#667eea",<br />
secondary_color: "#fbbf24",<br />
text_color: "#1e293b",<br />
button_color: "#8b5cf6",<br />
success_color: "#10b981",<br />
font_family: "Arial",<br />
font_size: 16<br />
};<br />
<br />
const vocabularyPairs = [<br />
{ id: 1, term: "Radius", definition: "The distance from the center of a circle to any point on its edge" },<br />
{ id: 2, term: "Diameter", definition: "A straight line passing through the center connecting two points on a circle" },<br />
{ id: 3, term: "Perimeter", definition: "The total distance around the outside of a shape" },<br />
{ id: 4, term: "Angle", definition: "The space between two lines or surfaces that meet at a point" },<br />
{ id: 5, term: "Polygon", definition: "A closed shape with straight sides" },<br />
{ id: 6, term: "Parallel", definition: "Lines that never intersect and remain the same distance apart" }<br />
];<br />
<br />
let selectedTerm = null;<br />
let selectedDefinition = null;<br />
let matchedPairs = [];<br />
let hintUsed = false;<br />
<br />
function shuffleArray(array) {<br />
const shuffled = [...array];<br />
for (let i = shuffled.length - 1; i > 0; i--) {<br />
const j = Math.floor(Math.random() * (i + 1));<br />
[shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]];<br />
}<br />
return shuffled;<br />
}<br />
<br />
function initGame() {<br />
const termsContainer = document.getElementById('terms-container');<br />
const definitionsContainer = document.getElementById('definitions-container');<br />
<br />
termsContainer.innerHTML = '';<br />
definitionsContainer.innerHTML = '';<br />
<br />
const shuffledTerms = shuffleArray(vocabularyPairs);<br />
const shuffledDefinitions = shuffleArray(vocabularyPairs);<br />
<br />
shuffledTerms.forEach(pair => {<br />
const card = document.createElement('div');<br />
card.className = 'term-card';<br />
card.dataset.id = pair.id;<br />
card.textContent = pair.term;<br />
card.addEventListener('click', () => selectTerm(card, pair.id));<br />
termsContainer.appendChild(card);<br />
});<br />
<br />
shuffledDefinitions.forEach(pair => {<br />
const card = document.createElement('div');<br />
card.className = 'definition-card';<br />
card.dataset.id = pair.id;<br />
card.textContent = pair.definition;<br />
card.addEventListener('click', () => selectDefinition(card, pair.id));<br />
definitionsContainer.appendChild(card);<br />
});<br />
<br />
matchedPairs = [];<br />
selectedTerm = null;<br />
selectedDefinition = null;<br />
hintUsed = false;<br />
updateProgress();<br />
document.getElementById('hint-btn').disabled = false;<br />
document.getElementById('success-message').style.display = 'none';<br />
}<br />
<br />
function selectTerm(card, id) {<br />
if (matchedPairs.includes(id)) return;<br />
<br />
if (selectedTerm) {<br />
selectedTerm.classList.remove('selected');<br />
}<br />
<br />
selectedTerm = card;<br />
card.classList.add('selected');<br />
<br />
checkMatch(id, selectedDefinition ? parseInt(selectedDefinition.dataset.id) : null);<br />
}<br />
<br />
function selectDefinition(card, id) {<br />
if (matchedPairs.includes(id)) return;<br />
<br />
if (selectedDefinition) {<br />
selectedDefinition.classList.remove('selected');<br />
}<br />
<br />
selectedDefinition = card;<br />
card.classList.add('selected');<br />
<br />
checkMatch(selectedTerm ? parseInt(selectedTerm.dataset.id) : null, id);<br />
}<br />
<br />
function checkMatch(termId, definitionId) {<br />
if (termId && definitionId && termId === definitionId) {<br />
matchedPairs.push(termId);<br />
<br />
selectedTerm.classList.remove('selected');<br />
selectedDefinition.classList.remove('selected');<br />
selectedTerm.classList.add('matched');<br />
selectedDefinition.classList.add('matched');<br />
<br />
const checkmark1 = document.createElement('span');<br />
checkmark1.className = 'checkmark';<br />
checkmark1.textContent = '✓';<br />
selectedTerm.appendChild(checkmark1);<br />
<br />
const checkmark2 = document.createElement('span');<br />
checkmark2.className = 'checkmark';<br />
checkmark2.textContent = '✓';<br />
selectedDefinition.appendChild(checkmark2);<br />
<br />
selectedTerm = null;<br />
selectedDefinition = null;<br />
<br />
updateProgress();<br />
<br />
if (matchedPairs.length === vocabularyPairs.length) {<br />
setTimeout(() => {<br />
showSuccess();<br />
}, 500);<br />
}<br />
}<br />
}<br />
<br />
function updateProgress() {<br />
const progressText = document.getElementById('progress-text');<br />
const progressFill = document.getElementById('progress-fill');<br />
const percentage = (matchedPairs.length / vocabularyPairs.length) * 100;<br />
<br />
progressText.textContent = `Matched: ${matchedPairs.length} / ${vocabularyPairs.length}`;<br />
progressFill.style.width = percentage + '%';<br />
}<br />
<br />
function showHint() {<br />
if (hintUsed || matchedPairs.length === vocabularyPairs.length) return;<br />
<br />
const unmatchedPairs = vocabularyPairs.filter(pair => !matchedPairs.includes(pair.id));<br />
if (unmatchedPairs.length === 0) return;<br />
<br />
const hintPair = unmatchedPairs[0];<br />
<br />
const termCards = document.querySelectorAll('.term-card');<br />
const definitionCards = document.querySelectorAll('.definition-card');<br />
<br />
termCards.forEach(card => {<br />
if (parseInt(card.dataset.id) === hintPair.id) {<br />
card.classList.add('showing-hint');<br />
setTimeout(() => card.classList.remove('showing-hint'), 2000);<br />
}<br />
});<br />
<br />
definitionCards.forEach(card => {<br />
if (parseInt(card.dataset.id) === hintPair.id) {<br />
card.classList.add('showing-hint');<br />
setTimeout(() => card.classList.remove('showing-hint'), 2000);<br />
}<br />
});<br />
<br />
hintUsed = true;<br />
document.getElementById('hint-btn').disabled = true;<br />
}<br />
<br />
function showSuccess() {<br />
document.getElementById('success-message').style.display = 'block';<br />
createConfetti();<br />
}<br />
<br />
function createConfetti() {<br />
const colors = ['#fbbf24', '#60a5fa', '#34d399', '#a78bfa', '#f87171'];<br />
for (let i = 0; i < 50; i++) {<br />
setTimeout(() => {<br />
const confetti = document.createElement('div');<br />
confetti.className = 'confetti';<br />
confetti.style.left = Math.random() * 100 + '%';<br />
confetti.style.background = colors[Math.floor(Math.random() * colors.length)];<br />
confetti.style.animationDelay = Math.random() * 0.5 + 's';<br />
document.body.appendChild(confetti);<br />
<br />
setTimeout(() => confetti.remove(), 3000);<br />
}, i * 30);<br />
}<br />
}<br />
<br />
document.getElementById('hint-btn').addEventListener('click', showHint);<br />
document.getElementById('reset-btn').addEventListener('click', initGame);<br />
<br />
const element = {<br />
defaultConfig,<br />
<br />
onConfigChange: async (config) => {<br />
const gameTitle = document.getElementById('game-title');<br />
const hintBtnText = document.getElementById('hint-btn-text');<br />
const successText = document.getElementById('success-text');<br />
const body = document.body;<br />
const container = document.querySelector('.container');<br />
const buttons = document.querySelectorAll('button');<br />
const heading1 = document.querySelector('h1');<br />
const allText = document.querySelectorAll('p, .progress, h2, button, .term-card, .definition-card, .success-message');<br />
<br />
gameTitle.textContent = config.game_title || defaultConfig.game_title;<br />
hintBtnText.textContent = config.hint_text || defaultConfig.hint_text;<br />
successText.textContent = config.success_message || defaultConfig.success_message;<br />
<br />
const primaryColor = config.primary_color || defaultConfig.primary_color;<br />
const secondaryColor = config.secondary_color || defaultConfig.secondary_color;<br />
const textColor = config.text_color || defaultConfig.text_color;<br />
const buttonColor = config.button_color || defaultConfig.button_color;<br />
const successColor = config.success_color || defaultConfig.success_color;<br />
<br />
body.style.background = `linear-gradient(135deg, ${primaryColor} 0%, ${buttonColor} 100%)`;<br />
heading1.style.background = `linear-gradient(135deg, ${primaryColor}, ${buttonColor})`;<br />
heading1.style.webkitBackgroundClip = 'text';<br />
heading1.style.webkitTextFillColor = 'transparent';<br />
heading1.style.backgroundClip = 'text';<br />
<br />
document.querySelectorAll('.term-card:not(.matched)').forEach(card => {<br />
card.style.background = `linear-gradient(135deg, ${secondaryColor} 0%, ${secondaryColor}dd 100%)`;<br />
});<br />
<br />
document.querySelectorAll('.hint-btn').forEach(btn => {<br />
btn.style.background = `linear-gradient(135deg, ${buttonColor}cc 0%, ${buttonColor} 100%)`;<br />
});<br />
<br />
document.querySelector('.progress-fill').style.background = `linear-gradient(90deg, ${successColor}dd, ${successColor})`;<br />
<br />
const customFont = config.font_family || defaultConfig.font_family;<br />
const baseFontStack = '-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif';<br />
body.style.fontFamily = `${customFont}, ${baseFontStack}`;<br />
<br />
const baseSize = config.font_size || defaultConfig.font_size;<br />
heading1.style.fontSize = `${baseSize * 2.5}px`;<br />
document.querySelector('.instructions').style.fontSize = `${baseSize}px`;<br />
document.querySelector('.progress').style.fontSize = `${baseSize * 1.125}px`;<br />
document.querySelectorAll('h2').forEach(h2 => h2.style.fontSize = `${baseSize * 1.25}px`);<br />
document.querySelectorAll('button').forEach(btn => btn.style.fontSize = `${baseSize}px`);<br />
document.querySelectorAll('.term-card, .definition-card').forEach(card => card.style.fontSize = `${baseSize * 0.9375}px`);<br />
document.querySelector('.success-message').style.fontSize = `${baseSize * 1.5}px`;<br />
},<br />
<br />
mapToCapabilities: (config) => ({<br />
recolorables: [<br />
{<br />
get: () => config.primary_color || defaultConfig.primary_color,<br />
set: (value) => {<br />
config.primary_color = value;<br />
window.elementSdk.setConfig({ primary_color: value });<br />
}<br />
},<br />
{<br />
get: () => config.secondary_color || defaultConfig.secondary_color,<br />
set: (value) => {<br />
config.secondary_color = value;<br />
window.elementSdk.setConfig({ secondary_color: value });<br />
}<br />
},<br />
{<br />
get: () => config.text_color || defaultConfig.text_color,<br />
set: (value) => {<br />
config.text_color = value;<br />
window.elementSdk.setConfig({ text_color: value });<br />
}<br />
},<br />
{<br />
get: () => config.button_color || defaultConfig.button_color,<br />
set: (value) => {<br />
config.button_color = value;<br />
window.elementSdk.setConfig({ button_color: value });<br />
}<br />
},<br />
{<br />
get: () => config.success_color || defaultConfig.success_color,<br />
set: (value) => {<br />
config.success_color = value;<br />
window.elementSdk.setConfig({ success_color: value });<br />
}<br />
}<br />
],<br />
borderables: [],<br />
fontEditable: {<br />
get: () => config.font_family || defaultConfig.font_family,<br />
set: (value) => {<br />
config.font_family = value;<br />
window.elementSdk.setConfig({ font_family: value });<br />
}<br />
},<br />
fontSizeable: {<br />
get: () => config.font_size || defaultConfig.font_size,<br />
set: (value) => {<br />
config.font_size = value;<br />
window.elementSdk.setConfig({ font_size: value });<br />
}<br />
}<br />
}),<br />
<br />
mapToEditPanelValues: (config) => new Map([<br />
["game_title", config.game_title || defaultConfig.game_title],<br />
["hint_text", config.hint_text || defaultConfig.hint_text],<br />
["success_message", config.success_message || defaultConfig.success_message]<br />
])<br />
};<br />
<br />
if (window.elementSdk) {<br />
window.elementSdk.init(element);<br />
}<br />
<br />
initGame();<br />
</script><br />
<script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'9a1a873237d4bc58',t:'MTc2MzY2ODc3MC4wMDAwMDA='};var a=document.createElement('script');a.nonce='';a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script></body><br />
</html></div>
User1