mirror of
https://codeberg.org/vegvisir/website.git
synced 2025-09-13 16:33:42 +02:00
The word "compile" is not really what this thing is doing, so I replaced every "compile" reference to "bundle" instead. I also added an anchor tag example to the "navigate any element" snippet on the /features page. And I also copied the asset injection example from the /index page into the /features page. Reviewed-on: https://codeberg.org/vegvisir/website/pulls/11
74 lines
No EOL
3 KiB
PHP
74 lines
No EOL
3 KiB
PHP
<style><?= VV::css("public/assets/css/snippets/split") ?></style>
|
|
<style><?= VV::css("public/assets/css/pages/features") ?></style>
|
|
<section id="this-stays">
|
|
<?= VV::embed("public/assets/media/arrow.svg") ?>
|
|
<div>
|
|
<h1>This thing there,</h1>
|
|
<p>That header is present on every page, so it's loaded once and never again.</p>
|
|
</div>
|
|
<?= VV::embed("public/assets/media/arrow.svg") ?>
|
|
</section>
|
|
<section id="softnav" class="split">
|
|
<div class="text">
|
|
<h1>Website shell</h1>
|
|
<p>Load your website's main stylesheet, JavaScript, markdown, and other assets <strong>once</strong> and keep them around between page navigations. Saving bandwidth and increases page load times considerably.</p>
|
|
<div class="buttons">
|
|
<a href="/docs/Reference/JavaScript"><button class="inline">
|
|
<p>Vegvisir shells</p>
|
|
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
|
|
</button></a>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=index_softnav") ?>
|
|
</div>
|
|
</section>
|
|
<section id="navigate" class="split reverse">
|
|
<div class="text">
|
|
<h1>Navigate any element</h1>
|
|
<p>Sometimes you just want to update a portion of your website. That can be done <a href="/docs/Reference/JavaScript/navigate">programmatically with JavaScript</a> or directly in the markdown using the <a href="/docs/Reference/vv-attributes"><code>vv</code> attributes</a>.</p>
|
|
<div class="buttons">
|
|
<a href="/docs/Reference/vv-attributes"><button class="inline">
|
|
<p>'vv' attributes</p>
|
|
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
|
|
</button></a>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=features/vv-nav") ?>
|
|
</div>
|
|
</section>
|
|
<section id="include" class="split">
|
|
<div class="text">
|
|
<h1>..or include that page with the response</h1>
|
|
<p>Vevisir pages, snippets, and other PHP files can be inlined with the response using <code>VV::include</code>.</p>
|
|
<div class="buttons">
|
|
<a href="/docs/Reference/PHP/VV/include"><button class="inline">
|
|
<p>VV::include()</p>
|
|
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
|
|
</button></a>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=features/vv-include") ?>
|
|
</div>
|
|
</section>
|
|
<section id="assets" class="split reverse">
|
|
<div class="text">
|
|
<h1>Asset injection</h1>
|
|
<p>Bundle page-specific CSS and JavaScript with your templating markdown. Vegvisir will import and minify CSS and JavaScript on the fly. The bundled result is returned in a single response.</p>
|
|
<div class="buttons">
|
|
<a href="/docs"><button class="inline solid">
|
|
<p>More info</p>
|
|
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
|
|
</button></a>
|
|
<a href="/docs/Reference/PHP/VV/css"><button class="inline">
|
|
<p>Example reference</p>
|
|
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
|
|
</button></a>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=index_assets") ?>
|
|
</div>
|
|
</section>
|