I had Ddblock working fine with the old Acquia Marina theme but then upgraded to the new version that is a subtheme of Fusion which uses Skinr.

Fusion CSS is loaded last so it appears to override some things.

Specifically, using the Plainlist 30l ddblock theme, I had a problem with the pager items using margin CSS from Fusion and overriding ddblock's CSS.

This line from fusion-acquia-marina-style.css was the cuprit:

.content-region .content-inner .content-inner-inner .content ul, .content-region .content-inner .content-inner-inner .content ol {
margin:0 0 10px 40px;

The 40 px shoved the list box too far to the right, so I added the !important statement to the ddblock CSS file and added 15px of left margin.

div.custom-pager ul{margin:0 0 0 15px !important;padding:0 0 0.25em 1em;}

Fusion also changed the bullet style to its own, but I was ok with that.

I'm sure there are other areas where Fusion will cause a problem, so you may want to look at this theme in detail as it's sure to become very popular.

Comments

druplicate’s picture

druplicate commented

Just realized that the dev version of ddblock is fairly recent but the rc6 version is almost a year old.

Should I be using the dev version? In a nutshell, are there significant differences?

ppblaauw’s picture

ppblaauw commented

Thanks for reporting.

It will always be the case that the CSS of the overall theme can override the CSS of the ddblock module. Can not do much about that. Like you did, you can add !important to the CSS of the ddblock theme to override the overall theme again. That is one of the few options there are to handle this kind of issues.
Will have a look at the new aqua marina theme with fusion and Skinr.

The rc6 version is the latest version which can be used in a production site. The dev version is for testing purposes. In the changelog you can read what is changed. Shortly the next version has more pager options, multiple pagers in one slideshow, a scrollable pager is added and some bugfixes.

Still find it difficult how to add new functionality to modules when there are only a few users in the community which are prepared to test new functionality of modules. Getting new functionality tested before creating a new release, goes rather slow. It looks like users only take note when a module is not dev anymore and then complain about bugs they find.
(I think this is a problem with all open source development, lots of users, small amount of users prepared to test.)

druplicate’s picture

druplicate commented

Well that begs the question - why not put !important everywhere there's likely to be an override?

I took all the custom ddblock mods (mostly resizing for larger images) and put them in my local.css file and it broke the display, and I can't figure out how. The pager section gets dumped underneath the image and so does the slider text section. I played around with everything I could to get it to pop back up but it won't.

Here are the modded lines added to local.css:

/*6*/div.ddblock-cycle-plain-list30l div.custom-pager{background-color:#fdfdfd;display:block;margin:0;position:relative;width:150px;}
/*7*/div.ddblock-cycle-plain-list30l div.container-inner{border:1px solid #999999;height:362px;padding:2px 0 0 2px;}
/*8*/div.ddblock-cycle-plain-list30l div.slider{width:480px;}
/*11*/div.ddblock-cycle-plain-list30l div.slider-inner{height:360px;overflow:hidden;position:relative;visibility:hidden;}
/*13*/div.ddblock-cycle-plain-list30l div.slide-inner img{height:360px;margin:0!important;padding:0!important;width:480px;}
/*15*/div.ddblock-cycle-plain-list30l div.slide-text-horizontal{height:30px;left:0;width:480px;}
/*24*/div.ddblock-cycle-plain-list30l div.slide-title-horizontal{float:left;width:480px;}
/*39*/div.ddblock-cycle-plain-list30l div.container{background-color:#ffffff;width:640px;}
/*40*/div.ddblock-cycle-plain-list30l div.custom-pager .custom-pager-item{background-color:#fdfdfd;width:125px;}
/*45*/div.ddblock-cycle-plain-list30l div.custom-pager-inner{height:360px;}
/*46*/div.ddblock-cycle-plain-list30l div.custom-pager ul{margin:0 0 0 15px !important;padding:0 0 0.25em 1em;}
/*48*/div.ddblock-cycle-plain-list30l div.custom-pager a{color:#000;display:block;height:24px;width:110px;}

The last three CSS files loaded are ddblock, grid16-960, local.css. But using Firebug I could not see any lines added by grid16-960. Frustrating.

I put the modded ddblock css file back and noticed something odd. I did not remove the dozen or so ddblock css lines from local.css and noticed that the select-background color for the pager was no longer red. Using Firebug, I turned off the local.css line and the red color returned. Seems if you repeat the css it toggles the color! Any other color overrides ok. Using FF3.5 but same problem in Opera. Strange. Could be a CSS spec bug.

So I'm stuck keeping my mods inside the ddblock css file, and will have to be careful when upgrading I guess. It's too much trouble to figure out what's responsible. So this is just a caveat for others using ddblock - be careful with overriding CSS using local.css.

One additional item to note: The modded template.php file must be in the Fusion core directory, not the Acquia Marina directory. The same goes for any custom tpl.php files. However, the "custom" directory for ddblock must be in the Acquia Marina directory.

ppblaauw’s picture

ppblaauw commented

Make this a support request

Do users want to customize the ddblock theme according to the overall theme or do they want the ddblock theme override the overall theme in all cases.

In our opinion the ddblock themes are more a starting point to adjust it to the overall theme.

It's fundamental CSS functionality what you are talking about.
Which CSS statement is used is determined by CSS Specificity.

Don't see why the CSS in the local.CSS will not work.
Maybe a caching issue?

--
about your last sentence:

You should NOT modify the template.php file of the Fusion core theme.
You should modify the template.php file in the theme you use. (this can be a subtheme of the core Fusion theme)

You should also NOT modify any of the other tpl.php files in the Fusion core theme. You should copy them to the theme you use (this can be a subtheme of the core Fusion theme)

The "custom" directory from the ddblock download should indeed be in the theme you use (this can be a subtheme of the core Fusion theme)

druplicate’s picture

druplicate commented

All caching is turned off for development.

I guess you're right about the CSS cascade/specificity.

I copied the template.php file to the AM directory and it bombed - couldn't find the theme-settings.php file because it's in the Fusion Core directory. It probably would work if I copied that too. AM is a sub-theme of Fusion. There is no default template.php file in the AM directory.

tpl.php files have to be in the fusion core directory to work. I tried putting them in the AM directory and they were ignored. Maybe if I copied all of the relevant files it would work.

It's annoying because when it comes time to upgrade Fusion, I'll have to manually modify template.php no matter where it resides.

I addressed this issue here comparing how Apache handles their config files with include directives: http://drupal.org/node/678582

Am I missing something?

EDIT: Ok, there is a better solution. In the book "Front End Drupal" on page 202, it is suggested that you put your template.php file additions in a separate file and name it something like template-ddblock.php. Then you add just one statement to the template.php file:

include_once('template-ddblock.php');

So when you update Fusion, you just have to add that one line. It would be great if the core template.php file had a generic name for that file like template-extras.php so you wouldn't have to modify the file when updating. Of course Fusion would have to create a dummy file too to prevent PHP errors if the file didn't exist. That file would have to exist in the Fusion directory too.

jalneal’s picture

jalneal commented

I just found DDblock today and I have to say I'm thrilled, it looks awesome. I'm slammed right now, and just doing whatever I have to in order to get the CSS up, but I hope to come back to this and add the custom templates for the way it displays in Skinr - essentially overriding any of Fusions CSS by creating class names for the different themes, then generating a pulldown. This would allow you to just go into Skinr and use the pulldown to change the look, and if you use panels, you could have a single block that displays differently on each panel.