brunosimon
46 lines
2.0 KiB
HTML
46 lines
2.0 KiB
HTML
<div class="file" :class="[versionsActive && isCode ? 'version-active' : '']">
|
|
|
|
<!-- Header -->
|
|
<header>
|
|
|
|
<div class="path"><span class="directory">{{ content.path.directory }}/</span><span class="name">{{ content.name }}</span></div>
|
|
|
|
<a class="versions-toggle" :class="[versionsActive ? 'active' : '']" href="#" @click.prevent="onVersionsClick" v-if="isCode">
|
|
<img class="icon default" src="../../../static/svg/versions.svg" alt="">
|
|
<img class="icon hover" src="../../../static/svg/versions-hover.svg" alt="">
|
|
</a>
|
|
|
|
<a class="differences-toggle" :class="[differencesActive ? 'active' : '']" href="#" @click.prevent="onDifferencesClick" v-if="isCode">
|
|
<img class="icon default" src="../../../static/svg/differences.svg" alt="">
|
|
<img class="icon hover" src="../../../static/svg/differences-hover.svg" alt="">
|
|
</a>
|
|
|
|
<a class="copy" :class="[copied ? 'active' : '']" href="#" @click.prevent="onCopyClick" @mouseleave="onCopyMouseleave" v-if="isCode">
|
|
<img class="icon default" src="../../../static/svg/copy.svg" alt="">
|
|
<img class="icon hover" src="../../../static/svg/copy-hover.svg" alt="">
|
|
</a>
|
|
|
|
<a class="download" :href="downloadUrl" download>
|
|
<img class="icon default" src="../../../static/svg/download.svg" alt="">
|
|
<img class="icon hover" src="../../../static/svg/download-hover.svg" alt="">
|
|
</a>
|
|
|
|
</header>
|
|
|
|
<!-- Versions -->
|
|
<versions :file="content" :content="content.versions" v-if="versionsActive && isCode"></versions>
|
|
|
|
<!-- Viewer / Code -->
|
|
<viewer :differences-active="differencesActive" v-if="isCode"></viewer>
|
|
|
|
<!-- Preview -->
|
|
<div class="preview" v-if="isImage">
|
|
<img :src="downloadUrl">
|
|
</div>
|
|
|
|
<!-- Can't read -->
|
|
<div class="cant-read" v-if="!isCode && !isImage">
|
|
<br>Sorry, I can't read this file.
|
|
<br>But you can <a :href="downloadUrl" download>download it</a>
|
|
</div>
|
|
</div> |