Attention:

Support Rules and Guidelines
Before you post your support topic, please remember to:
  • Read the support forum rules.
  • Check the wiki and use search to see if your problem can be answered there first.
  • Link your board please, and make sure that the problem on your board is visible to guests or provide a test account.
  • Do not post Board Wrappers and CSS unless requested. With a board link, this is not necessary.
  • Be as descriptive as you can and use as many details as possible when describing your problem.
  • Please briefly mark any links to forums that may not be work-safe.
This will help ensure your support issue will be attended to in a quick and efficient manner.

  Add ReplyNew TopicNew Poll

 Dice roll code
#
Hello! I am testing out the dice roll code on my board but I'm not sure how to add different styles/effects?

For example - Dice Roll: 1d6: 5 = 5 - is going to give me a random roll. But what if I wanted a die to roll words like WIN/LOSE rather than numbers? How would I go about doing that? Also, is it possible to change the red border around the roll result itself?

Thanks in advance ♥

signature
user posted image
sweet serenity, a sailor moon roleplay 
PM
#
The dice roll is very "what you see is what you get" for the most part -- you cannot really customize it much. The text of it cannot be changed. The red border can be changed. Its span class is dice-roll, so

.dice-roll { border: #fff solid 3px; }

would change it.

signature
email: admin@jcink.com :: blog: John C.
#
Thanks for the response John. Would it be possible to change the span of the dice roll, while retaining the results? For example, could I make a .dice-rollred for all the rolls that I want with a red border and .dice-rollgreen for those I want to have a green border?

Could I use different sided die for the roll? Must the roll be

CODE
[roll]1d6[/roll]


or can I use 2d6 (two 6 sided dice)? Can I change the class per the amount of dice?

Oh! And now that I am thinking of it, do all "rolls" have the text Dice Roll in them? Is there anyway to change this to something like ATTACK/DEFEND?

This post has been edited by Symphonic: Jan 10 2017, 05:46 PM

signature
user posted image
sweet serenity, a sailor moon roleplay 
PM
#
I think to get attack / defend you could make custom BBcode like:

CODE
<div class="attack">[roll](PARAM1)[/roll]</div>


And then add CSS like:

.attack .dice-roll::before{content:"Attack"; font-weight: bold}

Which you could further customize, I believe. That being said, this is:

1. Theoretical. I don't know if you can mix BBC and custom BBC, so you'd have to test that.
2. Dependent on information that goes on after a roll, so you can't really have it change depending on the result. You could, if you wanted, have a guide for each roll under your BBC (assuming that this method works) if you think it would make things easier on your members. You could try something like:

.attack .dice-roll::after{content:"Anything under a 5 is a fail."; display: block; vertical-align: sub; font-size: smaller}

Good luck!

PS also, regarding 2D6s, let's see:

Dice Roll: 2d6: 1+5 = 6

Yep! Looks like it works. :3

This post has been edited by owl: Jan 12 2017, 06:12 PM

signature
user posted image
#
owl thanks for those suggestions! I'm playing around with it and so far it works ♥

The only issue I'm having is trouble trying to make the "attack" die different from the "defend/heal" die. Ideally I'd like for the attack border to be red and the heal border to be green. Here's what I've done so far --

CODE

/****************************************
Dice ROll
*****************************************/
.dice-roll {
border: #fff solid 3px;
}
.heal .dice-roll::before {
content:"DEFEND";
font-weight: bold
border: #32cd32 solid 3px;
}

.heal .dice-roll::after {
content:"must be greater than 5 to be successful";
display: block;
vertical-align: sub;
font-size: smaller
}



signature
user posted image
sweet serenity, a sailor moon roleplay 
PM
#
Did you make a custom BBcode? Also, looks like your selectors are too specific for the border color. Try replacing the above with:

/****************************************
Dice Roll
*****************************************/
.dice-roll {
border: #fff solid 3px;
}
.heal .dice-roll {
border-color:#32cd32;
}
.heal .dice-roll::before {
content:"DEFEND";
}
.heal .dice-roll::after {
content:"must be greater than 5 to be successful";
display: block;
vertical-align: sub;
font-size: smaller
}

This post has been edited by owl: Jan 15 2017, 05:56 PM

signature
user posted image
#
QUOTE (owl @ Jan 15 2017, 05:53 PM)
Did you make a custom BBcode?

Forgive my inexperience but I don't know what this means? http://files.b1.jcink.com/html/emoticons/sad.gif

signature
user posted image
sweet serenity, a sailor moon roleplay 
PM
#
QUOTE (owl @ Jan 12 2017, 06:09 PM)
I think to get attack / defend you could make custom BBcode like:

CODE
<div class="attack">[roll](PARAM1)[/roll]</div>


I mentioned it in my first post - I think it's probably the only way something like this would work. I also mentioned that you'd have to experiment to get it to work because I'm not sure if you can mix custom bbcode with the roll code.

signature
user posted image
0 User(s) are reading this topic (0 Guests and 0 Anonymous Users)
0 Members:
Share this topic:
« Next Oldest | General Support | Next Newest »

Options Add ReplyNew TopicNew Poll