mirror/tiptap
1
0
Fork 0
mirror of https://github.com/ueberdosis/tiptap.git synced 2024-11-29 08:19:34 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

show error message when demo is missing

Browse Source
This commit is contained in:
Hans Pagel 2020-08-20 17:38:47 +02:00
parent 4e2cfd1f49
commit 16da584ebd
2 changed files with 31 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
docs/src/components/Demo/index.vue
View File

@ -1,27 +1,32 @@
<template> <template>
<div class="demo"> <div class="demo">
<div class="demo__preview" v-if="mainFile"> <template v-if="mainFile">
<component :is="mainFile" v-if="mode === 'vue'" /> <div class="demo__preview">
<react-renderer :component="mainFile" v-if="mode === 'react'" /> <component :is="mainFile" v-if="mode === 'vue'" />
</div> <react-renderer :component="mainFile" v-if="mode === 'react'" />
<div class="demo__source">
<div class="demo__tabs" v-if="showFileNames">
<button
class="demo__tab"
:class="{ 'is-active': currentIndex === index}"
v-for="(file, index) in files"
:key="index"
@click="currentIndex = index"
>
{{ file.name }}
</button>
</div> </div>
<div class="demo__code" v-if="activeFile" :key="activeFile.path"> <div class="demo__source">
<prism :code="activeFile.content" :language="activeFile.highlight" :highlight="highlight" /> <div class="demo__tabs" v-if="showFileNames">
<button
class="demo__tab"
:class="{ 'is-active': currentIndex === index}"
v-for="(file, index) in files"
:key="index"
@click="currentIndex = index"
>
{{ file.name }}
</button>
</div>
<div class="demo__code" v-if="activeFile" :key="activeFile.path">
<prism :code="activeFile.content" :language="activeFile.highlight" :highlight="highlight" />
</div>
</div> </div>
</div> <div class="demo__link">
<div class="demo__link"> <a :href="githubUrl" target="_blank">Edit on GitHub</a>
<a :href="githubUrl" target="_blank">Edit on GitHub</a> </div>
</template>
<div v-else class="demo__error">
Could not find a demo called “{{ this.name }}”.
</div> </div>
</div> </div>
</template> </template>

6
docs/src/components/Demo/style.scss
View File

@ -52,4 +52,10 @@
&__link { &__link {
padding: 1rem 1.5rem; padding: 1rem 1.5rem;
} }
&__error {
padding: 1rem 1.5rem;
color: $colorRed;
background-color: rgba($colorRed, 0.1);
}
} }