Move components into app.css, remove separate files

resources/css/app.css

@@ -1,10 +1,32 @@
 @tailwind base;
 
+@media (min-height: theme('screens.md')) {
+  main {
+    @apply flex flex-col justify-center h-full
+  }
+}
+
 @tailwind components;
 
-@import 'components/balloon.css';
+.tw-bg-balloon {
-@import 'components/button.css';
+  background-image: url(/themes/dcb2017/images/dcb-bg.jpg)
-@import 'components/main.css';
+}
-@import 'components/markup.css';
+
+.tw-button {
+  @apply block uppercase font-bold text-lg py-3 px-5 text-white no-underline bg-black !important;
+
+  @screen md {
+    @apply w-1/2 inline-flex items-center justify-center mx-2 !important
+  }
+
+  &:hover,
+  &:focus {
+    @apply bg-green-600 text-white !important
+  }
+}
+
+.markup {
+  @apply leading-relaxed
+}
 
 @tailwind utilities;

resources/css/components/balloon.css

@@ -1,3 +0,0 @@
-.tw-bg-balloon {
-  background-image: url(/themes/dcb2017/images/dcb-bg.jpg);
-}

resources/css/components/button.css

@@ -1,11 +0,0 @@
-.tw-button {
-  @apply block uppercase font-bold text-lg py-3 px-5 text-white no-underline bg-black !important;
-  @screen md {
-    @apply w-1/2 inline-flex items-center justify-center mx-2 !important
-  }
-
-  &:hover,
-  &:focus {
-    @apply bg-green-600 text-white !important
-  }
-}

resources/css/components/main.css

@@ -1,5 +0,0 @@
-@media (min-height: theme('screens.md')) {
-  main {
-    @apply flex flex-col justify-center h-full
-  }
-}

resources/css/components/markup.css

@@ -1,3 +0,0 @@
-.markup {
-  @apply leading-relaxed
-}