main page! and other layout stuff

8 files changed, 117 insertions, 6 deletions

@@ -10,8 +10,8 @@
 
     a {
       display: block;
-      width: 1110px;
-      height: 454px;
+      width: 600px;
+      height: 245px;
       text-indent: -5000px;
       text-decoration: none;
       margin: 0;
@@ -169,3 +169,85 @@ input[type="range"]::-ms-thumb {
     padding: 0;
   }
 }
+
+#current-date {
+  margin-top: 1em;
+  text-align: center;
+}
+
+#choose-difficulty {
+  margin: 1em auto 2em;
+  width: max-content;
+  display: flex;
+}
+
+#normal-link {
+  width: 215px;
+  margin-right: 1em;
+
+  a {
+    background-image: image-url("wittle/wittle_normal.png");
+    background-size: cover;
+    display: block;
+    width: 215px;
+    height: 215px;
+    text-indent: -5000px;
+    text-decoration: none;
+    margin: 0;
+  }
+}
+
+#hard-link {
+  width: 215px;
+  margin-right: 1em;
+
+  a {
+    background-image: image-url("wittle/wittle_hard.png");
+    background-size: cover;
+    display: block;
+    width: 215px;
+    height: 215px;
+    text-indent: -5000px;
+    text-decoration: none;
+    margin: 0;
+  }
+}
+
+#expert-link {
+  width: 215px;
+
+  a {
+    background-image: image-url("wittle/wittle_expert.png");
+    background-size: cover;
+    display: block;
+    width: 215px;
+    height: 215px;
+    text-indent: -5000px;
+    text-decoration: none;
+    margin: 0;
+  }
+}
+
+.summary {
+  width: 50%;
+  min-width: 600px;
+  margin: 0 auto 1em;
+}
+
+.puzzle-status {
+  text-align: center;
+  margin-bottom: 0;
+}
+
+.breadcrumb {
+  text-align: center;
+
+  a, a:visited {
+    color: #555d66;
+    text-decoration: none;
+  }
+
+  a:hover {
+    text-decoration: underline;
+  }
+}
@@ -2,8 +2,16 @@ module Wittle
   class PuzzlesController < ApplicationController
     def about
       @normal_puzzle = Puzzle.normal.order(created_at: :desc).first
+      @normal_started = ((session[:started_puzzles] || []).include? @normal_puzzle.id)
+      @normal_solved = ((session[:played_puzzles] || []).include? @normal_puzzle.id)
+
       @hard_puzzle = Puzzle.hard.order(created_at: :desc).first
+      @hard_started = ((session[:started_puzzles] || []).include? @hard_puzzle.id)
+      @hard_solved = ((session[:played_puzzles] || []).include? @hard_puzzle.id)
+
       @expert_puzzle = Puzzle.expert.order(created_at: :desc).first
+      @expert_started = ((session[:started_puzzles] || []).include? @expert_puzzle.id)
+      @expert_solved = ((session[:played_puzzles] || []).include? @expert_puzzle.id)
     end
 
     def index
@@ -1,4 +1,23 @@
-%p by Hatkirby, with help from Sigma144 and jbzdarkid
-%p= link_to "Normal", @normal_puzzle
-%p= link_to "Hard", @hard_puzzle
-%p= link_to "Expert", @expert_puzzle
+%p.summary <strong>Wittle</strong> gives you daily randomly-generated puzzles in the style of those from the 2016 indie game, <a href="http://the-witness.net">The Witness</a>. There are three difficulties of puzzles to choose from:
+%h2#current-date= @normal_puzzle.created_at.strftime("%B %-d, %Y")
+%nav#choose-difficulty
+  #normal-link
+    = link_to "Normal", @normal_puzzle
+    - if @normal_solved
+      %p.puzzle-status Solved!
+    - elsif @normal_started
+      %p.puzzle-status Started
+  #hard-link
+    = link_to "Hard", @hard_puzzle
+    - if @hard_solved
+      %p.puzzle-status Solved!
+    - elsif @hard_started
+      %p.puzzle-status Started
+  #expert-link
+    = link_to "Expert", @expert_puzzle
+    - if @expert_solved
+      %p.puzzle-status Solved!
+    - elsif @expert_started
+      %p.puzzle-status Started
+%p.summary Wittle was created by <a href="https://www.fourisland.com/">Hatkirby</a>, with major help from <a href="https://github.com/sigma144/">Sigma144</a> (who wrote the puzzle generation code) and <a href="https://github.com/jbzdarkid">jbzdarkid</a> (who wrote the puzzle solving web interface). If you encounter any bugs, or have feedback regarding puzzle difficulty level, feel free to contact me! I am <code>hatkirby</code> on Discord, and you can also find me in the <a href="https://discord.gg/0nJwyUyYIfTEgSz0">Witness Speedrunning server</a>.
+%p.summary There is an <a href="#{ archive_path }">archive of past puzzles</a> for those interested.
@@ -1,3 +1,4 @@
+.breadcrumb= link_to "← Back to home page", root_path
 %h1 Archive
 %table#archive
   %tr
@@ -1,3 +1,4 @@
+.breadcrumb= link_to "← Back to home page", root_path
 %h1 Wittle ##{@puzzle.id}
 .puzzle-description #{@puzzle.category.capitalize} - #{@puzzle.created_at.strftime("%B %-d, %Y")}
 #puzzle-container{ style: "display: flex; justify-content: center; align-items: center" }