Author Topic: Joomla Administrator Styles (Read 3632 times)

lcdweb · August 07, 2007, 09:19:12 am

Does anyone else find that when browsing within any of the CiviCRM admin pages, the main Joomla Administrator menu styles get messed up? It looks like the CiviCRM styles are removing the left/right borders in the Admin menu. Doesn't impact functionality, but it's a little annoying because the menu jumps around a little on rollover.

speleo · August 07, 2007, 01:28:59 pm

This is so small an effect that I never noticed it before but you are correct.

From my investigation using firebug it appears to be that the css for

<span class="ThemeOfficeMainFolderLeft"/>
....
<span class="ThemeOfficeMainFolderRight"/>

is not being picked up. I suspect that this is because there are two theme.css files being called to render the page

http://www.bec-cave.org.uk/administrator/templates/joomla_admin/css/theme.css
http://www.bec-cave.org.uk/administrator/components/com_civicrm/civicrm/css/skins/aqua/theme.css

I'm not too hot on css inheritance so am ducking out here. Its really very minor but I suppose a fix might help..

lcdweb · August 08, 2007, 09:30:02 am

I took a closer look and couldn't find the problem. This style:
td.ThemeOfficeMainItemHover,td.ThemeOfficeMainItemActive

controls the main menu bar hover state. The styles you listed affect the drop down items. It's only affecting the hover state -- canceling out the border, which causes the menu items to bump slightly as you roll over.

Not a big deal. I'm building a site with CiviCRM to hand over to a client, so I would rather have the admin tool not have any visible bugs. But it doesn't impact functionality so I'll live with it.

-Brian

mcsmom · September 04, 2007, 01:29:05 pm

Yeah, it's odd--the menus switch from flush left to flush right.

lcdweb · October 03, 2007, 11:50:30 am

The following css changes should be made to fix CiviCRM issues in Joomla 1.5 (haven't checked if they fix on 1.0.13):

In administrator\components\com_civicrm\civicrm\css\joomla.css

remove/comment out line 246 (font-family in body tag -- not necessary and throws everything off)
change line 329 padding to 0 for top (0 0.5em 0 0.5em)
remove/comment out line 330 (text-align: right;)

Brian

Dave Greenberg · October 03, 2007, 02:22:51 pm

Brian - Thx for working through this to find "the fix". I'm happy to implement them for 1.9 - BUT it would be great if we could get confirmation that these changes don't cause problems in 1.0.13. Also wondering if you've tried it out on multiple browsers (at least FF and IE).

lcdweb · October 03, 2007, 04:15:14 pm

There are a few more edits that need to be made to the joomla.css file:

329: padding: 0; (this was noted earlier; but the left/right padding should also be zeroed)
242: delete/comment out
22: delete/comment out

Add the following to the end of joomla.css

Code: [Select]

#module-status, .version {
	font-size:11px;
}
#module-status a {
	font-weight: normal;
}
.main {
	text-align:left;
}

I tested this on both Firefox and IE7, with Joomla 1.5 and 1.0.13, and think this fixes the more prominent issues, though I suspect there are more things to be tweaked. It addresses the Joomla menu, which was annoyingly thrown off when on the CiviCRM pages, both in 1.5 and 1.0.13. It would be good if someone else using Joomla made the changes in the joomla.css file to confirm that it fixes things with no problem.

Also note that the changes bring the CiviCRM pages in line with the default administrator templates. They may not fix everything if people have installed custom administrator templates.

-Brian

speleo · October 04, 2007, 01:24:13 am

Brian, I've made the changes as you listed below. Wanted to make sure I zapped the right lines (when you delete one it renumbers the rest

). So i did this:

Line 22 remove border-collapse: collapse;
Line 242 remove margin: 0;
Line 246 remove font: 76% Verdana, Arial, Helvetica, sans-serif;
Line 329 replace with padding: 0 0 0 0;
Line 330 remove text-align: right;

and add this at the end:

Code: [Select]

#module-status, .version {
	font-size:11px;
}
#module-status a {
	font-weight: normal;
}
.main {
	text-align:left;
}

Sorry for repeating your post but want to make sure. I've uploaded my modified joomla.css too.

My initial view is that this fixes the jumping menu issue (many thanks) and I'll keep an eye out to see if anything else looks odd.

Nice one!

lcdweb · October 04, 2007, 05:50:48 am

Thanks for summarizing. One minor edit --
For the line 246 edit, just remove the font-family style, not the 76% font-size. I had separated those onto different lines, and forgot they were originally written in shorthand.

It won't hurt to remove the font-size style too. But it removing it actually makes the base font size throughout smaller.

Thanks!
Brian

speleo · October 04, 2007, 05:58:32 am

Have updated the attached joomla.css to reflect this. Line 245 now reads

font: 76%;

Dave Greenberg · October 04, 2007, 02:46:23 pm

Brian / Henry - Thx for getting this resolved. I've created an issue for this (fix for 1.9) at:
http://issues.civicrm.org/jira/browse/CRM-2325

... and committed the version attached by Henry in his last post w/ one more change. I removed these lines entirely as they are an empty directive:

Code: [Select]

// lines 21-23
table {

}

CiviCRM Community Forums (archive)

News:

Author Topic: Joomla Administrator Styles (Read 3632 times)

lcdweb

Joomla Administrator Styles

speleo

Re: Joomla Administrator Styles

lcdweb

Re: Joomla Administrator Styles

mcsmom

Re: Joomla Administrator Styles

lcdweb

Re: Joomla Administrator Styles

Dave Greenberg

Re: Joomla Administrator Styles

lcdweb

Re: Joomla Administrator Styles

speleo

Re: Joomla Administrator Styles

lcdweb

Re: Joomla Administrator Styles

speleo

Re: Joomla Administrator Styles

Dave Greenberg

Re: Joomla Administrator Styles