" |
Superfly Reply 4 Modding Guide =============================================================== The parts of SuperFly Reply now have class names that you can use to change it's appearance: .sfr.box = container of all parts .sfr.bg = a div made to hold a background image .sfr.resizer = resizer bar at the top .sfr.resizer.lite = the resizer bar that lights up when you drag it .sfr.controls = black bar at the top with text widgets .sfr.reply = reply button .sfr.text = the large textarea that you type into .sfr.mascot = the squirrel that's chillaxing in the upper left corner .sfr.mascot2 = the oncerned squirrel that appears when your comment is too long .sfr.close = close button Usage: You can easily modify these using Stylish (an addon/extention that you install) and a little CSS code. Stylish for firefox: https://addons.mozilla.org/en-US/firefox/addon/stylish/ Stylish for Chrome: https://chrome.google.com/webstore/detail/stylish/fjnbn... Stylish for Opera: https://addons.opera.com/en/extensions/details/stylish/ Click the Stylish icon > write new style > For inkbunny.net... The you can paste in one of the examples below, then save / enable it to see the result: If you don't like seeing Skippy the squirrel then you can use this to make him go away: .sfr.mascot ,.sfr.mascot2{ Display:none !important; } or change the hilite color of the resizer bar: .sfr.resizer.lite{ background-color:red !important; } the "!important" part makes sure that the CSS rule sticks. Tips --------------------------------------------------------------------------------------------- To fill a div with color and change it's opacity while keeping the text's opacity use rgba(R,G,B,alpha), ie: rgba(0,0,0,.5) To add other images without editing the javascript or creating extra HTML code, use psuedo elements in CSS like so: .sfr.mascot::before{ content:''; background-image: url( 'URL or base64 code goes here' ); } the content:'' needs to be there for it to show. http://www.w3schools.com/css/ was a great help in learning CSS and javascript! |
" |
7/19/2021, version 4.4: The mascot version with skippy or sneezer in the left corner of the reply box only looked good on 1080p monitors but seemed too large on the 720p screen I was forced to work on. So I thought it would be easier for me and everyone else to remove the image and just keep it plain and simple looking. 4/4/2020, version 4.3: Fixed broken code. Added a function to scroll reply comment to the middle of the screen. Handicap - now requires Content Security Policy to be disabled for InkBunny for the script to even work in waterfox (but not other browsers as far as I know). Not happy about this, but there's no other way to make it work without doing this :/ 1/26/2017, version 4.0: *SFR is now ready to be used when the page is shown. You no longer have to wait for it load completely. ^___^ *Changed the mascot to Skippy, because he's so darn cuuuuuuute! *Modified the height a lil bit on the textarea, some pixels were showing through on the bottom. |