Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/danielroe/roe.dev. This is the code and content for my personal website, built in Nuxt. roe.dev
Something went wrong. Try again.
1.3 kB · 45 lines
Vue
at ci/nightly
12345678910111213141516171819202122232425262728293031323334353637383940414243444546<script setup lang="ts">const clients = { Comcast: ['comcast.svg', { height: 32, width: 80 }], 'Durham University': ['durham-university.svg', { height: 32, width: 80 }], 'Parent Scheme': ['parentscheme.svg', { height: 32, width: 80 }], Concision: ['concision.svg', { height: 32, width: 80 }], 'North East Local Enterprise Partnership': [ 'nelep.png', { height: 32, width: 86 }, ], Convoke: ['convoke.png', { height: 32, width: 181 }], 'Acadian Software': ['acadian-software.svg', { height: 32, width: 80 }], NuxtLabs: ['nuxtlabs.svg', { height: 32, width: 80 }], Canvas8: ['canvas8.svg', { height: 32, width: 80 }], 'Imperial Enterprise Lab': [ 'imperial-enterprise-lab.svg', { height: 32, width: 80 }, ],}</script>
<template> <section :class="$style.logos" class="flex flex-row flex-wrap justify-center items-center my-12 gap-8" > <nuxt-picture v-for="([image, dimensions], name) in clients" :key="name" :alt="name" :src="`/img/work/${image}`" v-bind="dimensions" /> </section></template>
<style module>.logos > * { @apply h-full w-auto flex-grow-0 flex-shrink max-h-8 max-w-[5rem];}
:global(.light-mode) .logos img { filter: invert(1) opacity(0.8);}</style>