Finishing off the styling of tabs

diff --git a/dev/tabs-ends.psd b/dev/tabs-ends.psd
new file mode 100644 (file)
index 0000000..f7a2acd
Binary files /dev/null and b/dev/tabs-ends.psd differ

diff --git a/dev/tabs.psd b/dev/tabs.psd
new file mode 100644 (file)
index 0000000..282b514
Binary files /dev/null and b/dev/tabs.psd differ

diff --git a/images/tabs-ends.gif b/images/tabs-ends.gif
new file mode 100644 (file)
index 0000000..5112752
Binary files /dev/null and b/images/tabs-ends.gif differ

diff --git a/images/tabs.gif b/images/tabs.gif
new file mode 100644 (file)
index 0000000..872da6a
Binary files /dev/null and b/images/tabs.gif differ

diff --git a/printer.css.php b/printer.css.php
index 469921ec5c8cd4d07428463c02c44d6c3432002d..49aeb86e7f5338af9c57a47de07978a6e543987c 100755 (executable)
--- a/printer.css.php
+++ b/printer.css.php
@@ -285,23 +285,63 @@ input, textarea, select, option
 {
        float: left;
        
+       font-weight: bold;
+       color: rgb(122, 151, 101);
+       
        text-transform: uppercase;
        text-decoration: none;
        
-       padding: 8px 15px 8px 15px;
+       padding: 8px 0px 8px 0px;
        margin: 0px 1px 0px 0px;
+       
+       background-image: url({$GLOBALS['isso:callback']->webpath}images/tabs.gif);
+       background-repeat: no-repeat;
+       background-position: 0% -35px;
+}
+
+/* Blocks of the tab link */
+#tabbar a span
+{
+       height: 33px;
+       width: 100%;
+       
+       padding: 8px 15px 8px 15px;
+       
+       background-image: url({$GLOBALS['isso:callback']->webpath}images/tabs-ends.gif);
+       background-repeat: no-repeat;
+       background-position: 100% -35px;
 }
 
 /* The current, active tab */
-#tabbar .focus
+#tabbar #focustab, #tabbar #focustab a:hover
 {
-       font-weight: bold;
+       color: rgb(64, 64, 64);
        
-       background-color: white;
+       background-position: 0% 0px;
        
-       border-color: rgb(124, 128, 135);
-       border-width: 1px 1px 0px 1px;
-       border-style: solid;
+       padding: 8px 0px 9px 0px;
+}
+
+/* Blocks of a focused tab link */
+#tabbar #focustab span
+{
+       background-position: 100% 0px;
+       
+       padding-bottom: 9px;
+}
+
+/* Hovered tabs */
+#tabbar a:hover
+{
+       background-position: 0% 35px;
+       
+       color: rgb(143, 236, 9);
+}
+
+/* Blocks of a hovered tab link */
+#tabbar a:hover span
+{
+       background-position: 100% 35px;
 }
 
 /* Main content frame <td> */

diff --git a/printer_navigation.php b/printer_navigation.php
index bfdd83cefa4125ecc5e627c248a8eff7bcaee7f3..90cb7c96ab85f69e5be1fe8e52454f1c314df9f9 100644 (file)
--- a/printer_navigation.php
+++ b/printer_navigation.php
@@ -220,13 +220,13 @@ class Printer_Navigation
                $output .= "\n" . '<div id="tabbar">';
                foreach ($this->tabs AS $key => $content)
                {
-                       $link = "\n\t" . '<a href="' . $content[1] . '" class="tab';
+                       $link = "\n\t" . '<a href="' . $content[1] . '"';
                        if ($this->focus['tab'] == $key)
                        {
-                               $link .= ' focus';
+                               $link .= ' id="focustab"';
                        }
                        
-                       $link .= '"><span>' . $content[0] . '</span></a>';
+                       $link .= '><span>' . $content[0] . '</span></a>';
                        
                        $output .= $link;
                }