Character Vault
Any Concept / Any System
Compendium
Your System Come To Life
Roll20 for Android
Streamlined for your Tablet
Roll20 for iPad
Streamlined for your Tablet

Personal tools

Difference between revisions of "Stylus"

From Roll20 Wiki

Jump to: navigation, search
m
m (Add snippet section)
Line 14: Line 14:
 
'''Note:''' there is a similarly named extension "Stylish", but it's stealing your browser history [https://robertheaton.com/2018/08/16/stylish-is-back-and-you-still-shouldnt-use-it/ "Stylish" is back, and you still shouldn't use it]
 
'''Note:''' there is a similarly named extension "Stylish", but it's stealing your browser history [https://robertheaton.com/2018/08/16/stylish-is-back-and-you-still-shouldnt-use-it/ "Stylish" is back, and you still shouldn't use it]
  
<noinclude>[[Category:Web Browser]][[Category:Web Browser Extensions]]</noinclude>
+
<noinclude>
 +
==Stylus Snippets==
 +
 
 +
'''Display filesize/dimensions in {{Art Library}}''' (by Keith)
 +
<pre data-language="css">#marketplaceresults li::after,
 +
#recentuploads li::after{
 +
    background-color: white;
 +
    content: attr(data-grid-width)"x"attr(data-grid-height);
 +
    display: inline-block;
 +
    font-size: 1em;
 +
    padding-left: 30px;
 +
    position: absolute;
 +
    right: 0;
 +
}
 +
</pre>
 +
[[Category:Web Browser]][[Category:Web Browser Extensions]]</noinclude>

Revision as of 11:30, 9 January 2022

Main Page: Browser

Stylus is a plugin that can change how webpages look, and many roll20 users have created their own tricks and minor adjustments to Roll20 for personal use. Things like changing how certain tools look in Roll20, making a Dark Mode, adjusting looks on character sheets, or how things look in the q Text Chat.

Note: there is a similarly named extension "Stylish", but it's stealing your browser history "Stylish" is back, and you still shouldn't use it


Stylus Snippets

Display filesize/dimensions in P Art Library (by Keith)

#marketplaceresults li::after,
#recentuploads li::after{
    background-color: white;
    content: attr(data-grid-width)"x"attr(data-grid-height);
    display: inline-block;
    font-size: 1em;
    padding-left: 30px;
    position: absolute;
    right: 0;
}