#323112 follow-up by kkaefer: Make tab titles enclosed in <strong> tags to...

#323112 follow-up by kkaefer: Make tab titles enclosed in <strong> tags to indicate importance from surrounding text.

misc/vertical-tabs.css

@@ -47,6 +47,11 @@
 .vertical-tabs-list li a:hover {
   text-decoration: none;
 }
+.vertical-tabs-list li strong {
+  /* Strong tags are used around tab titles to indicate importance; however,
+     only the currently active tab should actually look bold. */
+  font-weight:normal;
+}
 .vertical-tabs-list li.selected {
   background: #fff;
   border-right-width: 0;
@@ -55,7 +60,7 @@
 .vertical-tabs-list li.selected a:focus {
   outline: 0;
 }
-.vertical-tabs-list li.selected .title {
+.vertical-tabs-list li.selected strong {
   font-weight: bold;
   color: #000;
 }

misc/vertical-tabs.js

@@ -110,7 +110,7 @@ Drupal.theme.prototype.verticalTab = function(settings) {
   var tab = {};
   tab.item = $('<li class="vertical-tab-button"></li>')
     .append(tab.link = $('<a href="#"></a>')
-      .append(tab.title = $('<span class="title"></span>').text(settings.title))
+      .append(tab.title = $('<strong></strong>').text(settings.title))
       .append(tab.summary = $('<span class="summary"></span>')
     )
   );

themes/garland/style.css

@@ -894,7 +894,7 @@ div.vertical-tabs ul.vertical-tabs-list li.selected.first {
   background-image: url(images/gradient-inner.png);
 }
 
-div.vertical-tabs ul.vertical-tabs-list li.selected a .title {
+div.vertical-tabs ul.vertical-tabs-list li.selected a strong {
   color: #494949;
 }