The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Customizing spoiler

View previous topic View next topic Go down

Solved Customizing spoiler

Post by ifelthope1126 on December 4th 2014, 9:32 pm

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!

ifelthope1126
Forumember

Female Posts : 70
Reputation : 9
Language : Lithuanian, Russian, English

http://sunset.forumtwilight.com

Back to top Go down

Solved Re: Customizing spoiler

Post by Ange Tuteur on December 4th 2014, 9:39 pm

Hello try using this to hide that border :
Code:
.spoiler_closed { border-bottom:none !important }
Add in Display > Colors > CSS stylesheet

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Customizing spoiler

Post by ifelthope1126 on December 4th 2014, 9:42 pm

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

ifelthope1126
Forumember

Female Posts : 70
Reputation : 9
Language : Lithuanian, Russian, English

http://sunset.forumtwilight.com

Back to top Go down

Solved Re: Customizing spoiler

Post by Ange Tuteur on December 4th 2014, 9:46 pm

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 }

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Customizing spoiler

Post by ifelthope1126 on December 4th 2014, 10:04 pm

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:

Confused

ifelthope1126
Forumember

Female Posts : 70
Reputation : 9
Language : Lithuanian, Russian, English

http://sunset.forumtwilight.com

Back to top Go down

Solved Re: Customizing spoiler

Post by _Twisted_Mods_ on December 4th 2014, 10:42 pm

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

_Twisted_Mods_
Helper
Helper

Male Posts : 2032
Reputation : 302
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

Solved Re: Customizing spoiler

Post by ifelthope1126 on December 4th 2014, 10:48 pm


ifelthope1126
Forumember

Female Posts : 70
Reputation : 9
Language : Lithuanian, Russian, English

http://sunset.forumtwilight.com

Back to top Go down

Solved Re: Customizing spoiler

Post by _Twisted_Mods_ on December 5th 2014, 1:24 am

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');
});


_Twisted_Mods_
Helper
Helper

Male Posts : 2032
Reputation : 302
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

Solved Re: Customizing spoiler

Post by ifelthope1126 on December 5th 2014, 8:36 am

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 Smile

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

ifelthope1126
Forumember

Female Posts : 70
Reputation : 9
Language : Lithuanian, Russian, English

http://sunset.forumtwilight.com

Back to top Go down

Solved Re: Customizing spoiler

Post by _Twisted_Mods_ on December 5th 2014, 9:08 am

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

_Twisted_Mods_
Helper
Helper

Male Posts : 2032
Reputation : 302
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

Solved Re: Customizing spoiler

Post by Ange Tuteur on December 5th 2014, 9:12 am

See if this works :
Code:
.spoiler_closed + dd { border:none !important }
.spoiler_closed.hidden + dd { border:1px solid #1D4F75 !important }

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Customizing spoiler

Post by ifelthope1126 on December 5th 2014, 9:15 am

Works amazing, thank you very much! Very good

ifelthope1126
Forumember

Female Posts : 70
Reputation : 9
Language : Lithuanian, Russian, English

http://sunset.forumtwilight.com

Back to top Go down

Solved Re: Customizing spoiler

Post by Ange Tuteur on December 5th 2014, 9:26 am

You're welcome Smile

Topic archived

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum