arthur/website-old
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/website-old.git synced 2026-02-01 12:47:55 +01:00
Code Issues 31 Packages Projects Releases Wiki Activity

Improve work design + add go back arrow

Browse Source
This commit is contained in:
Arthur Danjou
2020-12-06 12:57:50 +01:00
parent 4f7044dc7a
commit 728a0261af
3 changed files with 24 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
pages/work/_id.vue
View File

@@ -1,7 +1,21 @@
<template>
<main class="px-5 xl:px-64 mb-16 md:mb-32">
<div class="w-full flex flex-col lg:flex-row items-center mt-8 md:mt-32">
<div class="w-full flex flex-col lg:flex-row items-center md:items-start mt-8 md:mt-32">
<div class="w-full lg:w-1/2 flex flex-col items-center">
<div class="md:mb-24">
<div class="mb-4 flex">
<nuxt-link to="/work" class="back-arrow flex">
<div class="duration-300 arrow">
<svg height="25" width="25" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18" />
</svg>
</div>
<div class="ml-2">
{{ $t('work_go_back') }}
</div>
</nuxt-link>
</div>
</div>
<img class="w-4/5 rounded-xl" :src="'http://localhost:5555/files/' + cover" alt="Project Img" />
<a
class="mt-4 py-3 px-6 rounded-full cursor-pointer duration-300 mb-10 lg:mb-0"
@@ -75,6 +89,12 @@ export default {
}
</script>
<style scoped>
<style scoped lang="scss">
.back-arrow:hover .arrow {
transform: translate(-8px, -1px);
}
.arrow {
transform: translate(3px, -1px);
}
</style>