#css formatting

[final-fate]

✨ A MULTIMEDIA MANGAKA UPGRADE: The Art of the Date! 🎭🌑🔥✨

I am losing my absolute mind over this! I commissioned the incredibly talented @aisheux, told them to draw whatever scene sparked their creativity, and they produced this phenomenal, sequential manga masterpiece for Chapter 7! 🤩🖤

Because this art is so dynamic, I decided to do a massive formatting overhaul on AO3. Chapter 7 is now a Light Novel experience. I have officially updated the chapter's custom CSS, and these four stunning panels are now embedded directly into the text at the exact narrative beats they occur! You can read the scene and see the exact moment the God of Festivals and the Goddess of the Void step into the Asakusa night market.

Aishy actually cranked this entire piece out in a single night to help support their tuition. They told me this scene had them literally kicking their feet in delight, and you can feel that exact energy in the art! And the wildest part? This is only Page 1. There is MORE art coming for this chapter soon! Please go shower them with love!

🎨 Artist: @aisheux

🔗 Check out their work, click here!

Go experience the new formatting and reread the ultimate Slow Burn date!

🔗 Read Chapter 7: Gold Buttons and Golden Rules on AO3, complete with the newly integrated art!

[mlbigbang]

How To: Gradient AO3 Divider

Last year we prepared a little something to make the fics written for our event more uniform and look a little more fun. This materialized as a workskin coded by @alto-tenure that contains a colourful gradient divider for AO3 from the colours of our theme.

To learn how to make yourself a colourful divider like this one without any graphic skills, see the tutorial under the read-more.

At first, you'll need to create a Work Skin:

Go to your profile on AO3 and choose the “Skins” option. Click “My Work Skins”, and there “Create Work Skin”.

Name the skin. (This has to be a unique name out of every AO3 user’s personal workskins, so “BigBang” or other straightforward names will most likely be taken, meaning you have to play around a little to find an eligible one.)

To the “CSS” box, copy paste the following html code and insert the HEX code of the colours you want to use (for example, #66c50b for our brightest green). We specified out 6 colours here, but you can use as many as you like.

#workskin .hr { height: 3px; width: 35%; background-image: linear-gradient(to right, #HEXcode, #HEXcode, #HEXcode); text-align: center; }

Click “Update” at the bottom of the page.

2. Second, you'll need to start using the Work Skin

Go to publish a new work or chapter like you normally would.

At the “Associations” section, select the previously created Work Skin.

Insert the text like you normally would, then click on the “HTML”view. Here, search for the placeholder(s) you left, where the section break(s) have to be.

Delete these, replacing them with the following code at every place you want to have a divider:

<div align="center"> <div class="hr"></div></div>

You're done, post your work! 🎉