refreshed cat

cat/css/iatagger.css

@@ -21,6 +21,60 @@
 	padding:0;
 }
 
+.hidden {
+    display:none;
+}
+
+#help-icon {
+    margin-left:20px;
+    cursor:pointer;
+}
+
+#result {
+    margin-top:10px;
+}
+
+#searchInput {
+    margin-bottom:10px;
+}
+
+#banner .banner-bg {
+	border:none;
+	margin-bottom:10px;
+	background:transparent;
+	width:100%;
+	height:100px;
+}
+
+#banner .banner-icon {
+	border:none;
+	background:transparent;
+	position:absolute;
+	top:5px;
+	right:10px;
+}
+
+
+#banner {
+	height: 100px;
+	margin-bottom: 15px;
+	position: relative;
+}
+#banner h1 {
+	background:transparent;
+	color: #e6e5e5;
+	font-family: Georgia, serif;
+	font-size: 42px;
+	font-style: italic;
+	left: 30px;
+	position: absolute;
+	top: 28px;
+}
+#banner h1 span {
+	display: block;
+	margin-left: 30px;
+}
+
 .suggestionsInvisible {
     display:none;
 }
@@ -97,9 +151,6 @@ a:hover {
 	color: #367889;
 	text-decoration:none;
 }
-a img {
-	border:none;
-}
 h1, h2, h3, h4 {
 	font-weight: normal;
 	margin-bottom:0.5em;

cat/index.html_pattern

@@ -24,21 +24,25 @@
         <div id="header">
         </div>
         <div id="content">
-	        <a href="http://tmconcordia.sourceforge.net/" target="_blank"><img src="../images/banner.jpg" alt="Banner" /></a>
-	        <br/><br/><br/>
+          	<section id="banner">
+		        <h1>Concordia</h1>
+		        <img class="banner-bg" src="../images/banner-thin.png" alt="Banner">
+		        <img class="banner-icon" src="../images/concordia-thin.png" alt="Banner">
+	        </section><!-- // end #banner -->
+            <div id="help" class="hidden">
 	            <p>@desc@</p>
 	            <p>@enjoy@</p>
-            <label for="searchInput">@prompt@</label>
                 <span class="suggestion" onclick="showHideSuggestions()">show/hide samples</span>
                 <br/><br/>
                 <div class="suggestionsInvisible" id="suggestions">
                     <ul>@suggestions@</ul>
                     <br/><br/>
                 </div>
+                <label for="searchInput">@prompt@</label>
+            </div>
             <input id="searchInput" type="text" value="" />
-            <br/><br/>
             <input type="button" value="search" onclick="searchHandle(@tmid@)" />
-            <br/><br/><br/><br/>
+            <img id="help-icon" src="../images/help.png" alt="help" onclick="toggleHelp()" title="show/hide help"/>
             <div id="result">
             
             </div>

cat/js/cat.js

@@ -1,3 +1,7 @@
+function toggleHelp() {
+    $('#help').toggleClass('hidden');
+}
+
 function searchHandle(tmid) {
     var concordiaRequest = {
         operation: 'concordiaSearch',

cat/republish.sh

@@ -0,0 +1,4 @@
+#!/bin/sh
+
+sudo rm -rf /var/www/html/*
+sudo ./publish.py /var/www/html