Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

Custom Sheet rolltemplate not applying CSS

Hello! I'm working on a Custom Sheet and I'm kind of stuck. For some reason, when creating a roll template the CSS from it is not applying on the chat. here is the rollTemplate: < rolltemplate class = "sheet-rolltemplate-movement" >     < div class = "sheet-template-container" >       < h4 > {{nombre}} </ h4 >       < p >< b > {{caracteristica}}: </ b > {{tirada}} </ p >         {{#rollGreater() tirada 9}}         < div class = "sheet-result" >           < b > 10+: </ b >< br />           {{{exito10}}}         </ div >       {{/rollGreater() tirada 9}}         {{#rollBetween() tirada 7 9}}         < div class = "sheet-result" >           < b > 7-9: </ b >< br />           {{{exito7}}}         </ div >       {{/rollBetween() tirada 7 9}}         {{#rollLess() tirada 7}}         < div class = "sheet-result" >           < b > 6-: </ b >< br />           {{{fallo}}}         </ div >       {{/rollLess() tirada 7}}     </ div >   </ rolltemplate > the button to invoke it: < button type = "roll" name = "roll_castigar_oscuridad" class = "roll-movimiento"   value = "&{template:movement} {{nombre=Castigar la Oscuridad}} {{caracteristica=Combativa}} {{tirada=[[2d6 + @{combativa} + @{penalizador_combativa}]]}} {{exito10=Elige uno: < br/>   ✽ Haz Castigo al enemigo. < br/>   ✽ Derrota Marionetas.}} {{exito7=Elige uno: < br/>   ✽ Haz Castigo al enemigo, a continuación sufre Angustia. < br/>   ✽ Derrota a una Marioneta o bien derrota a varias Marionetas recibiendo Angustia. < br/>   ✽ No haces Castigo al enemigo ni derrotas Marionetas, pero no recibes Angustia. Suma +1 a tu próximo Movimiento.}} {{fallo=El MC decide cómo la Oscuridad se impone en este momento.}}" > </ button > and the CSS: .sheet-rolltemplate-movement {   background-color : # fff5f8 ;   border : 2px solid # 8C358C ;   border-radius : 10px ;   padding : 10px ;   font-family : "Verdana" , sans-serif ;   font-size : 12px ;   color : # 333 ;   margin : 5px ; } .sheet-rolltemplate-movement h4 {   margin : 0 0 5px 0 ;   font-size : 14px ;   color : # 8C358C ;   border-bottom : 1px solid # e0b4d7 ;   padding-bottom : 3px ; } .sheet-rolltemplate-movement p {   margin : 5px 0 ; } .sheet-rolltemplate-movement .sheet-result {   background-color : # fce4ec ;   border : 1px solid # ec407a ;   border-radius : 6px ;   padding : 6px ;   margin : 6px 0 ; } .sheet-rolltemplate-movement b {   color : # BA68C8 ; } Hope you can help me with it since it's getting kind of frustating. Thanks!
1744638612

Edited 1744638630
vÍnce
Pro
Sheet Author
What happens if you simplify your roll macro?  Just make the most basic roll to test. The line breaks `<br/>` could be breaking things.  Try using %NEWLINE% instead of <br> if you need new lines.
1744641426
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator
I'd also recommend using my auto upload extension. It will alert you if there are problem characters in your css that might cause the r20 sanitizer to throw the css file out for roll templates.
Hi guys,  quick update: -thanks to a thrid party author, tried just the code I provided in another sandbox and it's working correctly. -I tried what vÍnce suggested but I'm still with the same error. -I installed Scott C. extension. It eases the pain of uploading the files, which I appreciatte. Moreover it shows the css file in yellow, so something must be wrong with it. Is there a way to check on the logs why it's marking as yellow? What does the extension check? I'll uploaded the styles.css just in case it helps finding the missiing ; or whatever.
I've uploaded the files to: <a href="https://drive.google.com/drive/folders/1oqDTJMz09cbAAHLsB9zOY1cvsiI3EuJM?usp=sharing" rel="nofollow">https://drive.google.com/drive/folders/1oqDTJMz09cbAAHLsB9zOY1cvsiI3EuJM?usp=sharing</a>
Found it! I was using this line from the beggining of the project, before I changed it from a background image. background-image: conic-gradient(from var(--angle), transparent 90%, #13003d), conic-gradient(from var(--angle), transparent 90%, #f8bbd0); And as I read roll20 doesn-t like much things in there. Now it's working marbles, thanks a lot everyone!