mirror of
https://github.com/caddyserver/website.git
synced 2025-04-21 20:46:15 -04:00
Syntax highlight on-demand example, fix rollover
This commit is contained in:
parent
7cba863d53
commit
4610d84904
4 changed files with 40 additions and 27 deletions
36
new/includes/examples/on-demand.md
Normal file
36
new/includes/examples/on-demand.md
Normal file
|
@ -0,0 +1,36 @@
|
||||||
|
<script>
|
||||||
|
ready(() => {
|
||||||
|
let startElement, endElement;
|
||||||
|
|
||||||
|
startElement = findWithContent('.ex-on-demand pre.chroma code span.line', 'on_demand_tls {');
|
||||||
|
endElement = findNextText(startElement, '}');
|
||||||
|
wrapRangeWithSpan(startElement, endElement, 'rollover-abuse rollover-purple');
|
||||||
|
|
||||||
|
startElement = findWithContent('.ex-on-demand pre.chroma code span.line', 'tls');
|
||||||
|
endElement = findNextText(startElement, '}');
|
||||||
|
wrapRangeWithSpan(startElement, endElement, 'rollover-ondemand rollover-green');
|
||||||
|
|
||||||
|
window.$_('.ex-on-demand code').classList.add('light');
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div class="ex-on-demand">
|
||||||
|
|
||||||
|
```caddy
|
||||||
|
{
|
||||||
|
on_demand_tls {
|
||||||
|
ask http://localhost:9123/check
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
https:// {
|
||||||
|
tls {
|
||||||
|
on_demand
|
||||||
|
}
|
||||||
|
# reverse_proxy, etc...
|
||||||
|
}
|
||||||
|
|
||||||
|
# other sites...
|
||||||
|
```
|
||||||
|
|
||||||
|
</div>
|
|
@ -72,21 +72,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div class="display right">
|
<div class="display right">
|
||||||
<code class="light">{
|
{{ markdown (include "/includes/examples/on-demand.md") }}
|
||||||
<span class="rollover-abuse rollover-purple"> on_demand_tls {
|
|
||||||
ask http://localhost:9123/check
|
|
||||||
}</span>
|
|
||||||
}
|
|
||||||
|
|
||||||
https:// {
|
|
||||||
<span class="rollover-ondemand rollover-green"> tls {
|
|
||||||
on_demand
|
|
||||||
}</span>
|
|
||||||
<span class="comment"># reverse_proxy, etc...</span>
|
|
||||||
}
|
|
||||||
|
|
||||||
<span class="comment"># other sites...</span></code>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -188,11 +188,11 @@ on('mouseover', '.button:not(.cool), button:not(.cool)', (e) => {
|
||||||
// mouseover highlights for feature sections that explain config
|
// mouseover highlights for feature sections that explain config
|
||||||
on('mouseover', '.rollover', e => {
|
on('mouseover', '.rollover', e => {
|
||||||
const target = e.target.closest('.rollover') || e.target;
|
const target = e.target.closest('.rollover') || e.target;
|
||||||
$$(`.${target.dataset.rollover}`).forEach(elem => elem.classList.add('show'));
|
$$_(`.${target.dataset.rollover}`).forEach(elem => elem.classList.add('show'));
|
||||||
});
|
});
|
||||||
on('mouseout', '.rollover', e => {
|
on('mouseout', '.rollover', e => {
|
||||||
const target = e.target.closest('.rollover') || e.target;
|
const target = e.target.closest('.rollover') || e.target;
|
||||||
$$(`.${target.dataset.rollover}`).forEach(elem => elem.classList.remove('show'));
|
$$_(`.${target.dataset.rollover}`).forEach(elem => elem.classList.remove('show'));
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -20,14 +20,5 @@ const resp = fetch("/resources/testimonials.json").then(async resp => {
|
||||||
}
|
}
|
||||||
$_(`.testimonial-col:nth-child(${i%3 + 1})`).append(tpl);
|
$_(`.testimonial-col:nth-child(${i%3 + 1})`).append(tpl);
|
||||||
}
|
}
|
||||||
|
|
||||||
on('mouseover', '.rollover', e => {
|
|
||||||
const target = e.target.closest('.rollover') || e.target;
|
|
||||||
$$_(`.${target.dataset.rollover}`).forEach(elem => elem.classList.add('show'));
|
|
||||||
});
|
|
||||||
on('mouseout', '.rollover', e => {
|
|
||||||
const target = e.target.closest('.rollover') || e.target;
|
|
||||||
$$_(`.${target.dataset.rollover}`).forEach(elem => elem.classList.remove('show'));
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue