Lots more docs changes.

*) added stylesheet.css, tabs.css, tab_?.gif back in

*) refactored so classtree.html splits names that are too long.

*) removed constructor docs and source link from o3d docs (vs o3djs docs)

*) fixed paths in header.html. They used to be statically
   included but now that they are used by both o3d and o3djs
   they needed to have certain paths fixed dynamically.

*) Pull in new nixysa.


Review URL: http://codereview.chromium.org/155526

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@20645 0039d316-1c4b-4281-b951-d872f2087c98

12 files changed, 440 insertions, 24 deletions

diff --git a/o3d/documentation/jsdoc-toolkit-templates/annotated.tmpl b/o3d/documentation/jsdoc-toolkit-templates/annotated.tmpl
index 1388e67..7f87e49 100644
--- a/o3d/documentation/jsdoc-toolkit-templates/annotated.tmpl
+++ b/o3d/documentation/jsdoc-toolkit-templates/annotated.tmpl
@@ -7,7 +7,7 @@
 <!-- Genreated by jsdoctoolkit 2.1.0 -->
 <div class="navigation" id="top">
 </div>
-
+<div class="contents">
 <h1>Class List</h1>
 Here are the classes, structs, unions and interfaces with brief descriptions:
 
diff --git a/o3d/documentation/jsdoc-toolkit-templates/class.tmpl b/o3d/documentation/jsdoc-toolkit-templates/class.tmpl
index 0520705..77a8b4f 100644
--- a/o3d/documentation/jsdoc-toolkit-templates/class.tmpl
+++ b/o3d/documentation/jsdoc-toolkit-templates/class.tmpl
@@ -28,7 +28,7 @@ thisClass = data;
 <if test="thisClass.classDesc">{+sanitizeForEZT(thisClass.classDesc)+}</if>
 <if test="!thisClass.classDesc">{+sanitizeForEZT(thisClass.desc)+}</if>
 
-<if test="thisClass.srcFile.length">
+<if test="getOutputMode() !== 'o3d' && thisClass.srcFile.length">
 <h2>Source</h2>
 <a name="_source" href="http://code.google.com/p/o3d/source/browse/trunk/samples/{+getSourcePath(thisClass)+}">{+getSourcePath(thisClass)+}</a>
 </if>
@@ -48,7 +48,7 @@ thisClass = data;
 <!-- =========== SEE ALSO =========== -->
 
 <!-- ========== CONSTRUCTOR SUMMARY ============== -->
-<if test="!data.isPrivate && !data.isBuiltin() && !data.isNamespace && data.is('CONSTRUCTOR')">
+<if test="shouldWriteConstructor(data)">
   <h2>Constructor</h2>
   <ul>
   <li><a class="el" href="{+data.name+}">{+data.alias+}</a><if test="data.classType != 'Namespace '">{+ makeSignature(data.params) +}</if></li>
@@ -65,10 +65,10 @@ thisClass = data;
     <if test="!method.isPrivate">
         <tr><td><li></li></td>
         <td>
-	<if test="method.isStatic||!method.memberOf">&lt;static&gt; </if>
+        <if test="method.isStatic||!method.memberOf">&lt;Global&gt; </if>
         <if test="method.type.length">{+linkifyTypeSpec(makeName('[Method Summary]', thisClass.alias, method.name), method.type)+}&nbsp;</if>
-	</td>
-	<td><a class="el" href="#{+method.name+}">{+getQualifiedName(method)+}</a>{+makeSignature(method.params)+}</td>
+        </td>
+        <td><a class="el" href="#{+method.name+}">{+getQualifiedName(method)+}</a>{+makeSignature(method.params)+}</td>
         </tr>
     </if>
     </for>
@@ -86,7 +86,7 @@ thisClass = data;
     <if test="!property.isPrivate && !property.isNamespace">
       <tr><td><li></li></td>
       <td>
-      <if test="property.isStatic||!property.memberOf">&lt;static&gt;&nbsp;</if>
+      <if test="property.isStatic||!property.memberOf">&lt;Global&gt;&nbsp;</if>
       {+linkifyTypeSpec(makeName('[Property Summary]', thisClass.alias, property.name), getPropertyType(property))+}
       </td>
       <td><a class="el" href="#{+property.name+}">{+getQualifiedName(property)+}</a></td>
@@ -100,7 +100,7 @@ thisClass = data;
 <!-- =========== END FIELD SUMMARY =========== -->
 
 <!-- ========== CONSTRUCTOR DETAIL ============== -->
-<if test="!data.isPrivate && !data.isBuiltin() && !data.isNamespace && data.is('CONSTRUCTOR')">
+<if test="shouldWriteConstructor(data)">
   <hr/>
   <h2>Constructor</h2>
   <a class="anchor" name="{+data.name+}"></a>
diff --git a/o3d/documentation/jsdoc-toolkit-templates/classtree.tmpl b/o3d/documentation/jsdoc-toolkit-templates/classtree.tmpl
index eddd37a..5080519 100644
--- a/o3d/documentation/jsdoc-toolkit-templates/classtree.tmpl
+++ b/o3d/documentation/jsdoc-toolkit-templates/classtree.tmpl
@@ -3,7 +3,7 @@
     <ul>
       {! var allNamespaces = data.filter(function($){return $.isNamespace}).sort(makeSortby("alias")); !}
       <for each="thisClass" in="allNamespaces">
-      <li><a href="/apis/o3d/docs/reference/{+getBaseURL()+}{+getLinkToClassByAlias(thisClass.alias)+}">{+thisClass.name+}</a></li>
+      <li><a href="/apis/o3d/docs/reference/{+getBaseURL()+}{+getLinkToClassByAlias(thisClass.alias)+}">{+hyphenateWord(thisClass.name, 16, '-<br/>')+}</a></li>
       </for>
     </ul>
   </li>
@@ -11,7 +11,7 @@
     <ul>
       {! var allClasses = data.filter(function($){return !$.isNamespace}).sort(makeSortby("alias")); !}
       <for each="thisClass" in="allClasses">
-      <li><a href="/apis/o3d/docs/reference/{+getBaseURL()+}{+getLinkToClassByAlias(thisClass.alias)+}">{+thisClass.name+}</a></li>
+      <li><a href="/apis/o3d/docs/reference/{+getBaseURL()+}{+getLinkToClassByAlias(thisClass.alias)+}">{+hyphenateWord(thisClass.name, 16, '-<br/>')+}</a></li>
       </for>
     </ul>
   </li>
diff --git a/o3d/documentation/jsdoc-toolkit-templates/members.tmpl b/o3d/documentation/jsdoc-toolkit-templates/members.tmpl
index 8a37abf..0d5946b 100644
--- a/o3d/documentation/jsdoc-toolkit-templates/members.tmpl
+++ b/o3d/documentation/jsdoc-toolkit-templates/members.tmpl
@@ -20,7 +20,7 @@ This is the complete list of members for
 <table>
 
 <!-- ========== CONSTRUCTOR SUMMARY ============== -->
-<if test="!data.isPrivate && !data.isBuiltin() && !data.isNamespace && data.is('CONSTRUCTOR')">
+<if test="shouldWriteConstructor(data)">
 <tr class="memlist"><td><a class="el" href="{+getLinkToClassByAlias(thisClass.alias)+}#{+data.name+}">{+data.alias+}</a><if test="data.classType != 'Namespace '">{+ makeSignature(data.params) +}</if></td><td><a class="el" href="{+getLinkToClassByAlias(thisClass.memberOf)+}">{+thisClass.memberOf+}</a></td><td></td></tr>
 </if>
 
diff --git a/o3d/documentation/jsdoc-toolkit-templates/namespaces.tmpl b/o3d/documentation/jsdoc-toolkit-templates/namespaces.tmpl
index c7d5891..13ccfe4 100644
--- a/o3d/documentation/jsdoc-toolkit-templates/namespaces.tmpl
+++ b/o3d/documentation/jsdoc-toolkit-templates/namespaces.tmpl
@@ -7,7 +7,7 @@
 <!-- Genreated by jsdoctoolkit 2.1.0 -->
 <div class="navigation" id="top">
 </div>
-
+<div class="contents">
 <h1>Module List</h1>
 Here are the modules with brief descriptions:
 
@@ -20,7 +20,6 @@ Here are the modules with brief descriptions:
 
 </div><!-- end contents -->
 </div><!-- end doxygen-ref -->
-
 <!-- ============================== footer ================================= -->
 <!-- begin static/footer.html -->
 {+include("static/footer.html")+}
diff --git a/o3d/documentation/jsdoc-toolkit-templates/publish.js b/o3d/documentation/jsdoc-toolkit-templates/publish.js
index 1040137..41bdf93 100644
--- a/o3d/documentation/jsdoc-toolkit-templates/publish.js
+++ b/o3d/documentation/jsdoc-toolkit-templates/publish.js
@@ -52,7 +52,10 @@ var g_validJSDOCTypes = {
 var g_unknownTypes = { };
 var g_numErrors = 0;
 var g_o3djsMode = false;
+var g_outputMode;
 var g_baseURL;
+var g_topURL;
+var g_templates = [];
 
 /**
  * Called automatically by JsDoc Toolkit.
@@ -65,12 +68,14 @@ function publish(symbolSet) {
     templatesDir: JSDOC.opt.t,
     symbolsDir: '',
     prefix: JSDOC.opt.D.prefix,
-    o3djs: JSDOC.opt.D.o3djs};
+    mode: JSDOC.opt.D.mode};
   publish.conf.srcDir = publish.conf.outDir + 'src/';
   publish.conf.htmlDir = JSDOC.opt.D.htmlOutDir;
   g_baseURL = JSDOC.opt.D.baseURL;
+  g_topURL = JSDOC.opt.D.topURL;
+  g_outputMode = JSDOC.opt.D.mode;
 
-  if (publish.conf.o3djs) {
+  if (publish.conf.mode == 'o3djs') {
     g_o3djsMode = true;
   }
 
@@ -112,7 +117,7 @@ function publish(symbolSet) {
     System.exit(1);
   }
 
-  // some ustility filters
+  // some utility filters
   function hasNoParent($) {return ($.memberOf == '')}
   function isaFile($) {return ($.is('FILE'))}
   function isaClass($) {return ($.is('CONSTRUCTOR') || $.isNamespace)}
@@ -131,6 +136,7 @@ function publish(symbolSet) {
 
   // get a list of all the classes in the symbolset
   var classes = symbols.filter(isaClass).sort(makeSortby('alias'));
+  var filteredClasses = [];
 
   // create each of the class pages
   for (var i = 0, l = classes.length; i < l; i++) {
@@ -146,6 +152,9 @@ function publish(symbolSet) {
     }
 
     print('Generating docs for: ' + symbol.alias);
+
+    filteredClasses.push(symbol);
+
     // Comment these lines in to see what data is available to the templates.
     //print('----------------------------------------------------------------');
     //dumpObject(symbol, 5);
@@ -178,7 +187,7 @@ function publish(symbolSet) {
                 output);
   }
 
-  var classTree = classTreeTemplate.process(classes);
+  var classTree = classTreeTemplate.process(filteredClasses);
   IO.saveFile(publish.conf.outDir, 'classtree.html', classTree);
   IO.saveFile(publish.conf.htmlDir, 'classtree.html', classTree);
 
@@ -186,11 +195,11 @@ function publish(symbolSet) {
   IO.saveFile(publish.conf.outDir, 'filelist.html', fileList);
   IO.saveFile(publish.conf.htmlDir, 'filelist.html', fileList);
 
-  var annotated = annotatedTemplate.process(classes);
+  var annotated = annotatedTemplate.process(filteredClasses);
   IO.saveFile(publish.conf.outDir, 'annotated' + publish.conf.ext, annotated);
   IO.saveFile(publish.conf.htmlDir, 'annotated.html', annotated);
 
-  var namespaces = namespacesTemplate.process(classes);
+  var namespaces = namespacesTemplate.process(filteredClasses);
   IO.saveFile(publish.conf.outDir, 'namespaces' + publish.conf.ext, namespaces);
   IO.saveFile(publish.conf.htmlDir, 'namespaces.html', namespaces);
 
@@ -234,8 +243,18 @@ function makeSortby(attribute) {
  * @return {string} contents of file.
  */
 function include(path) {
-  var path = publish.conf.templatesDir + path;
-  return IO.readFile(path);
+  var template = g_templates[path];
+  if (!template) {
+    try {
+      template = new JSDOC.JsPlate(JSDOC.opt.t + path);
+    } catch (e) {
+      generateError('Could not include: ' + path + '\n' + e);
+      template = '';
+    }
+    g_templates[path] = template;
+  }
+  var output = template.process({});
+  return output;
 }
 
 /**
@@ -786,8 +805,71 @@ function getQualifiedName(method) {
 }
 
 /**
- * Get the base URL for links.
+ * Gets the base URL for links.
  */
 function getBaseURL() {
   return g_baseURL;
 }
+
+/**
+ * Gets the top URL for links.
+ */
+function getTopURL() {
+  return g_topURL;
+}
+
+/**
+ * Returns the output mode.
+ * @return {string} The output mode.
+ */
+function getOutputMode() {
+  return g_outputMode;
+}
+
+/**
+ * Returns true if we should write constructor docs.
+ * @param {!Symbol} symbol The symbol that might have a constructor.
+ * @return {boolean} true if we should write a constructor.
+ */
+function shouldWriteConstructor(symbol) {
+  return g_outputMode != 'o3d' &&
+         !symbol.isPrivate &&
+         !symbol.isBuiltin() &&
+         !symbol.isNamespace &&
+         symbol.is('CONSTRUCTOR');
+}
+
+/**
+ * Splits a camelCase word into an array of word parts.
+ * @param {string} word camelCase word.
+ * @return {!Array.<string>} The word split into word parts.
+ */
+function splitCamelCase(word) {
+  var spacesAdded = word.replace(/([A-Z])/g, ' $1');
+  return spacesAdded.split(' ');
+}
+
+/**
+ * Breaks a word at max_length with hyphens. Assumes word is camelCase
+ * @param {string} word Word to break.
+ * @param {number} maxLength word will continue to be split until no part is
+ *     this longer than this if possible.
+ * @param {string} string to use to join split parts.
+ * @return {string} The word split then joined with joinString.
+ */
+function hyphenateWord(word, maxLength, joinString) {
+  var words = splitCamelCase(word);
+  var hyphenated = '';
+  var newWord = '';
+  for (var ii = 0; ii < words.length; ++ii) {
+    var part = words[ii];
+    var temp = newWord + part;
+    if (temp.length > maxLength) {
+      hyphenated += newWord + joinString;
+      newWord = '';
+    }
+    newWord += part;
+  }
+  hyphenated += newWord;
+  return hyphenated;
+}
diff --git a/o3d/documentation/jsdoc-toolkit-templates/static/header.html b/o3d/documentation/jsdoc-toolkit-templates/static/header.html
index e1b67bc..b5d9bd6 100644
--- a/o3d/documentation/jsdoc-toolkit-templates/static/header.html
+++ b/o3d/documentation/jsdoc-toolkit-templates/static/header.html
@@ -8,8 +8,8 @@
 [#]  <head>
 [#]    [include "/apis/_common_head_elements.ezt"]
 [#]    <link href="/css/semantic_headers.css" rel="stylesheet" type="text/css" />
-[#]    <link href="../stylesheet.css" rel="stylesheet" type="text/css">
-[#]    <link href="../tabs.css" rel="stylesheet" type="text/css">
+[#]    <link href="{+getTopURL()+}stylesheet.css" rel="stylesheet" type="text/css">
+[#]    <link href="{+getTopURL()+}tabs.css" rel="stylesheet" type="text/css">
 [#]  </head>
 [#]
 [#]  <body class="gc-documentation">
diff --git a/o3d/documentation/jsdoc-toolkit-templates/static/stylesheet.css b/o3d/documentation/jsdoc-toolkit-templates/static/stylesheet.css
new file mode 100644
index 0000000..be09224
--- /dev/null
+++ b/o3d/documentation/jsdoc-toolkit-templates/static/stylesheet.css
@@ -0,0 +1,233 @@
+/*
+ * Based off the Doxygen generated template stylesheet and trimmed/edited to
+ * remove items that would conflict with codesite or other overlying
+ * stylesheets while maintaining the desired look and feel.
+ *
+ * The #doxygen-ref is an id tag which encompasses code generated by doxygen
+ * and allows override of standard html tags while not affecting the rest
+ * of the page such as sidebars.
+ */
+
+A.qindex {
+  text-decoration: none;
+  font-weight: bold;
+  color: #1A419D;
+}
+A.qindex:visited {
+  text-decoration: none;
+  font-weight: bold;
+  color: #1A419D
+}
+A.qindex:hover {
+  text-decoration: none;
+  background-color: #ddf;
+}
+A.qindexHL {
+  text-decoration: none;
+  font-weight: bold;
+  background-color: #66c;
+  color: #fff;
+  border: 1px double #9295C2;
+}
+A.qindexHL:hover,
+A.qindexHL:visited {
+  text-decoration: none;
+  background-color: #66c;
+  color: #fff;
+}
+A.el {
+  text-decoration: none;
+  font-weight: bold;
+}
+A.elRef {
+  font-weight: bold;
+}
+A.code:link,
+A.code:visited {
+  text-decoration: none;
+  font-weight: normal;
+  color: #00F;
+}
+A.codeRef:link,
+A.codeRef:visited {
+  font-weight: normal;
+  color: #00F;
+}
+A:hover {
+  text-decoration: none;
+  background-color: #f2f2ff;
+}
+DL.el {
+  margin-left: -1cm;
+}
+.fragment {
+  font-family: Fixed, monospace;
+  font-size: 95%;
+}
+PRE.fragment {
+  border: 1px solid #CCC;
+  background-color: #f5f5f5;
+  margin: 4px 8px 4px 2px
+  padding: 4px 6px;
+}
+DIV.ah {
+  background-color: black;
+  font-weight: bold;
+  color: #fff;
+  margin-bottom: 3px;
+  margin-top: 3px
+}
+TD.md {
+  background-color: #e1e1e4;
+  font-weight: bold;
+  border: none;
+}
+TD.mdPrefix {
+  background-color: #e1e1e4;
+  color: #606060;
+  font-size: 80%;
+  border: none;
+}
+TD.mdname1 {
+  background-color: #e1e1e4;
+  font-weight: bold;
+  color: #602020;
+  border: none;
+}
+.memitem {
+  padding: 4px;
+  background-color: #ffff;
+}
+.memname {
+  background-color: #e1e1e4;
+  white-space: nowrap;
+  font-weight: bold;
+}
+.memdoc{
+  padding-left: 10px;
+}
+#doxygen-ref div.memproto td {
+  background-color: #e1e1e4;
+}
+.memproto {
+  background-color: #e1e1e4;
+  width: 100%;
+  border-width: 1px;
+  border-style: solid;
+  border-color: #e1e1f4;
+  font-weight: bold;
+  -moz-border-radius: 8px 8px 8px 8px;
+}
+.paramkey {
+  text-align: right;
+}
+.paramtype {
+  white-space: nowrap;
+}
+.paramname {
+  color: #602020;
+  font-style: italic;
+  white-space: nowrap;
+}
+DIV.groupHeader {
+  margin: 12px 16px 6px auto;
+  font-weight: bold;
+}
+DIV.groupText {
+  margin-left: 16px;
+  font-style: italic;
+  font-size: 90%;
+}
+TR.memlist {
+  background-color: #f0f0f0;
+}
+P.formulaDsp {
+  text-align: center;
+}
+IMG.formulaInl {
+  vertical-align: middle;
+}
+SPAN.keyword,
+SPAN.keywordflow {
+  color: #008000;
+}
+SPAN.keywordtyp {
+  color: #604020;
+}
+SPAN.comment {
+  color: #800000;
+}
+SPAN.preprocessor {
+  color: #806020;
+}
+SPAN.stringliteral {
+  color: #002080;
+}
+SPAN.charliteral {
+  color: #008080;
+}
+.mdTable {
+  background-color: #e1e1e4;
+  border: none;
+  padding: 0;
+}
+.mdRow {
+  padding: 8px 10px;
+  border: none;
+}
+.mdescLeft,
+.mdescRight {
+  padding: 0 8px 4px 8px;
+  font-size: 80%;
+  font-style: italic;
+  background-color: #FAFAFA;
+  border: 1px none #E0E0E0;
+  margin: 0;
+}
+.search {
+  color: #039;
+  font-weight: bold;
+}
+FORM.search {
+  margin: 0 auto;
+}
+INPUT.search {
+  font-size: 75%;
+  color: #000080;
+  font-weight: normal;
+  background-color: #e8eef2;
+}
+TD.tiny{
+  font-size: 75%;
+}
+#doxygen-ref HR {
+  height: 1px;
+  border: none;
+  border-top: 1px solid black;
+}
+#doxygen-ref table,
+#doxygen-ref td,
+#doxygen-ref tr {
+  border:none;
+}
+#doxygen-ref .contents H1 {
+  text-align: center;
+  background-color: #ffffff;
+  border: 0;
+}
+#doxygen-ref H2 {
+  margin-left: 0;
+  margin-bottom: 5px;
+}
+#doxygen-ref CAPTION {
+  font-weight: bold;
+}
+.memdoc {
+  padding-left: 30px;
+}
+.memitem {
+  border-top:1px solid #E5ECF9;
+}
+.doxygen-global {
+  background-color: #ffcc66;
+}
\ No newline at end of file
diff --git a/o3d/documentation/jsdoc-toolkit-templates/static/tab_b.gif b/o3d/documentation/jsdoc-toolkit-templates/static/tab_b.gif
new file mode 100644
index 0000000..0d62348
--- /dev/null
+++ b/o3d/documentation/jsdoc-toolkit-templates/static/tab_b.gif
diff --git a/o3d/documentation/jsdoc-toolkit-templates/static/tab_l.gif b/o3d/documentation/jsdoc-toolkit-templates/static/tab_l.gif
new file mode 100644
index 0000000..9b1e633
--- /dev/null
+++ b/o3d/documentation/jsdoc-toolkit-templates/static/tab_l.gif
diff --git a/o3d/documentation/jsdoc-toolkit-templates/static/tab_r.gif b/o3d/documentation/jsdoc-toolkit-templates/static/tab_r.gif
new file mode 100644
index 0000000..ce9dd9f
--- /dev/null
+++ b/o3d/documentation/jsdoc-toolkit-templates/static/tab_r.gif
diff --git a/o3d/documentation/jsdoc-toolkit-templates/static/tabs.css b/o3d/documentation/jsdoc-toolkit-templates/static/tabs.css
new file mode 100644
index 0000000..16b1be0
--- /dev/null
+++ b/o3d/documentation/jsdoc-toolkit-templates/static/tabs.css
@@ -0,0 +1,102 @@
+/* tabs styles, based on http://www.alistapart.com/articles/slidingdoors */
+
+DIV.tabs
+{
+   float            : left;
+   width            : 100%;
+   background       : url("tab_b.gif") repeat-x bottom;
+   margin-bottom    : 4px;
+}
+
+DIV.tabs UL
+{
+   margin           : 0px;
+   padding-left     : 10px;
+   list-style       : none;
+}
+
+DIV.tabs LI, DIV.tabs FORM
+{
+   display          : inline;
+   margin           : 0px;
+   padding          : 0px;
+}
+
+DIV.tabs FORM
+{
+   float            : right;
+}
+
+DIV.tabs A
+{
+   float            : left;
+   background       : url("tab_r.gif") no-repeat right top;
+   border-bottom    : 1px solid #84B0C7;
+   font-size        : 8px;
+   font-weight      : bold;
+   text-decoration  : none;
+}
+
+DIV.tabs A:hover
+{
+   background-position: 100% -150px;
+}
+
+DIV.tabs A:link, DIV.tabs A:visited,
+DIV.tabs A:active, DIV.tabs A:hover
+{
+       color: #1A419D;
+}
+
+DIV.tabs SPAN
+{
+   float            : left;
+   display          : block;
+   background       : url("tab_l.gif") no-repeat left top;
+   padding          : 5px 9px;
+   white-space      : nowrap;
+}
+
+DIV.tabs INPUT
+{
+   float            : right;
+   display          : inline;
+   font-size        : 1em;
+}
+
+DIV.tabs TD
+{
+   font-size        : 8px;
+   font-weight      : bold;
+   text-decoration  : none;
+}
+
+
+
+/* Commented Backslash Hack hides rule from IE5-Mac \*/
+DIV.tabs SPAN {float : none;}
+/* End IE5-Mac hack */
+
+DIV.tabs A:hover SPAN
+{
+   background-position: 0% -150px;
+}
+
+DIV.tabs LI.current A
+{
+   background-position: 100% -150px;
+   border-width     : 0px;
+}
+
+DIV.tabs LI.current SPAN
+{
+   background-position: 0% -150px;
+   padding-bottom   : 6px;
+}
+
+DIV.navpath
+{
+   background       : none;
+   border           : none;
+   border-bottom    : 1px solid #84B0C7;
+}