From: Florian Forster <ff@octo.it>
Date: Sun, 27 Jun 2010 11:56:53 +0000 (+0200)
Subject: share/collection.js: Add the navigation buttons to the graphs.
X-Git-Tag: v4.0.0~174
X-Git-Url: https://git.verplant.org/?a=commitdiff_plain;h=d23e04f683e1b8e1aefb9d659cf30eec4881f66b;p=collection4.git

share/collection.js: Add the navigation buttons to the graphs.

They don't work yet, though.
---

diff --git a/share/collection.js b/share/collection.js
index 75391b9..d3fb11c 100644
--- a/share/collection.js
+++ b/share/collection.js
@@ -81,6 +81,22 @@ $(document).ready(function() {
     {
       update_search_suggestions ();
     });
+
+    $(".graph-img").append ("<div class=\"graph-buttons presets\">"
+        + "<div class=\"graph-button\" >H</div>"
+        + "<div class=\"graph-button\" >D</div>"
+        + "<div class=\"graph-button\" >W</div>"
+        + "<div class=\"graph-button\" >M</div>"
+        + "<div class=\"graph-button\" >Y</div>"
+        + "<div class=\"graph-button\" >!</div>"
+        + "</div>"
+        + "<div class=\"graph-buttons navigation\">"
+        + "<div class=\"graph-button\" >←</div>"
+        + "<div class=\"graph-button\" >−</div>"
+        + "<div class=\"graph-button\" >+</div>"
+        + "<div class=\"graph-button\" >→</div>"
+        + "</div>"
+        );
 });
 
 /* vim: set sw=2 sts=2 et fdm=marker : */
diff --git a/share/style.css b/share/style.css
index 094a4ae..ad83577 100644
--- a/share/style.css
+++ b/share/style.css
@@ -47,6 +47,13 @@ a:hover
 	vertical-align: top;
 }
 
+#layout-middle-center h1,
+#layout-middle-center h2,
+#layout-middle-center h3
+{
+	clear: both;
+}
+
 #logo-canvas
 {
 	display: block;
@@ -153,3 +160,54 @@ a:hover
 	border-bottom: 1px solid silver;
 	background-color: rgb(252,252,252);
 }
+
+.graph-img
+{
+	position: relative;
+	float: left;
+	clear: both;
+}
+
+.graph-img .graph-buttons.navigation
+{
+	position: absolute;
+	right: 5px;
+	bottom: 5px;
+}
+
+.graph-img .graph-buttons.presets
+{
+	position: absolute;
+	right: 5px;
+	top: 5px;
+}
+
+.graph-buttons .graph-button
+{
+	width: 1em;
+	height: 1em;
+	border: 1px solid gray;
+	text-align: center;
+	background-color: rgba(255,255,255,.8);
+	color: gray;
+	cursor: pointer;
+}
+
+.graph-buttons .graph-button:hover
+{
+	border: 1px solid black;
+	background-color: white;
+	color: black;
+}
+
+.graph-buttons.navigation .graph-button
+{
+	float: left;
+	margin-left: 1px;
+}
+
+.graph-buttons.presets .graph-button
+{
+	margin-bottom: 1px;
+}
+