Roll20 roll template

A copypaste job of simulating the default roll template, with most relevant css classes.

HTML

<br> 
<div>
    <table>
        <tr>
            <caption>Example attack</caption>
        </tr>
        <tr>
            <td>Attack: </td><td> 15 against AC 13</td>
        </tr>

        <tr>
            <td><span>Damage: </span></td><td>68 <span>Crit: </span>No</td>
        </tr>
        <tr>
            <td><span>Type: </span></td><td>fire damage</td>
        </tr>

        <tr>
            <td><span>Effect: </span></td><td>no effect</td>
        </tr>
    </table>
</div>
<br> 
<br> 
<div>
<table>
    <caption>Force: Control</caption>

    <tbody>
        <tr>
            <td>Roll</td>
            <td><span class="inlinerollresult showtip tipsy-n-right fullfail" title="<img src=&quot;/images/quantumrollwhite.png&quot; class=&quot;inlineqroll&quot;> Rolling (0 -1 +0 + -1 + 0)d6cf0cs7 + 0 + 5+ 0 + 1d6!cf1cs6 = ()+0+5+0+(<span class=&quot;basicdiceroll critfail &quot;>1</span>)">6</span><!-- title is orginal-title in default code-->
            </td>
        </tr>
    </tbody>
</table>
</div>

CSS

table {
  width: 100%;
	border: 1px solid;
	color: black;
  border-color: rgba(112, 32, 130,1);
	font-size: 1em;
	font-family: "Helvetica Neue", Helvetica, sans-serif;
}

th, caption {
	background-color: rgba(112, 32, 130,1);
	color: #ffffff;
	padding: 2px;
	border-bottom: 1px solid black;
	line-height: 1.6em;
	font-size: 1.2em;
}

{
	font-weight: bold;
}

 td {
	padding: 5px;
	/*border-bottom: 1px solid black;*/
}

 tr:nth-child(odd) {
	background-color: rgba(217, 217, 214,1);
}

 tr:nth-child(even) {
	background-color: rgba(233, 233, 233,1);
}

.textchatcontainer .message.hidden3d .inlinerollresult{
    color:rgba(255,255,255,0.0);
    border:none!important
}
.textchatcontainer .avatar{
    position:absolute;
    top:4px;
    left:5px;
    width:28px
}
.textchatcontainer .inlinerollresult{
    background-color:#FEF68E;
    border:2px solid #FEF68E;
    padding:0 3px 0 3px;
    font-weight:bold;
    cursor:help;
    font-size:1.1em
}
.textchatcontainer .inlinerollresult.fullcrit{
    border:2px solid #3FB315
}
.textchatcontainer .inlinerollresult.fullfail{
    border:2px solid #B31515
}
.textchatcontainer .inlinerollresult.importantroll{
    border:2px solid #4A57ED
}
.textchatcontainer .formula .inlinerollresult{
    font-size:inherit
}
.tipsy-n.tipsy,.tipsy-n-right.tipsy{
    opacity:1!important
 }
.inlinerollresult.fullcrit{
    border:2px solid #3FB315
}
.inlinerollresult.fullfail{
    border:2px solid #B31515
}
.inlinerollresult.importantroll{
    border:2px solid #4A57ED
}
.inlinerollresult{
    font-size:inherit
}
.inlinerollresult {
    background-color: #FEF68E;
    border: 2px solid #FEF68E;
    padding: 0 3px 0 3px;
    font-weight: bold;
    cursor: help;
    font-size: 1.1em;
}