Vertical Tabs - Oh so close! [#249397]

When tinkering around with this module I realized that if I remove the
<span class="clear">
that gets appended, as well as add a little bit of css code; I can totally have cool vertical tabs rendered.
Only thing is that I removed the "clear span" with firebug post page render, now i have to actually edit the tabs.js!

Has anyone else tinkered with this idea? I was going to roll a new module for vertical tabs but this came so close ... I don't see the point in replicating all the bits when something so simple could make this module do vert and horiz.

Im not sure but I think I just need to tweak the if statements related to the "span class" appending, so they avoid my vertical tabs classes?

Cheers ^__^

Comments

Comment #1

nedjo

he/him/his

English

commented 21 April 2008 at 17:26

Category:

support

» feature

Interesting idea. It would need something like:

* another setting on the settings page, indicating the style (horizontal - the default - or vertical).
* pass the status of this setting with the Drupal.settings data already passed by tabs.module.
* conditionally load the vertical tabs css file based on this setting.
* in tabs.js, read the setting and conditionally append content.

if (Drupal.settings.tabs.displayStyle == 'horizontal') {
  ...
}

I'd welcome a patch.

Comment #2

Macronomicus commented 21 April 2008 at 18:46

I was able to do it even easier than I thought it would be, and without touching the js file...
On the drupal-tabs.css I changed line 27 & down to

.vertical-tabs span.clear {
  display: block;
  height: 1px;
  line-height: 0px;
  font-size: 0px;
  margin-bottom: -1px;
}
.horiz-tabs span.clear {
  display: block;
  clear: both;
  height: 1px;
  line-height: 0px;
  font-size: 0px;
  margin-bottom: -1px;
}

Just have to make sure to apply the correct class to an outer div surrounding the tabs. Dirty but easy!
I still have to stylize the other css a bit more for handling vertical tabs nicely. I'll put that up as soon as its done. ^_^