First and foremost, great to see someone has decided to maintain this fantastic module.

Having set up this module on a site I have some questions on how to theme it in CSS.

The following are some questions I have, which I hope someone with better knowledge of CSS and/or this module will be able to assist with:

  1. Different background color for headers - All headers appear do not have differentiating CSS classes (h3.ui-accordion-header). I want to alternate the background colors. Is there any way to have "odd"/"even" classes?
  2. Remove Header Link - Is there any way to not link the headers?
  3. Child Item CSS - I would like to apply a:hover text underline effect but am able to do so. Is this even possible here

Appreciate any and all help anyone cares to share.

CommentFileSizeAuthor
#4 accordion-ftp.png55.59 KBefc84

Comments

solotandem’s picture

solotandem commented

Regarding your questions:

  1. Different background color for headers - Adding the zebra classes should be simple enough.
  2. Remove Header Link This is a limitation of using the core menu as the basis for the menu items -- core does not allow an item without a link
  3. Child Item CSS This may depend on what accordion triggering event you use. If you use something like hover to trigger the accordion, then it would likely conflict with displaying an underline.

Anyone with a patch?

sarhansg’s picture

sarhansg commented

Thanks for your reply.

I figured out what was wrong with point 3. The site uses Cufon (http://drupal.org/project/cufon) for the accordion links. The 6.x version of the module has some issues with the hover state. Trying to find a workaround for that. Guess I'll have to live with the header link.

How do I apply a zebra class to the accordion menu? Do I need to modify the tpl in this instance (http://drupal.org/node/213711)? Perhaps the maintainer could consider adding odd, even, first, last classes to simplify the process for users.

sarhansg’s picture

sarhansg commented

Have moved on the Dynamic Font Rendering module (). Didn't quite like how Cufon rendered fonts.

Still can't figure out how to apply zebra class to the accordion menu. It would really be helpful if different classes were included to make styling easier.

efc84’s picture

efc84 commented
StatusFileSize
new accordion-ftp.png55.59 KB

Hi, i'm new to drupal but would also like to be able to change background colours, have first sidebar menu & second side menu different colours etc. When i go into the FTP and try and find a css file there is not anything present? (See attachment) Are the style sheets for the accordion menu saved elsewhere?

solotandem’s picture

solotandem commented

This project does not declare any style sheets. Instead, the CSS files in your custom theme and/or other existing modules (e.g. core modules) are controlling the display.

Arguably the best way to find out is to use the FireBug extension in FireFox to inspect the CSS. If you are not familiar with this, then do a web search and you should find plenty of information. Or, get on a Drupal IRC channel and ask for help.

kim_charest’s picture

kim_charest commented

Hi...

As efc84 mentionned, I'm trying to make some changes in the accordion menu display (i.e. I want to add a transparency effect). This is, when I change my custom theme style sheet, it changes the container but not the actual accordion. Can someone help? How is it possible to customize the menu if there aren't CSS sheets? Sorry, newbe here. Feel free to refer me to some external info.

Thanks a lot in advance!

Kim

kim_charest’s picture

kim_charest commented

So just to post a follow up here, I was able indeed to add some css to my theme's style sheet to customize the links and appearence of the content. The only aspect I don't know where to start is the actual accordion background color. Even though I tried to specify a background color in various ways, I'm unable to make any changes directly on the accordion's color.

Any clue?

Thanks! :)

efc84’s picture

efc84 commented

Hi, i have managed to change the colour/style of the menu by using this link

http://jqueryui.com/themeroller/

You then download the modified menu and its just a case of replacing the jquery.ui.theme.css file which can be found in /drupal-7.8/misc/ui and then the new images /drupal-7.8/misc/ui/images. That should work but would be best to back things up if anything goes wrong!

sarhansg’s picture

sarhansg commented

CSS can do most of what kim_charest, efc84 and solotandem are requesting. My issue still remains where there are no first/last, odd/even classes provided for easier and better theming. Hopefully the next iteration of this module provides this functionality.

solotandem’s picture

solotandem commented
Version: 6.x-1.1 » 6.x-1.x-dev
Assigned: Unassigned » solotandem
Category: support » feature
Status: Active » Fixed

Implemented in this commit and this commit.

Please grab the latest dev release (created after this comment) or commit to 6.x branch, test, and report back.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.