Allow single-line citations with pop-downs below containing metadata.

omeka · Dec 21, 2015 · 4c1fbe3 · 4c1fbe3
1 parent 6a7b953
commit 4c1fbe3
Show file tree

Hide file tree

Showing 7 changed files with 279 additions and 171 deletions.
diff --git a/config.ini b/config.ini
@@ -1,12 +1,17 @@
 [config]
 
-;Background
+;Appearance
 background_image.type = "file"
 background_image.options.label = "Background Image"
 background_image.options.description = "Choose an image file to use as a background for the area outside the content. This image will repeat hoizontally and vertically. If absent, the bavkground will be a solid colour"
 background_image.options.validators.count.validator = "Count"
 background_image.options.validators.count.options.max = "1"
 
+single_line_item.type = "checkbox"
+single_line_item.options.label = "Single Line Item"
+single_line_item.options.description = "Check this box if you wish items to appear as a list-like single line caption with more information available on mouse-over."
+single_line_item.options.value = "1"
+
 ; Logo
 logo.type = "file"
 logo.options.label = "Logo File"
@@ -123,6 +128,7 @@ still_image_type.options.value = "Still Image"
 
 head_foot.options.legend = "Page Design"
 head_foot.elements[] = "background_image"
+head_foot.elements[] = "single_line_item"
 head_foot.elements[] = "logo"
 head_foot.elements[] = "header_image"
 head_foot.elements[] = "footer_text"

diff --git a/css/sass/_base.scss b/css/sass/_base.scss
@@ -5,7 +5,7 @@ $base-line-height: 18px;
 
 $title-stack: 'Playfair Display', "Palatino Linotype", "Book Antiqua", "Times New Roman", Times, serif;
 $header-stack: 'Playfair Display SC','Playfair Display', "Palatino Linotype", "Book Antiqua", "Times New Roman", Times, serif;
-$item-stack: 'Arvo', sans-serif;
+$minor-header-stack: 'Arvo', sans-serif;
 $monospace-stack: 'Courier New',Courier,'Lucida Sans Typewriter','Lucida Typewriter',monospace;
 $blueprint-blue: #103c63;
 $header-color: $blueprint-blue;

diff --git a/css/sass/_screen.scss b/css/sass/_screen.scss
@@ -54,11 +54,12 @@ input[type=text], input[type=password], textarea {
     }
 
     h4, h5 {
+        font-family: $minor-header-stack;
         font-size: 1.25 * $base-font-size;
         line-height: $base-line-height;
     }
 
-    h4 { font-weight:bold; }
+    h4 { font-weight: normal; }
 
     h5 { font-style:italic; }
 
@@ -674,7 +675,7 @@ nav + .exhibit {
     }
 
     h3 {
-        font-family: $item-stack;
+        font-family: $minor-header-stack;
         font-size: $base-font-size;
         margin-top: 0;
     }
@@ -761,8 +762,6 @@ ul.title-list {
 
 .browse .item {
     clear: both;
-    border-bottom:1px solid #eee;
-    padding: rhythm(2) 0;
     float: left;
     width: 100%;
 }
@@ -846,16 +845,49 @@ ul.title-list {
         font-size:360%;
     }
 
+.single-line {
+    display: block;
+    margin-left: 1em;
+    margin-right: 1em;
+
+    a {
+        text-decoration: none;
+    }
+
+    h4 {
+        display: inline;
+        font-size: $base-font-size;
+        line-height: $base-line-height;
+    }
+
+    .item-meta {
+        display: none;
+        position: relative;
+        overflow: auto;
+        padding: 1ex;
+        margin-right: 1ex;
+    }
+}
+
+.single-line::before {
+    content: '•';
+    padding-right: 0.5ex;
+}
+
+.single-line:hover {
+    border: #c0c0c0 thin solid;
+
+    .item-meta {
+        display: block;
+    }
+}
+
 
 /* @end */
 
 /* @group ----- Items/Browse ----- */
 
-.browse .item h2 {
-    font-family: $item-stack;
-    font-size: 1.2 * $base-font-size;
-    line-height: $base-line-height;
-    max-width: 100%;
+.browse .item h4 {
     overflow: hidden;
 }
 
@@ -1005,7 +1037,7 @@ ul.title-list {
 }
 
 #collection-items .item h3 {
-     font-family: $item-stack;
+     font-family: $minor-header-stack;
  }
 
 .collection-meta {
@@ -1139,6 +1171,11 @@ footer {
     }
 }
 
+#footer-content {
+    margin-left: 1em;
+    margin-right: 1em;
+}
+
 #footer-text {
     float:left;
     width: 48%;
@@ -1158,13 +1195,7 @@ footer {
 
     @media only screen and (min-width: 768px) and (max-width: 959px) {
         width: skeleton-column-width(4, $tablet-width); }
-
-    h4 {
-        font-family: 'Playfair Display', serif;
-        font-weight: 700;
-        text-transform: uppercase;
-    }
-
+
     a { text-decoration: none; }
 
     & > ul { 

diff --git a/css/style.css b/css/style.css
@@ -1,3 +1,4 @@
+@charset "UTF-8";
 /*! normalize.css v3.0.2 | MIT License | git.io/normalize */
 /**
  * 1. Set default font family to sans-serif.
@@ -452,12 +453,13 @@ h3 {
 }
 
 h4, h5 {
+  font-family: "Arvo", sans-serif;
   font-size: 15px;
   line-height: 18px;
 }
 
 h4 {
-  font-weight: bold;
+  font-weight: normal;
 }
 
 h5 {
@@ -1333,8 +1335,6 @@ ul.title-list {
 
 .browse .item {
   clear: both;
-  border-bottom: 1px solid #eee;
-  padding: 3em 0;
   float: left;
   width: 100%;
 }
@@ -1428,13 +1428,42 @@ ul.title-list {
   font-size: 360%;
 }
 
+.single-line {
+  display: block;
+  margin-left: 1em;
+  margin-right: 1em;
+}
+.single-line a {
+  text-decoration: none;
+}
+.single-line h4 {
+  display: inline;
+  font-size: 12px;
+  line-height: 18px;
+}
+.single-line .item-meta {
+  display: none;
+  position: relative;
+  overflow: auto;
+  padding: 1ex;
+  margin-right: 1ex;
+}
+
+.single-line::before {
+  content: '•';
+  padding-right: 0.5ex;
+}
+
+.single-line:hover {
+  border: #c0c0c0 thin solid;
+}
+.single-line:hover .item-meta {
+  display: block;
+}
+
 /* @end */
 /* @group ----- Items/Browse ----- */
-.browse .item h2 {
-  font-family: "Arvo", sans-serif;
-  font-size: 14.4px;
-  line-height: 18px;
-  max-width: 100%;
+.browse .item h4 {
   overflow: hidden;
 }
 
@@ -1816,6 +1845,11 @@ footer nav + p {
   text-align: right;
 }
 
+#footer-content {
+  margin-left: 1em;
+  margin-right: 1em;
+}
+
 #footer-text {
   float: left;
   width: 48%;
@@ -1836,11 +1870,6 @@ footer nav + p {
     width: 172px;
   }
 }
-#exhibit-pages h4 {
-  font-family: 'Playfair Display', serif;
-  font-weight: 700;
-  text-transform: uppercase;
-}
 #exhibit-pages a {
   text-decoration: none;
 }