Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 8 additions & 20 deletions src/components/ImageViewer.vue
Original file line number Diff line number Diff line change
@@ -1,46 +1,34 @@
<template>
<div :class="['my-8', { 'text-center': centered }]">
<div class="my-8">
<a :href="linkUrl" target="_blank" rel="noreferrer">
<img
:src="imageUrl"
:alt="imageAlt"
:style="{
width: '100%',
maxWidth: maxWidth,
borderRadius: borderRadius,
border: '1px solid var(--vp-c-border)',
boxShadow: '0 4px 12px rgba(0, 0, 0, 0.1)',
}"
class="transition-transform duration-200 ease-in-out hover:-translate-y-1 hover:shadow-xl"
class="border-border w-full rounded-lg border shadow-lg transition-transform duration-200 ease-in-out hover:-translate-y-1 hover:shadow-xl"
/>
</a>
<p v-if="caption" class="mt-4 font-medium">
<a
<Button
:href="linkUrl"
target="_blank"
rel="noreferrer"
class="text-primary hover:text-primary2 inline-flex items-center gap-2 no-underline transition-colors duration-200"
class="text-primary hover:text-primary2 inline-flex items-center gap-2 rounded-lg no-underline transition-colors duration-200"
>
{{ caption }}
</a>
</Button>
</p>
</div>
</template>

<script setup lang="ts">
import Button from './ui/Button.vue';

interface Props {
imageUrl: string;
imageAlt: string;
linkUrl: string;
caption?: string;
centered?: boolean;
maxWidth?: string;
borderRadius?: string;
}

withDefaults(defineProps<Props>(), {
centered: true,
maxWidth: '800px',
borderRadius: '8px',
});
defineProps<Props>();
</script>
4 changes: 0 additions & 4 deletions src/overview/tooling-and-explorers/iexec-explorer.md
Original file line number Diff line number Diff line change
Expand Up @@ -110,17 +110,13 @@ Browse and analyze all tasks across the iExec network:
image-alt="Result Decryption"
link-url="https://explorer.iex.ec/bellecour/tasks"
caption="🔗 Explore Tasks"
:centered="true"
max-width="700px"
/>

<ImageViewer
image-url="/assets/tooling-&-explorers/iexec-explorer/task-details-completed.png"
image-alt="Task Completed"
link-url="https://explorer.iex.ec/bellecour/tasks"
caption="🔗 Explore Tasks"
:centered="true"
max-width="700px"
/>

> **🔗 Task Assets**: Each task involves four key assets working together: the
Expand Down