From 71b389de5e004e21085491a3be888172ac20b272 Mon Sep 17 00:00:00 2001
From: Anika Henke <anika@selfthinker.org>
Date: Sun, 22 Jan 2012 11:09:37 +0000
Subject: made a sprite out of all the pagetool icons; changed the revert icon
 to look less like a refresh icon; made active colour less subtle (closes #5)

---
 css/pagetools.css | 46 +++++++++++++++++++++++-----------------------
 1 file changed, 23 insertions(+), 23 deletions(-)

(limited to 'css')

diff --git a/css/pagetools.css b/css/pagetools.css
index 839611baa..d097d36ed 100644
--- a/css/pagetools.css
+++ b/css/pagetools.css
@@ -50,8 +50,9 @@
     min-height: 20px; /* 30 - 2x5 */
     line-height: 20px;
     padding: 5px 40px 5px 5px;
+    background-image: url(images/pagetools/pagetools-sprite.png);
+    background-position: right 0;
     background-repeat: no-repeat;
-    background-position: right center;
     /* add transparent border to prevent jumping when proper border is added on focus */
     border: 1px solid transparent;
     white-space: nowrap;
@@ -82,98 +83,97 @@
     text-decoration: none;
 }
 
-
-/* @todo: add NEW icons */
+/* all available icons in sprite */
 #dokuwiki__pagetools ul li a.edit {
-    background-image: url(images/pagetools/edit.png);
+    background-position: right 0;
 }
 #dokuwiki__pagetools ul li a.edit:hover,
 #dokuwiki__pagetools ul li a.edit:active,
 #dokuwiki__pagetools ul li a.edit:focus {
-    background-image: url(images/pagetools/edit-active.png);
+    background-position: right -45px;
 }
 
 #dokuwiki__pagetools ul li a.create {
-    background-image: url(images/pagetools/create.png);
+    background-position: right -90px;
 }
 #dokuwiki__pagetools ul li a.create:hover,
 #dokuwiki__pagetools ul li a.create:active,
 #dokuwiki__pagetools ul li a.create:focus {
-    background-image: url(images/pagetools/create-active.png);
+    background-position: right -135px;
 }
 
 #dokuwiki__pagetools ul li a.show {
-    background-image: url(images/pagetools/show.png);
+    background-position: right -270px;
 }
 #dokuwiki__pagetools ul li a.show:hover,
 #dokuwiki__pagetools ul li a.show:active,
 #dokuwiki__pagetools ul li a.show:focus {
-    background-image: url(images/pagetools/show-active.png);
+    background-position: right -315px;
 }
 
 #dokuwiki__pagetools ul li a.source {
-    background-image: url(images/pagetools/source.png);
+    background-position: right -360px;
 }
 #dokuwiki__pagetools ul li a.source:hover,
 #dokuwiki__pagetools ul li a.source:active,
 #dokuwiki__pagetools ul li a.source:focus {
-    background-image: url(images/pagetools/source-active.png);
+    background-position: right -405px;
 }
 
 #dokuwiki__pagetools ul li a.draft {
-    background-image: url(images/pagetools/draft.png);
+    background-position: right -180px;
 }
 #dokuwiki__pagetools ul li a.draft:hover,
 #dokuwiki__pagetools ul li a.draft:active,
 #dokuwiki__pagetools ul li a.draft:focus {
-    background-image: url(images/pagetools/draft-active.png);
+    background-position: right -225px;
 }
 
 #dokuwiki__pagetools ul li a.revs {
-    background-image: url(images/pagetools/revisions.png);
+    background-position: right -540px;
 }
 #dokuwiki__pagetools ul li a.revs:hover,
 #dokuwiki__pagetools ul li a.revs:active,
 #dokuwiki__pagetools ul li a.revs:focus,
 .mode_revisions #dokuwiki__pagetools ul li a.revs {
-    background-image: url(images/pagetools/revisions-active.png);
+    background-position: right -585px;
 }
 
 #dokuwiki__pagetools ul li a.backlink {
-    background-image: url(images/pagetools/backlink.png);
+    background-position: right -630px;
 }
 #dokuwiki__pagetools ul li a.backlink:hover,
 #dokuwiki__pagetools ul li a.backlink:active,
 #dokuwiki__pagetools ul li a.backlink:focus,
 .mode_backlink #dokuwiki__pagetools ul li a.backlink {
-    background-image: url(images/pagetools/backlink-active.png);
+    background-position: right -675px;
 }
 
 #dokuwiki__pagetools ul li a.top {
-    background-image: url(images/pagetools/top.png);
+    background-position: right -810px;
 }
 #dokuwiki__pagetools ul li a.top:hover,
 #dokuwiki__pagetools ul li a.top:active,
 #dokuwiki__pagetools ul li a.top:focus {
-    background-image: url(images/pagetools/top-active.png);
+    background-position: right -855px;
 }
 
 #dokuwiki__pagetools ul li a.revert {
-    background-image: url(images/pagetools/revert.png);
+    background-position: right -450px;
 }
 #dokuwiki__pagetools ul li a.revert:hover,
 #dokuwiki__pagetools ul li a.revert:active,
 #dokuwiki__pagetools ul li a.revert:focus,
 .mode_revert #dokuwiki__pagetools ul li a.revert {
-    background-image: url(images/pagetools/revert-active.png);
+    background-position: right -495px;
 }
 
 #dokuwiki__pagetools ul li a.subscribe {
-    background-image: url(images/pagetools/subscribe.png);
+    background-position: right -720px;
 }
 #dokuwiki__pagetools ul li a.subscribe:hover,
 #dokuwiki__pagetools ul li a.subscribe:active,
 #dokuwiki__pagetools ul li a.subscribe:focus,
 .mode_subscribe #dokuwiki__pagetools ul li a.subscribe {
-    background-image: url(images/pagetools/subscribe-active.png);
+    background-position: right -765px;
 }
-- 
cgit v1.2.3