opdavies/rebuilding-platformsh
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Make ProjectCard clickable

Browse source
This commit is contained in:
Oliver Davies 2019-04-24 10:33:06 +01:00
parent 9b8695eb52
commit adfc0ae3f5
2 changed files with 13 additions and 11 deletions

22
src/components/ProjectCard.vue
View file

@ -1,17 +1,19 @@
<template>
<article class="w-full sm:w-1/2 md:w-1/3 px-4 mb-8">
<div class="bg-gray-100 shadow-lg rounded overflow-hidden">
<div class="p-6">
<h2 class="font-bold text-gray-800">Drupal Bristol</h2>
<a href="#" class="group">
<span class="block bg-gray-100 shadow-lg rounded overflow-hidden">
<span class="block p-6">
<h2 class="font-bold text-gray-800 group-hover:underline">Drupal Bristol</h2>
<p class="text-gray-600">accounts-partners</p>
<p class="text-gray-600">accounts-partners</p>
<img src="/download.jpeg" alt="" class="shadow-2xl rounded mt-4">
</div>
<img src="/download.jpeg" alt="" class="shadow-2xl rounded mt-4">
</span>
<div class="bg-white py-5 px-8 -mt-24 relative">
<p>Europe (West 1)</p>
</div>
</div>
<span class="block bg-white py-5 px-8 -mt-24 relative">
<p>Europe (West 1)</p>
</span>
</span>
</a>
</article>
</template>

2
tailwind.config.js
View file

@ -14,7 +14,7 @@ module.exports = {
},
variants: {
backgroundColor: [...defaultConfig.variants.backgroundColor, 'hocus', 'group-hocus'],
textDecoration: [...defaultConfig.variants.textDecoration, 'hocus', 'group-hocus']
textDecoration: [...defaultConfig.variants.textDecoration, 'group-hover', 'hocus', 'group-hocus']
},
plugins: [
require('tailwindcss-interaction-variants')(),