Hi guys. At the request of a player in another game, I've started trying to learn rolltemplates. I seem to have some trouble with implementation though. This is my, partialy ripped off, somewhat renamed, sad attempt at a first go. (It doesn't work, btw) /********************************************** Roll Templates ***************************************************************************/
.sheet-rolltemplate-2E_generic,
.sheet-rolltemplate-2E_hit,
.sheet-rolltemplate-2E_damage,
.sheet-rolltemplate-2e_spell-priest,
.sheet-rolltemplate-2E_spell-wizard,
.sheet-rolltemplate-2E_spell-powers,
.sheet-rolltemplate-2E_proficiency,
.sheet-rolltemplate-2E_rogue {
box-sizing: border-box;
}
.sheet-rolltemplate-2E_generic .sheet-roll-table {
width: 100%;
display: table;
border-width: 1px;
border-style: solid;
border-spacing: 0;
border-color: #FE2206;
border-collapse: collapse;
-moz-box-shadow: 2px 2px 5px Black;
-webkit-box-shadow: 2px 2px 5px Black;
box-shadow: 2px 2px 5px Black;
overflow: hidden;
}
.sheet-rolltemplate-2E_hit .sheet-roll-table {
width: 100%;
display: table;
border-width: 1px;
border-style: solid;
border-spacing: 0;
border-color: #FE2206;
border-collapse: collapse;
-moz-box-shadow: 2px 2px 5px Black;
-webkit-box-shadow: 2px 2px 5px Black;
box-shadow: 2px 2px 5px Black;
overflow: hidden;
}
.sheet-rolltemplate-2E_damage .sheet-roll-table {
width: 100%;
display: table;
border-width: 1px;
border-style: solid;
border-spacing: 0;
border-color: #FE2206;
border-collapse: collapse;
-moz-box-shadow: 2px 2px 5px Black;
-webkit-box-shadow: 2px 2px 5px Black;
box-shadow: 2px 2px 5px Black;
overflow: hidden;
}
.sheet-rolltemplate-2E_spell-priest .sheet-roll-table {
width: 100%;
display: table;
border-width: 1px;
border-style: solid;
border-spacing: 0;
border-color: #FE2206;
border-collapse: collapse;
-moz-box-shadow: 2px 2px 5px Black;
-webkit-box-shadow: 2px 2px 5px Black;
box-shadow: 2px 2px 5px Black;
overflow: hidden;
}
.sheet-rolltemplate-2E_spell-wizard .sheet-roll-table {
width: 100%;
display: table;
border-width: 1px;
border-style: solid;
border-spacing: 0;
border-color: #FE2206;
border-collapse: collapse;
-moz-box-shadow: 2px 2px 5px Black;
-webkit-box-shadow: 2px 2px 5px Black;
box-shadow: 2px 2px 5px Black;
overflow: hidden;
}
.sheet-rolltemplate-2E_spell-powers .sheet-roll-table {
width: 100%;
display: table;
border-width: 1px;
border-style: solid;
border-spacing: 0;
border-color: #FE2206;
border-collapse: collapse;
-moz-box-shadow: 2px 2px 5px Black;
-webkit-box-shadow: 2px 2px 5px Black;
box-shadow: 2px 2px 5px Black;
overflow: hidden;
}
.sheet-rolltemplate-2E_proficiency .sheet-roll-table {
width: 100%;
display: table;
border-width: 1px;
border-style: solid;
border-spacing: 0;
border-color: #FE2206;
border-collapse: collapse;
-moz-box-shadow: 2px 2px 5px Black;
-webkit-box-shadow: 2px 2px 5px Black;
box-shadow: 2px 2px 5px Black;
overflow: hidden;
}
.sheet-rolltemplate-2E_rogue .sheet-roll-table {
width: 100%;
display: table;
border-width: 1px;
border-style: solid;
border-spacing: 0;
border-color: #FE2206;
border-collapse: collapse;
-moz-box-shadow: 2px 2px 5px Black;
-webkit-box-shadow: 2px 2px 5px Black;
box-shadow: 2px 2px 5px Black;
overflow: hidden;
}
.sheet-rolltemplate-2E_generic .sheet-roll-header {
border-width: 1px;
border-style: solid;
border-color: #FE2206;
background-color: #00004B;
color: #FFF;
display:table;
caption-side:top;
width:100%;
font-size: 1.1em;
overflow: hidden;
vertical-align: bottom;
font-weight: bold;
}
.sheet-rolltemplate-2E_hit .sheet-roll-header {
border-width: 1px;
border-style: solid;
border-color: #FE2206;
background-color: #B9D2EE;
color: #000;
display:table;
caption-side:top;
width:100%;
font-size: 1.1em;
overflow: hidden;
vertical-align: bottom;
font-weight: bold;
}
.sheet-rolltemplate-2E_damage .sheet-roll-header {
border-width: 1px;
border-style: solid;
border-color: #FE2206;
background-color: #800A0A;
color: #FFF;
display:table;
caption-side:top;
width:100%;
font-size: 1.1em;
overflow: hidden;
vertical-align: bottom;
font-weight: bold;
}
.sheet-rolltemplate-2E_spell-priest .sheet-roll-header {
border-width: 1px;
border-style: solid;
border-color: #FE2206;
background-color: #AB8B57;
color: #FFF;
display:table;
caption-side:top;
width:100%;
font-size: 1.1em;
overflow: hidden;
vertical-align: bottom;
font-weight: bold;
}
.sheet-rolltemplate-2E_spell-wizard .sheet-roll-header {
border-width: 1px;
border-style: solid;
border-color: #FE2206;
background-color: #8B5299;
color: #FFF;
display:table;
caption-side:top;
width:100%;
font-size: 1.1em;
overflow: hidden;
vertical-align: bottom;
font-weight: bold;
}
.sheet-rolltemplate-2E_spell-powers .sheet-roll-header {
border-width: 1px;
border-style: solid;
border-color: #FE2206;
background-color: placeholder;
color: placeholder;
display:table;
caption-side:top;
width:100%;
font-size: 1.1em;
overflow: hidden;
vertical-align: bottom;
font-weight: bold;
}
.sheet-rolltemplate-2E_proficiency .sheet-roll-header {
border-width: 1px;
border-style: solid;
border-color: #FE2206;
background-color: #00CA00;
color: #000;
display:table;
caption-side:top;
width:100%;
font-size: 1.1em;
overflow: hidden;
vertical-align: bottom;
font-weight: bold;
}
.sheet-rolltemplate-2E_rogue .sheet-roll-table {
border-width: 1px;
border-style: solid;
border-color: #FE2206;
background-color: #F8007E;
color: #FFF;
display:table;
caption-side:top;
width:100%;
font-size: 1.1em;
overflow: hidden;
vertical-align: bottom;
font-weight: bold;
}
.sheet-rolltemplate-2E_generic .sheet-roll-header a,
.sheet-rolltemplate-2E_hit .sheet-roll-header a,
.sheet-rolltemplate-2E_damage .sheet-roll-header a,
.sheet-rolltemplate-2E_spell-priest .sheet-roll-header a,
.sheet-rolltemplate-2E_spell-wizard .sheet-roll-header a,
.sheet-rolltemplate-2E_spell-powers .sheet-roll-header a,
.sheet-rolltemplate-2E_proficiency .sheet-roll-header a,
.sheet-rolltemplate-2E_rogue .sheet-roll-header a {
text-decoration: underline;
}
.sheet-rolltemplate-2E_generic .sheet-roll-header span.sheet-left,
.sheet-rolltemplate-2E_hit .sheet-roll-header span.sheet-left,
.sheet-rolltemplate-2E_damage .sheet-roll-header span.sheet-left,
.sheet-rolltemplate-2E_spell-priest .sheet-roll-header span.sheet-left,
.sheet-rolltemplate-2E_spell-wizard .sheet-roll-header span.sheet-left,
.sheet-rolltemplate-2E_spell-powers .sheet-roll-header span.sheet-left,
.sheet-rolltemplate-2E_proficiency .sheet-roll-header span.sheet-left,
.sheet-rolltemplate-2E_rogue .sheet-roll-header span.sheet-left {
padding-left: 2px;
}
.sheet-rolltemplate-2E_generic div.sheet-roll-accessible,
.sheet-rolltemplate-2E_hit div.sheet-roll-accessible,
.sheet-rolltemplate-2E_damage div.sheet-roll-accessible,
.sheet-rolltemplate-2E_spell-priest div.sheet-roll-accessible,
.sheet-rolltemplate-2E_spell-wizard div.sheet-roll-accessible,
.sheet-rolltemplate-2E_spell-powers div.sheet-roll-accessible,
.sheet-rolltemplate-2E_proficiency div.sheet-roll-accessible,
.sheet-rolltemplate-2E_rogue div.sheet-roll-accessible {
width:100%;
}
.sheet-rolltemplate-2E_generic .sheet-roll-table.sheet-rounded,
.sheet-rolltemplate-2E_hit .sheet-roll-table.sheet-rounded,
.sheet-rolltemplate-2E_damage .sheet-roll-table.sheet-rounded,
.sheet-rolltemplate-2E_spell-priest .sheet-roll-table.sheet-rounded,
.sheet-rolltemplate-2E_spell-wizard .sheet-roll-table.sheet-rounded,
.sheet-rolltemplate-2E_spell-powers .sheet-roll-table.sheet-rounded,
.sheet-rolltemplate-2E_proficiency .sheet-roll-table.sheet-rounded,
.sheet-rolltemplate-2E_rogue .sheet-roll-table.sheet-rounded {
border-radius: 5px;
}
.sheet-rolltemplate-2E_generic .sheet-subtitle,
.sheet-rolltemplate-2E_hit .sheet-subtitle,
.sheet-rolltemplate-2E_damage .sheet-subtitle,
.sheet-rolltemplate-2E_spell-priest .sheet-subtitle,
.sheet-rolltemplate-2E_spell-wizard .sheet-subtitle,
.sheet-rolltemplate-2E_spell-powers .sheet-subtitle,
.sheet-rolltemplate-2E_proficiency .sheet-subtitle,
.sheet-rolltemplate-2E_rogue .sheet-subtitle {
font-size: .9em;
font-weight: normal !important;
text-align: left;
font-variant: small-caps;
display: block;
width: 100%;
padding: 2px 0 0 2px;
word-break: break-word;
}
.sheet-rolltemplate-2E_generic .sheet-roll-row,
.sheet-rolltemplate-2E_hit .sheet-roll-row,
.sheet-rolltemplate-2E_damage .sheet-roll-row,
.sheet-rolltemplate-2E_spell-priest .sheet-roll-row,
.sheet-rolltemplate-2E_spell-wizard .sheet-roll-row,
.sheet-rolltemplate-2E_spell-powers .sheet-roll-row,
.sheet-rolltemplate-2E_proficiency .sheet-roll-row,
.sheet-rolltemplate-2E_rogue .sheet-roll-row {
display:table-row;
width:100%;
overflow:hidden;
}
.sheet-rolltemplate-2E_generic .sheet-roll-cell,
.sheet-rolltemplate-2E_hit .sheet-roll-cell,
.sheet-rolltemplate-2E_damage .sheet-roll-cell,
.sheet-rolltemplate-2E_spell-priest .sheet-roll-cell,
.sheet-rolltemplate-2E_spell-wizard .sheet-roll-cell,
.sheet-rolltemplate-2E_spell-powers .sheet-roll-cell,
.sheet-rolltemplate-2E_proficiency .sheet-roll-cell,
.sheet-rolltemplate-2E_rogue .sheet-roll-cell {
display:table-cell;
padding:3px 2px 1px 4px;
line-height: 1.1em;
text-align:left;
font-size:.9em;
vertical-align:top;
overflow:hidden;
}
.sheet-rolltemplate-2E_generic .sheet-right,
.sheet-rolltemplate-2E_hit .sheet-right,
.sheet-rolltemplate-2E_damage .sheet-right,
.sheet-rolltemplate-2E_spell-priest .sheet-right,
.sheet-rolltemplate-2E_spell-wizard .sheet-right,
.sheet-rolltemplate-2E_spell-powers .sheet-right,
.sheet-rolltemplate-2E_proficiency .sheet-right,
.sheet-rolltemplate-2E_rogue .sheet-right {
text-align:right !important;
}
.sheet-rolltemplate-2E_generic .sheet-offscreen,
.sheet-rolltemplate-2E_hit .sheet-offscreen,
.sheet-rolltemplate-2E_damage .sheet-offscreen,
.sheet-rolltemplate-2E_spell-priest .sheet-offscreen,
.sheet-rolltemplate-2E_spell-wizard .sheet-offscreen,
.sheet-rolltemplate-2E_spell-powers .sheet-offscreen,
.sheet-rolltemplate-2E_proficiency .sheet-offscreen,
.sheet-rolltemplate-2E_rogue .sheet-offscreen {
position:absolute !important;
left:-9999px !important;
width:1px !important;
height:1px !important;
overflow:hidden !important;
}
/************* inline roll *******/
/* first line not used so put dummy class here, something really odd going on*/
.inlinerollresult,
.sheet-rolltemplate-2E_generic .inlinerollresult,
.sheet-rolltemplate-2E_hit .inlinerollresult,
.sheet-rolltemplate-2E_damage .inlinerollresult,
.sheet-rolltemplate-2E_spell-priest .inlinerollresult,
.sheet-rolltemplate-2E_spell-wizard .inlinerollresult,
.sheet-rolltemplate-2E_spell-powers .inlinerollresult,
.sheet-rolltemplate-2E_proficiency .inlinerollresult,
.sheet-rolltemplate-2E_rogue .inlinerollresult {
color: White;
background-color: Black;
border-color: Black;
min-width: 1em;
text-align: center;
display: inline-block;
margin-left: 1px;
padding: 0px;
}
/*green*/
.sheet-rolltemplate-2E_generic .inlinerollresult.fullcrit,
.sheet-rolltemplate-2E_hit .inlinerollresult.fullcrit,
.sheet-rolltemplate-2E_damage .inlinerollresult.fullcrit,
.sheet-rolltemplate-2E_spell-priest .inlinerollresult.fullcrit,
.sheet-rolltemplate-2E_spell-wizard .inlinerollresult.fullcrit,
.sheet-rolltemplate-2E_spell-powers .inlinerollresult.fullcrit,
.sheet-rolltemplate-2E_proficiency .inlinerollresult.fullcrit,
.sheet-rolltemplate-2E_rogue .inlinerollresult.fullcrit {
border-color:#3FB315;
color:White;
background-color: #3FB315;
}
/* red*/
.sheet-rolltemplate-2E_generic .inlinerollresult.fullfail,
.sheet-rolltemplate-2E_hit .inlinerollresult.fullfail,
.sheet-rolltemplate-2E_damage .inlinerollresult.fullfail,
.sheet-rolltemplate-2E_spell-priest .inlinerollresult.fullfail,
.sheet-rolltemplate-2E_spell-wizard .inlinerollresult.fullfail,
.sheet-rolltemplate-2E_spell-powers .inlinerollresult.fullfail,
.sheet-rolltemplate-2E_proficiency .inlinerollresult.fullfail,
.sheet-rolltemplate-2E_rogue .inlinerollresult.fullfail {
border-color:#B31515;
color:White;
background-color: #B31515;
}
/* purple when 1 high 1 low */
.sheet-rolltemplate-2E_generic .inlinerollresult.importantroll,
.sheet-rolltemplate-2E_hit .inlinerollresult.importantroll,
.sheet-rolltemplate-2E_damage .inlinerollresult.importantroll,
.sheet-rolltemplate-2E_spell-priest .inlinerollresult.importantroll,
.sheet-rolltemplate-2E_spell-wizard .inlinerollresult.importantroll,
.sheet-rolltemplate-2E_spell-powers .inlinerollresult.importantroll,
.sheet-rolltemplate-2E_proficiency .inlinerollresult.importantroll,
.sheet-rolltemplate-2E_rogue .inlinerollresult.importantroll {
border-color:#4A57ED;
color:White;
background-color: #4A57ED;
} Kind of a wall of TL:DR there, but, any help would be appreciated :D