Customizing spoiler

Hello!

I've searched this forum a lot, to find some topics regarding my problem, but I couldn't find anything similar. If there is, I apologize for creating my own topic.

So, now I'm customizing a new theme for my forum. I came up to customizing code/quote/spoiler fields ant then I got stuck. I wanted to add a border around those fields. Code and quote seem to work the way I wanted them to, but I have some problems with spoiler. This is what my closed spoiler looks like now:

As you can see, spoiler has an extra line at the bottom. When it's open, spoiler looks fine:

The CSS code I use for that is

Code:

.codebox dd {
  border: 1px solid #1D4F75;
  border-bottom-left-radius: 20px;
  border-top-right-radius: 20px;
  padding: 0px 15px;
}

My question is, how can I get rid of that annoying and really bad looking extra line, if it's possible?
Also, as you can see from the second picture, text in spoiler is bold. The code I use affects spoiler only:

Code:

.spoiler {
font-weight:bold;
font-size:11px;
}

I tried removing "font-weight:bold;" part, but then the spoiler title becomes unbolded too. What I want, is to leave spoiler title bold, and to make the text in spoiler unbold. I use phpBB2. Thanks for any help!

Hello try using this to hide that border :

Code:

.spoiler_closed { border-bottom:none !important }

Add in Display > Colors > CSS stylesheet

Thank you for quick response, but I'm afraid this doesn't work

Try this :
It looks like the dd isn't hidden when the spoiler is closed, so its border is still showing.

Code:

.codebox.spoiler dd { border:none }

The code you gave removed all borders from spoiler, so I just changed it to this:

Code:

.codebox.spoiler dd { border-bottom:none }

The result was that the line I want to be gone still exists, when spoiler is closed:

and there is no border at the bottom at all, when open:

do you have a link to a public page with a spoiler on it i can view?

Yes, I have, here you go:
http://testforum.lithuanianforum.net/t16-testing#39

well this isnt posible with css

but u can try this script not 100% sure it will work

acp>modules>javascript management>

create a new javascript
title:whatever
placement:all pages

code

Code:



$(function(){
    $('.spoiler_content.hidden').parent().css('border', '0px');
$('.spoiler_closed.hidden').next('dd').css('border', '1px solid #1D4F75');
});



Thank you, it worked! Unfortunately, when I open the spoiler, again there are no borders at all. But if it's not possible by any kind of coding, then I'll be okay with what I have now

Does anybody know/have some ideas on how can I make text in spoiler unbolded?

im sure ange will hook u up when he gets on im just not that good in scripting yet

See if this works :

Code:

.spoiler_closed + dd { border:none !important }
.spoiler_closed.hidden + dd { border:1px solid #1D4F75 !important }

Works amazing, thank you very much!

You're welcome

Topic archived