Separate view and data layer, add more crop details, simplify Crop class.

1 files changed, 40 insertions, 12 deletions

diff --git a/css/garden.css b/css/garden.css
index e126ec9..2077bd6 100644
--- a/css/garden.css
+++ b/css/garden.css
@@ -352,21 +352,21 @@ template {
 
 @font-face {
     font-family: 'Linux Libertine';
-    src: url('/fonts/LinLibertine_R.woff');
+    src: url('../fonts/LinLibertine_R.woff');
     font-weight: normal;
     font-style: normal;
 }
 
 @font-face {
     font-family: 'Linux Libertine';
-    src: url('/fonts/LinLibertine_RI.woff');
+    src: url('../fonts/LinLibertine_RI.woff');
     font-weight: normal;
     font-style: italic;
 }
 
 @font-face {
     font-family: 'Linux Libertine';
-    src: url('/fonts/LinLibertine_RB.woff');
+    src: url('../fonts/LinLibertine_RB.woff');
     font-weight: bold;
     font-style: normal;
 }
@@ -375,21 +375,21 @@ template {
 
 @font-face {
     font-family: 'Linux Biolinum';
-    src: url('/fonts/linbio-r-subset.woff');
+    src: url('../fonts/linbio-r-subset.woff');
     font-weight: normal;
     font-style: normal;
 }
 
 @font-face {
     font-family: 'Linux Biolinum';
-    src: url('/fonts/linbio-ri-subset.woff');
+    src: url('../fonts/linbio-ri-subset.woff');
     font-weight: normal;
     font-style: italic;
 }
 
 @font-face {
     font-family: 'Linux Biolinum';
-    src: url('/fonts/linbio-rb-subset.woff');
+    src: url('../fonts/linbio-rb-subset.woff');
     font-weight: bold;
     font-style: normal;
 }
@@ -403,7 +403,6 @@ body {
     font-family: 'Linux Libertine',serif;
     line-height: 140%;
     text-rendering: optimizeLegibility;
-    opacity: 87%;
 }
 
 @media (min-width: 1140px) {
@@ -442,7 +441,7 @@ th, td {
     margin: 0;
 }
 
-tbody tr:nth-child(even) {
+tbody tr:nth-child(odd) {
     background-color: #306082;
 }
 
@@ -467,10 +466,6 @@ img.key {
     max-height: 24px;
 }
 
-.icon-direct-sow {
-    background-image: url("images/direct-sow.svg");
-}
-
 a {
     color: #639bff;
 }
@@ -478,3 +473,36 @@ a {
 a:visited {
     color: #847e87;
 }
+
+.crop {
+    color: #fff;
+}
+
+.crop:hover {
+    cursor: pointer;
+}
+
+.overlay {
+    position: fixed;
+    left: 0;
+    top: 0;
+    z-index: 9;
+    width: 100%;
+    height: 100%;
+    background-color: #000000bb;
+}
+
+.modal {
+    position: fixed;
+    left: 40%;
+    top: 25%;
+    width: 20%;
+    height: 50%;
+    border-radius: 4px;
+    background-color: #121212;
+    padding: 2em;
+}
+
+.detail-subheading {
+    opacity: 60%;
+}