CSS suggestions [#499518]

Hi,

I played with the theme a little bit and found that it still has a few rough edges. For example, the frame around images is drawn unconditionally, also for things like the print icon (of the print module) or the admin bar logos (of the admin bar module)
This

.print-icon,
.admin-menu-icon img,
.editor-image-button,
.separator img,
.icon img,
th.active img
{
        padding: 0;
        border:0;
        background:none;
}

removes the frame from

the print ico,
the admin bar icons,
the BUE editor icons and separators,
the checkmark icons on the 'status report' page,
the sort icon in table headers.

Not really sure though if, for the sake of keeping things where they belong, these are actually supposed to go into the theme's CSS or the modules' CSS.

This one here

code
{
        display:inline;
        padding:0;
}

makes inline code display inline, as opposed to <blockcode>.

Also, one might want to reconsider the extreme letter-spacing that is applied. As a typophile, I must say that the letter overlap appears far too much to read (the headers) comfortably imho.

Anyway, the theme is great as it is, thanks for sharing!
Cheers,
Nico

Comment	File	Size	Author
#8	overlap.jpg	72.77 KB	fender-dupe
#5	menu.jpg	28.47 KB	vako
#4	without-background-color.png	49.3 KB	paloczp
#4	with-background-color.png	37.79 KB	paloczp
#1	ninesixtyrobots_code_image_css.patch	1.11 KB	quicksketch

Comments

Comment #1

quicksketch

he/him

commented 6 July 2009 at 22:41

Status:

Active

» Fixed

Status	File	Size
new	ninesixtyrobots_code_image_css.patch	1.11 KB

Thanks nicomat! I've included almost all the suggested changes, fixing the images you suggest and converting code to div.codeblock rather than just applying to all <code> tags. I didn't use <blockcode> because I believe that's not actually valid XHTML (though it is proposed: http://esw.w3.org/topic/HTML/BlockCode). Thanks!

Comment #2

nschloe commented 7 July 2009 at 17:14

Status:

Fixed

» Active

Hi,

thanks for embedding, but it doesn't to work here so well. Everything in img.printicon actually gets overwritten by content-wrapper img. Do you see the same thing?

Cheers,
Nico

Comment #3

nschloe commented 7 July 2009 at 17:16

Ah, okay, I think that stuff interferes with the new #contenwrapper as in #contentwrapper img

Comment #4

paloczp commented 22 July 2009 at 14:45

Status	File	Size
new	with-background-color.png	37.79 KB
new	without-background-color.png	49.3 KB

Hi,

When I use gmap+location module and I display the gmap, the navigations and marker icons have a #FAFAFA background (see the pictures), if I don't disable this function:

/* Images */
#content-wrapper img, #footer-wrapper img {
  background: #FAFAFA;
  border: 1px solid #DCDCDC;
  padding: 8px;
}

You need to add these lines to correct work:

#content-wrapper .gmap img, #footer-wrapper .gmap img {
  background: none;
}

I hope this could help.

Thanks!
Paul

Ps.: sorry, I use version "6.x-2.0"

Comment #5

vako commented 25 August 2009 at 00:23

Status	File	Size
new	menu.jpg	28.47 KB

Hi Guys, I hope someone can help me with a CSS issue on this theme:
I am trying to change the highlight color for the Primary menu (please see the attached image). I tried to change the Color options in the main.css, but am unable to locate which one is linked to that portion. I am new to this, so I would need your help please.

thanks!

Comment #6

nschloe commented 25 August 2009 at 12:23

I'd say this is a bit off-topic. We're gathering glitches in the default layout here, so I guess you'd be better of if you just opened a support request for this theme.

Apart from that, I can highly recommend the Firebug extension to Firefox: Hovering with the cursor over a loaded webpage will show you the exact css properties which determine why things look like they do.

Cheers,
Nico