Update table styling

resources/css/app.css

@@ -33,6 +33,7 @@ a {
 @import 'components/markup.css';
 @import 'components/note.css';
 @import 'components/talks/video.css';
+@import 'components/table.css';
 @import 'components/widget.css';
 
 @tailwind utilities;

resources/css/components/table.css

@@ -0,0 +1,16 @@
+.table {
+  th {
+    @apply bg-gray-200 text-left;
+  }
+
+  th,
+  td {
+    @apply px-4 py-2 border border-solid border-gray-300;
+  }
+}
+
+table.is-striped {
+  tbody > tr:not(:nth-child(odd)) td {
+    @apply bg-gray-100;
+  }
+}

source/articles/tags/tag.html

@@ -15,7 +15,7 @@ generator:
 
 {% block content %}
     <div class="table-responsive">
-        <table class="table">
+        <table class="table is-striped">
             <thead>
                 <tr>
                     <th>Post Title</th>