1
0
Fork 0

fix: margin on small displays

This commit is contained in:
Ava Gaiety Wroten 2021-12-29 15:16:15 -06:00
parent c2cbc11c8b
commit c765592096
3 changed files with 19 additions and 18 deletions

View file

@ -1,6 +1,6 @@
<template> <template>
<!-- Hero card --> <!-- Hero card -->
<div class="relative"> <div class="relative md:mt-4">
<div class="absolute inset-x-0 bottom-0 h-1/2 bg-gray-100" /> <div class="absolute inset-x-0 bottom-0 h-1/2 bg-gray-100" />
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8"> <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
<div class="relative shadow-xl sm:rounded-2xl sm:overflow-hidden"> <div class="relative shadow-xl sm:rounded-2xl sm:overflow-hidden">
@ -16,7 +16,7 @@
/> />
</h1> </h1>
<p <p
class="mt-6 max-w-lg mx-auto text-center text-xl text-indigo-500 sm:max-w-3xl" class="mt-6 p-4 rounded-md max-w-lg mx-auto text-xl bg-pink-800 bg-opacity-40 text-pink-100 sm:max-w-3xl"
> >
...there was a queer tale of fantasy tabletop roleplaying games. ...there was a queer tale of fantasy tabletop roleplaying games.
Join Gaiety on a journey through her favorite game systems, Join Gaiety on a journey through her favorite game systems,
@ -30,13 +30,13 @@
> >
<a <a
href="#videolist" href="#videolist"
class="flex items-center justify-center px-4 py-3 border border-transparent text-base font-medium rounded-md shadow-sm text-indigo-700 bg-white hover:bg-indigo-50 sm:px-8" class="flex items-center justify-center px-4 py-3 border border-transparent text-base font-medium rounded-md shadow-sm text-pink-600 bg-white hover:bg-pink-50 sm:px-8"
> >
Watch Watch
</a> </a>
<a <a
href="https://ko-fi.com/gaiety" href="https://ko-fi.com/gaiety"
class="flex items-center justify-center px-4 py-3 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-indigo-500 bg-opacity-60 hover:bg-opacity-70 sm:px-8" class="flex items-center justify-center px-4 py-3 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-pink-500 bg-opacity-60 hover:bg-opacity-70 sm:px-8"
> >
Support Support
</a> </a>

View file

@ -1,5 +1,3 @@
import tailwindAspectRatio from '@tailwindcss/aspect-ratio'
export default { export default {
// Global page headers: https://go.nuxtjs.dev/config-head // Global page headers: https://go.nuxtjs.dev/config-head
head: { head: {
@ -35,18 +33,6 @@ export default {
'@nuxtjs/tailwindcss', '@nuxtjs/tailwindcss',
], ],
tailwindcss: {
config: {
plugins: [tailwindAspectRatio],
},
// theme: {
// colors: {
// 'brand-bright': '#ca4e8d',
// 'brand-dark': '#83398c',
// },
// },
},
// Modules: https://go.nuxtjs.dev/config-modules // Modules: https://go.nuxtjs.dev/config-modules
modules: [], modules: [],

15
tailwind.config.js Normal file
View file

@ -0,0 +1,15 @@
import tailwindAspectRatio from '@tailwindcss/aspect-ratio'
module.exports = {
config: {
plugins: [tailwindAspectRatio],
},
theme: {
extend: {
colors: {
brandbright: '#ca4e8d',
branddark: '#83398c',
},
},
},
}