From 504513d1b47a8dfc9dccfca7b7113bbfdfbaa21c Mon Sep 17 00:00:00 2001
From: David Gay <david@davidgay.org>
Date: Mon, 5 Apr 2021 23:28:30 -0400
Subject: Basic FE setup

---
 app/javascript/stylesheets/application.css |  4 +++-
 app/javascript/stylesheets/components.css  |  0
 app/javascript/stylesheets/core.css        | 10 ++++++++++
 app/javascript/stylesheets/typography.css  |  0
 app/views/application/_footer.html.erb     |  7 +++++++
 app/views/application/_header.html.erb     |  7 +++++++
 app/views/home/index.html.erb              | 15 +++++++++++++--
 app/views/layouts/application.html.erb     | 10 ++++++++--
 postcss.config.js                          |  2 +-
 9 files changed, 49 insertions(+), 6 deletions(-)
 create mode 100644 app/javascript/stylesheets/components.css
 create mode 100644 app/javascript/stylesheets/core.css
 create mode 100644 app/javascript/stylesheets/typography.css
 create mode 100644 app/views/application/_footer.html.erb
 create mode 100644 app/views/application/_header.html.erb

diff --git a/app/javascript/stylesheets/application.css b/app/javascript/stylesheets/application.css
index 229e18d..e53c520 100644
--- a/app/javascript/stylesheets/application.css
+++ b/app/javascript/stylesheets/application.css
@@ -1,6 +1,8 @@
 @import "tailwindcss/base";
 @import "tailwindcss/components";
 
-/* Other imports go here. */
+@import "core.css";
+@import "components.css";
+@import "typography.css";
 
 @import "tailwindcss/utilities";
diff --git a/app/javascript/stylesheets/components.css b/app/javascript/stylesheets/components.css
new file mode 100644
index 0000000..e69de29
diff --git a/app/javascript/stylesheets/core.css b/app/javascript/stylesheets/core.css
new file mode 100644
index 0000000..a174cfb
--- /dev/null
+++ b/app/javascript/stylesheets/core.css
@@ -0,0 +1,10 @@
+a {
+  @apply underline text-blue-800;
+}
+a:hover {
+  @apply text-blue-500;
+}
+
+p {
+  margin-top: 1rem;
+}
diff --git a/app/javascript/stylesheets/typography.css b/app/javascript/stylesheets/typography.css
new file mode 100644
index 0000000..e69de29
diff --git a/app/views/application/_footer.html.erb b/app/views/application/_footer.html.erb
new file mode 100644
index 0000000..d4ba8fb
--- /dev/null
+++ b/app/views/application/_footer.html.erb
@@ -0,0 +1,7 @@
+<footer class="flex justify-center p-2 text-gray-500">
+  <div>
+    Appendix Q is free and open-source software licensed under the AGPL v3+. You can
+    <%= link_to "view the source", "https://github.com/dtgay/appendix-q" %>,
+    <%= link_to "report a bug, or request a feature", "https://github.com/dtgay/appendix-q/issues" %>.
+  </div>
+</footer>
diff --git a/app/views/application/_header.html.erb b/app/views/application/_header.html.erb
new file mode 100644
index 0000000..0b317ad
--- /dev/null
+++ b/app/views/application/_header.html.erb
@@ -0,0 +1,7 @@
+<header class="flex justify-between px-4 py-2">
+  <div>
+    <span class="text-xl">Appendix Q</span>
+  </div>
+  <div>
+  </div>
+</header>
diff --git a/app/views/home/index.html.erb b/app/views/home/index.html.erb
index d87f31a..e255981 100644
--- a/app/views/home/index.html.erb
+++ b/app/views/home/index.html.erb
@@ -1,3 +1,14 @@
-<h1>Appendix Q</h1>
+<p><span class="font-bold">Welcome to Appendix Q.</span></p>
 
-<p class="font-bold">Testing Tailwind</p>
+<p>Appendix Q is intended to eventually be a collection of free tools and utilities for use with various tabletop
+  role-playing games, for gamemasters and players alike.</p>
+
+<p>This is a brand new project by one person (myself). I've recently started running a
+  <%= link_to "PTU", "https://pokemontabletop.com/" %> game for my group, and the available community tools for
+  this system are either out of date or don't have all the features I want. So I figured I'd make them myself.
+  Likely, tools for other systems will come along as well.</p>
+
+<p>If you'd like to see a certain tool made,
+  <%= link_to "open an issue on GitHub", "https://github.com/dtgay/appendix-q/issues" %>
+  or send an email to <%= link_to "hello@davidgay.org", "mailto:hello@davidgay.org" %>. If you know how to program,
+  you can also fork Appendix Q on GitHub and submit a pull request with the feature!</p>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 303ac9d..ac331aa 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html lang="en">
   <head>
     <title>AppendixQ</title>
     <meta name="viewport" content="width=device-width,initial-scale=1">
@@ -11,6 +11,12 @@
   </head>
 
   <body>
-    <%= yield %>
+    <div class="flex flex-col min-h-screen">
+      <%= render "header" %>
+      <div class="container mx-auto flex-grow">
+        <%= yield %>
+      </div>
+      <%= render "footer" %>
+    </div>
   </body>
 </html>
diff --git a/postcss.config.js b/postcss.config.js
index d5a930f..b6a0e42 100644
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -1,7 +1,7 @@
 module.exports = {
   plugins: [
-    require('tailwindcss'),
     require('postcss-import'),
+    require('tailwindcss'),
     require('postcss-flexbugs-fixes'),
     require('postcss-preset-env')({
       autoprefixer: {
-- 
cgit v1.2.3