EyeTrackVR-Docs/assets/development_docs_pages.md.757dd267.lean.js
RedHawk989 5ca7660ff7 docs: Merge pull request #21 from lorow/main
Fix upload and download actions deprecation, updated to v4
2024-10-01 18:27:11 +00:00

10 lines
9.3 KiB
JavaScript
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import{_ as s,o as a,c as o,O as n}from"./chunks/framework.79850ceb.js";const y=JSON.parse('{"title":"Pages","description":"","frontmatter":{},"headers":[],"relativePath":"development/docs/pages.md","filePath":"development/docs/pages.md","lastUpdated":1700510338000}'),l={name:"development/docs/pages.md"};function t(p,e,c,r,i,d){return a(),o("div",null,e[0]||(e[0]=[n(`<h1 class="text-[var(--font-accent)]" id="pages" tabindex="-1">Pages <a class="header-anchor" href="#pages" aria-label="Permalink to &quot;Pages {.text-[var(--font-accent)]}&quot;"></a></h1><p>This section will cover how to add or edit pages on the docs website.</p><p>Please use the <code>Github Markdown</code> flavour for your Markdown files.</p><p>Please look at other pages to see how they are formatted, and for examples of how to use Markdown.</p><h2 id="adding-a-page" tabindex="-1">Adding a Page <a class="header-anchor" href="#adding-a-page" aria-label="Permalink to &quot;Adding a Page&quot;"></a></h2><p>To add a page, you will need to create a new Markdown file in the <code>vitepress/docs/src/pages</code> folder. The file name will be the URL of the page. For example, if you create a file called <code>my_page.md</code>, the URL will be <code>https://docs.eyetrackvr.dev/my_page</code>.</p><h3 id="sub-directories" tabindex="-1">Sub-directories <a class="header-anchor" href="#sub-directories" aria-label="Permalink to &quot;Sub-directories&quot;"></a></h3><p>You can also create sub-directories in the <code>vitepress/docs/src/pages</code> folder. For example, if you create a file called <code>my_page.md</code> in a folder called <code>my_folder</code>, the URL will be <code>https://docs.eyetrackvr.dev/my_folder/my_page</code>.</p><p>This is useful for organizing pages into categories.</p><h3 id="adding-a-page-to-the-sidebar" tabindex="-1">Adding a Page to the Sidebar <a class="header-anchor" href="#adding-a-page-to-the-sidebar" aria-label="Permalink to &quot;Adding a Page to the Sidebar&quot;"></a></h3><p>To add a page to the sidebar, you will need to add the page to the <code>vitepress/docs/src/custom/theme/index.js</code> file.</p><p>To do this, you will need to add the page to the <code>sidebar</code> object.</p><p>For example, if you want to add a page called <code>my_page.md</code> to the sidebar, you will need to add the following to the <code>sidebar</code> object:</p><div class="language-js line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">{</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#FFCB6B;">text</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">Getting Started</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#FFCB6B;">collapsible</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#FF9CAC;">true</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#FFCB6B;">items</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> [</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> text</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">Introduction</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> link</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">/getting_started/intro</span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> text</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">Things to know before you start</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> link</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">/getting_started/things_to_know</span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span></span>
<span class="line"><span style="color:#F07178;"> </span><span style="color:#89DDFF;">{</span><span style="color:#F07178;"> text</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">My Page</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">,</span><span style="color:#F07178;"> link</span><span style="color:#89DDFF;">:</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">/my_folder/my_page</span><span style="color:#89DDFF;">&quot;</span><span style="color:#F07178;"> </span><span style="color:#89DDFF;">},</span><span style="color:#F07178;"> </span><span style="color:#676E95;font-style:italic;">// Add this line - subdir then file</span></span>
<span class="line"><span style="color:#F07178;"> ]</span><span style="color:#89DDFF;">,</span></span>
<span class="line"><span style="color:#89DDFF;">},</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br><span class="line-number">2</span><br><span class="line-number">3</span><br><span class="line-number">4</span><br><span class="line-number">5</span><br><span class="line-number">6</span><br><span class="line-number">7</span><br><span class="line-number">8</span><br><span class="line-number">9</span><br></div></div><div class="info custom-block"><p class="custom-block-title">Note</p><p>The <code>link</code> property does not require a file extension. Please do not add it.</p></div><h3 class="text-[var(--font-accent)]" id="title-style" tabindex="-1">Title Style <a class="header-anchor" href="#title-style" aria-label="Permalink to &quot;Title Style {.text-[var(--font-accent)]}&quot;"></a></h3><p>The title style is the style of the title that appears at the top of the page.</p><p>We like to keep this cohesive, so please use the following style:</p><div class="language-md line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">md</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;"># </span><span style="color:#FFCB6B;">My Page {.text-</span><span style="color:#89DDFF;">[</span><span style="color:#C3E88D;">var(--font-accent)</span><span style="color:#89DDFF;">]</span><span style="color:#FFCB6B;">}</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div><p>This will give the title a nice orange colour.</p><p>The <code>{}</code> are required, and the <code>.text-[#e67e22]</code> is the colour using <code>TailWindCSS</code> classes. You can also use our built in CSS variables <code>{.text-[var(--font-accent)]}</code>. You will find these in the <code>src/styles/theme.css</code> file. You can change this to any colour you like, but please keep it consistent with the rest of the site.</p><div class="tip custom-block"><p class="custom-block-title">Tip</p><p>This entire site supports <code>TailWindCSS</code> classes. You can find the documentation <a href="https://tailwindcss.com/docs" target="_blank" rel="noreferrer">here</a>.</p><p>All classes you wish to add, must be prefaced with a <code>.</code> when inside of the <code>{}</code>.</p><p>When using classes on <code>HTML</code> elements, you can use the <code>class</code> attribute. For example:</p><div class="language-html line-numbers-mode"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki material-theme-palenight"><code><span class="line"><span style="color:#89DDFF;">&lt;</span><span style="color:#F07178;">h1</span><span style="color:#89DDFF;"> </span><span style="color:#C792EA;">class</span><span style="color:#89DDFF;">=</span><span style="color:#89DDFF;">&quot;</span><span style="color:#C3E88D;">text-[#e67e22]</span><span style="color:#89DDFF;">&quot;</span><span style="color:#89DDFF;">&gt;</span><span style="color:#BABED8;">My Page</span><span style="color:#89DDFF;">&lt;/</span><span style="color:#F07178;">h1</span><span style="color:#89DDFF;">&gt;</span></span></code></pre><div class="line-numbers-wrapper" aria-hidden="true"><span class="line-number">1</span><br></div></div></div><h2 id="editing-a-page" tabindex="-1">Editing a Page <a class="header-anchor" href="#editing-a-page" aria-label="Permalink to &quot;Editing a Page&quot;"></a></h2><p>To edit a page, you will need to edit the Markdown file in the <code>vitepress/docs/src/pages</code> folder.</p>`,24)]))}const h=s(l,[["render",t]]);export{y as __pageData,h as default};