arthur/website-documentation
1
0
Fork 0
mirror of https://github.com/DiscordFactory/website-documentation.git synced 2026-01-14 17:34:22 +01:00
Code Issues Packages Projects Releases Wiki Activity

🚧 Redesign environment

Browse Source
This commit is contained in:
Freeze455
2021-09-05 23:18:51 +02:00
parent 9767f0a79c
commit 479ee91c4a
2 changed files with 56 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/templates/modules/documentation/base/Environment.vue
View File

@@ -21,17 +21,51 @@
<p>
When you create a new project, you can choose between three types of environment :
</p>
<!-- -->
<div>
<h3>json</h3>
<CodeHighlight :code="json" />
</div>
<div>
<h3>yaml</h3>
<CodeHighlight :code="yaml" />
<div class="sm:hidden">
<label for="tabs" class="sr-only">Select a tab</label>
<select id="tabs" name="tabs" class="block w-full focus:ring-indigo-500 focus:border-indigo-500 border-gray-300 rounded-md">
<option
v-for="tab in tabs"
:key="tab.name"
:selected="tab.current">
{{ tab.name }}
</option>
</select>
</div>
<div class="hidden sm:block space-y-5 ">
<nav class="flex space-x-4" aria-label="Tabs">
<button
v-for="tab in tabs"
@click.prevent="changeTab(tab.id)"
:class="[tab.id === activeTab ? 'bg-indigo-100 text-indigo-700' : 'text-gray-500 hover:text-gray-700', 'px-3 py-2 font-medium text-sm rounded-md cursor-pointer focus:outline-none']"
:aria-current="activeTab || undefined"
:key="tab.name">
{{ tab.name }}
</button>
</nav>
<div v-if="activeTab === 'yaml'">
<CodeHighlight :code="yaml" />
</div>
<div v-if="activeTab === 'json'">
<CodeHighlight :code="json" />
</div>
</div>
</div>
<h2>Retrieving environment variables</h2>
<CodeHighlight :code="getClient" />
<!--<div>-->
<!-- <h3>json</h3>-->
<!-- <CodeHighlight :code="json" />-->
<!--</div>-->
<!--<div>-->
<!-- <h3>yaml</h3>-->
<!-- <CodeHighlight :code="yaml" />-->
<!--</div>-->
<!--<h2>Retrieving environment variables</h2>-->
<!--<CodeHighlight :code="getClient" />-->
</Documentation>
</template>
@@ -44,6 +78,18 @@ import LinkExternal from '../../../../components/LinkExternal.vue'
import AlertWarn from '../../../../components/AlertWarn.vue'
import AlertSuccess from '../../../../components/AlertSuccess.vue'
import AlertInfo from '../../../../components/AlertInfo.vue'
import { ref } from 'vue'
const tabs = [
{ id: 'yaml', name: 'YAML', href: '#' },
{ id: 'json', name: 'JSON', href: '#' },
]
const activeTab = ref('yaml')
function changeTab (identifier: string) {
activeTab.value = identifier
}
const json = `
{