Change src to assets

wp-content/themes/twentynineteen-tailwindcss/assets/css/components/avatars.css

@@ -0,0 +1,3 @@
+.avatar {
+  @apply rounded-full;
+}

wp-content/themes/twentynineteen-tailwindcss/assets/css/components/comment-form.css

@@ -0,0 +1,29 @@
+.comment-form {
+  @apply mt-20;
+
+  > * {
+    @apply mt-4;
+  }
+
+  label {
+    @apply w-full block pb-2;
+    @apply text-sm text-gray-700;
+  }
+
+  input,
+  textarea {
+    @apply w-full p-3 border border-gray-400;
+
+    &:focus {
+      @apply bg-white outline-none border-blue-700;
+    }
+  }
+
+  .form-submit {
+    @apply mt-6;
+  }
+
+  input[type=submit] {
+    @apply w-auto;
+  }
+}

wp-content/themes/twentynineteen-tailwindcss/assets/css/components/comment-list.css

@@ -0,0 +1,47 @@
+.comment-list .comment,
+.comment-author b.fn {
+  @apply mt-12 pl-24 relative w-full block;
+}
+
+.comment-list {
+  .comment-author .avatar,
+  .comment-author > a.url {
+    @apply absolute top-0 left-0;
+  }
+
+  .comment-author > b.fn {
+    @apply pl-0 text-2xl text-black;
+  }
+  .comment-author > b.fn a {
+    @apply text-inherit;
+  }
+
+  .comment-author img {
+    @apply w-16;
+  }
+
+  .comment-metadata {
+    @apply text-sm text-gray-900 flex;
+  }
+  .comment-metadata > .edit-link-sep {
+    @apply mx-1;
+  }
+
+  .comment-content {
+    @apply mt-8 text-base;
+  }
+
+  .comment-reply {
+    @apply mt-6 text-sm;
+  }
+}
+
+.post-author-badge {
+  @apply absolute top-0 left-0 ml-10 w-6 h-6;
+  @apply flex items-center;
+  @apply bg-blue-500 rounded-full p-1;
+
+  > svg {
+    @apply fill-current text-white block;
+  }
+}

wp-content/themes/twentynineteen-tailwindcss/assets/css/components/content.css

@@ -0,0 +1,45 @@
+.markup,
+.comment-content,
+.entry-content {
+  @apply font-serif text-lg leading-loose;
+
+  @screen md {
+    @apply text-xl;
+  }
+
+  > * {
+    @apply max-w-2xl;
+
+    @screen 2xl {
+      @apply max-w-full;
+    }
+  }
+
+  h2 {
+    @apply text-2xl font-bold mt-8 -mb-5;
+  }
+
+  a {
+    @apply text-blue-700 underline;
+
+    &:hover {
+      @apply text-blue-800 no-underline;
+    }
+  }
+
+  * + * {
+    @apply mt-6;
+  }
+
+  p {
+    @apply font-serif;
+  }
+
+  ul {
+    @apply list-disc ml-6;
+  }
+
+  li + li {
+    @apply mt-0;
+  }
+}

wp-content/themes/twentynineteen-tailwindcss/assets/css/components/discussion-avatar-list.css

@@ -0,0 +1,15 @@
+.discussion-avatar-list {
+    @apply flex;
+}
+
+.discussion-avatar-list li {
+  @apply mb-1;
+
+  &:not(:first-child) {
+    @apply -ml-3;
+  }
+}
+
+.discussion-avatar-list img {
+    @apply rounded-full w-10;
+}

wp-content/themes/twentynineteen-tailwindcss/assets/css/components/forms.css

@@ -0,0 +1,22 @@
+textarea,
+input[type=search] {
+  @apply border border-gray-400 p-2 mb-2;
+
+  &:focus {
+    @apply outline-none bg-gray-100;
+  }
+
+  &::placeholder {
+    @apply text-black;
+  }
+}
+
+input[type=submit] {
+  @apply bg-blue-700 text-white block text-lg font-bold cursor-pointer;
+  @apply py-3 px-6 rounded mt-2;
+
+  &:hover,
+  &:focus {
+    @apply bg-blue-800;
+  }
+}

wp-content/themes/twentynineteen-tailwindcss/assets/css/components/post.css

@@ -0,0 +1,37 @@
+.entry-title {
+  @apply text-black text-4xl font-bold mt-6 mb-8;
+
+  @screen md {
+    @apply text-5xl;
+  }
+}
+
+.entry-title a {
+  @apply text-inherit;
+
+  &:hover {
+    @apply text-gray-800 no-underline;
+  }
+}
+
+.entry-header,
+.entry-meta,
+.entry-footer {
+  @apply flex flex-wrap w-full;
+}
+
+.entry-footer {
+  @apply mt-8;
+}
+
+.byline,
+.posted-on,
+.cat-links,
+.comments-link,
+.edit-link {
+  @apply flex items-center mr-4 mb-2;
+
+  svg {
+    @apply mr-2 fill-current text-gray-600;
+  }
+}

wp-content/themes/twentynineteen-tailwindcss/assets/css/components/widgets.css

@@ -0,0 +1,7 @@
+.widget {
+  @apply text-xl;
+}
+
+.widget a {
+  @apply text-blue-700 font-bold;
+}

wp-content/themes/twentynineteen-tailwindcss/assets/css/style.css

@@ -0,0 +1,37 @@
+/*
+Theme Name: Twenty Nineteen - Tailwind CSS
+Template: twentynineteen
+*/
+
+@tailwind base;
+
+a {
+  @apply text-gray-600 no-underline
+}
+
+a:hover,
+a:focus {
+  @apply text-blue-800;
+}
+
+@tailwind components;
+
+h2:before {
+  content: '';
+  @apply w-10 block border-t-2 border-gray-600 mb-4;
+}
+
+.screen-reader-text {
+  @apply absolute opacity-0 pointer-events-none;
+}
+
+@import 'components/avatars.css';
+@import 'components/comment-form.css';
+@import 'components/comment-list.css';
+@import 'components/content.css';
+@import 'components/discussion-avatar-list.css';
+@import 'components/forms.css';
+@import 'components/post.css';
+@import 'components/widgets.css';
+
+@tailwind utilities;