permissions: tesseract

[transilience]

Clicky-expandy with no need for cut tags.

OOC permissions

• backtagging YOUR ANSWER HERE
• threadhopping YOUR ANSWER HERE
• fourthwalling YOUR ANSWER HERE
• off-limits YOUR ANSWER HERE

IC permissions

• physical contact YOUR ANSWER HERE
• mental contact YOUR ANSWER HERE
• fighting/injury YOUR ANSWER HERE
• death YOUR ANSWER HERE
• other Here is where we demonstrate what happens when a lot of freaking text goes into one of these spots.

SHIPPING

• otp ✓✓✓ NOTES
• good ship ✓ NOTES
• okay ship ✓/✗ NOTES
• bad ship ✗ NOTES
• notp ✗✗✗ NOTES

Other

• powers and abilities
• kink list
• contact info
• anything else you need a box for

blue code

<raw-code><div style="font-family: 'Palatino', 'Book Antiqua', serif; font-size: 13pt; width: 500px; margin: auto; border-right: 2px solid #5f9fb0;"> <details open><summary style="font-size: 16pt; text-transform: uppercase; margin: 1em auto; padding: .28em; background: #425863; background: linear-gradient(to right, #425863 0%, #75bdd1 20%, #5f9fb0 100%); color: #fff; border-top-left-radius: 8px; border-bottom-left-radius: 8px;">OOC permissions</summary> <ul style="list-style: none; border: 0.5em solid transparent;"> <li><b style="color: #5f9fb0; font-style: italic;">backtagging</b> YOUR ANSWER HERE</li> <li><b style="color: #5f9fb0; font-style: italic;">threadhopping</b> YOUR ANSWER HERE</li> <li><b style="color: #5f9fb0; font-style: italic;">fourthwalling</b> YOUR ANSWER HERE</li> <li><b style="color: #5f9fb0; font-style: italic;">off-limits</b> YOUR ANSWER HERE</li> </ul></details> <details><summary style="font-size: 16pt; text-transform: uppercase; margin: 1em auto; padding: .28em; background: #425863; background: linear-gradient(to right, #425863 0%, #75bdd1 40%, #5f9fb0 100%); color: #fff; border-top-left-radius: 8px; border-bottom-left-radius: 8px;">IC permissions</summary> <ul style="list-style: none; border: 0.5em solid transparent;"> <li><b style="color: #5f9fb0; font-style: italic;">physical contact</b> YOUR ANSWER HERE</li> <li><b style="color: #5f9fb0; font-style: italic;">mental contact</b> YOUR ANSWER HERE</li> <li><b style="color: #5f9fb0; font-style: italic;">fighting/injury</b> YOUR ANSWER HERE</li> <li><b style="color: #5f9fb0; font-style: italic;">death</b> YOUR ANSWER HERE</li> <li><b style="color: #5f9fb0; font-style: italic;">other</b> Here is where we demonstrate what happens when a lot of freaking text goes into one of these spots.</li> </ul></details> <details><summary style="font-size: 16pt; text-transform: uppercase; margin: 1em auto; padding: .28em; background: #425863; background: linear-gradient(to right, #425863 0%, #75bdd1 60%, #5f9fb0 100%); color: #fff; border-top-left-radius: 8px; border-bottom-left-radius: 8px;">SHIPPING</summary> <ul style="list-style: none; border: 0.5em solid transparent;"> <li><b style="color: #5f9fb0; font-style: italic;">otp</b> ✓✓✓ NOTES</li> <li><b style="color: #5f9fb0; font-style: italic;">good ship</b> ✓ NOTES</li> <li><b style="color: #5f9fb0; font-style: italic;">okay ship</b> ✓/✗ NOTES</li> <li><b style="color: #5f9fb0; font-style: italic;">bad ship</b> ✗ NOTES</li> <li><b style="color: #5f9fb0; font-style: italic;">notp</b> ✗✗✗ NOTES</li> </ul></details> <details><summary style="font-size: 16pt; text-transform: uppercase; margin: 1em auto; padding: .28em; background: #425863; background: linear-gradient(to right, #425863 0%, #75bdd1 80%, #5f9fb0 100%); color: #fff; border-top-left-radius: 8px; border-bottom-left-radius: 8px;">Other</summary> <ul style="list-style: none; border: 0.5em solid transparent;"> <li>powers and abilities</li> <li>kink list</li> <li>contact info</li> <li>anything else you need a box for</li> </ul></details> </div></raw-code>

gold code

<raw-code><div style="font-family: 'Palatino', 'Book Antiqua', serif; font-size: 13pt; width: 500px; margin: auto; border-right: 2px solid #b68d4c;"> <details open><summary style="font-size: 16pt; text-transform: uppercase; margin: 1em auto; padding: .28em; background: #425863; background: linear-gradient(to right, #c19e67 0%, #f3e2c7 20%, #b68d4c 100%); color: #330; border-top-left-radius: 8px; border-bottom-left-radius: 8px;">OOC permissions</summary> <ul style="list-style: none; border: 0.5em solid transparent;"> <li><b style="color: #b68d4c; font-style: italic;">backtagging</b> YOUR ANSWER HERE</li> <li><b style="color: #b68d4c; font-style: italic;">threadhopping</b> YOUR ANSWER HERE</li> <li><b style="color: #b68d4c; font-style: italic;">fourthwalling</b> YOUR ANSWER HERE</li> <li><b style="color: #b68d4c; font-style: italic;">off-limits</b> YOUR ANSWER HERE</li> </ul></details> <details><summary style="font-size: 16pt; text-transform: uppercase; margin: 1em auto; padding: .28em; background: #425863; background: linear-gradient(to right, #c19e67 0%, #f3e2c7 40%, #b68d4c 100%); color: #330; border-top-left-radius: 8px; border-bottom-left-radius: 8px;">IC permissions</summary> <ul style="list-style: none; border: 0.5em solid transparent;"> <li><b style="color: #b68d4c; font-style: italic;">physical contact</b> YOUR ANSWER HERE</li> <li><b style="color: #b68d4c; font-style: italic;">mental contact</b> YOUR ANSWER HERE</li> <li><b style="color: #b68d4c; font-style: italic;">fighting/injury</b> YOUR ANSWER HERE</li> <li><b style="color: #b68d4c; font-style: italic;">death</b> YOUR ANSWER HERE</li> <li><b style="color: #b68d4c; font-style: italic;">other</b> Here is where we demonstrate what happens when a lot of freaking text goes into one of these spots.</li> </ul></details> <details><summary style="font-size: 16pt; text-transform: uppercase; margin: 1em auto; padding: .28em; background: #425863; background: linear-gradient(to right, #c19e67 0%, #f3e2c7 60%, #b68d4c 100%); color: #330; border-top-left-radius: 8px; border-bottom-left-radius: 8px;">SHIPPING</summary> <ul style="list-style: none; border: 0.5em solid transparent;"> <li><b style="color: #b68d4c; font-style: italic;">otp</b> ✓✓✓ NOTES</li> <li><b style="color: #b68d4c; font-style: italic;">good ship</b> ✓ NOTES</li> <li><b style="color: #b68d4c; font-style: italic;">okay ship</b> ✓/✗ NOTES</li> <li><b style="color: #b68d4c; font-style: italic;">bad ship</b> ✗ NOTES</li> <li><b style="color: #b68d4c; font-style: italic;">notp</b> ✗✗✗ NOTES</li> </ul></details> <details><summary style="font-size: 16pt; text-transform: uppercase; margin: 1em auto; padding: .28em; background: #425863; background: linear-gradient(to right, #c19e67 0%, #f3e2c7 80%, #b68d4c 100%); color: #330; border-top-left-radius: 8px; border-bottom-left-radius: 8px;">Other</summary> <ul style="list-style: none; border: 0.5em solid transparent;"> <li>powers and abilities</li> <li>kink list</li> <li>contact info</li> <li>anything else you need a box for</li> </ul></details> </div></raw-code>

find and replace:

blue gradient #425863, #75bdd1, #5f9fb0 & heading text #fff
gold gradient #c19e67, #f3e2c7, #b68d4c & heading text #330

Comments

[bardsley]

This is so cool! Thank you.

[transilience]

welcome!

[divaricate]

I love this and will find a use for it on some of my journals!

[transilience]

awesome, enjoy!

[myrmidon]

I admittedly haven't dug into this too far, but is it possible with the code to add additional sections? This would make a baller timeline code, if it's easily possible.

[transilience]

Absolutely, the only caveat is that if you want the gradients to align smoothly you'll have to tweak the percentages depending on how many sections you end up with.

[myrmidon]

Perfect, I'll keep that in mind as I look to tweak it! Thank you!

[fauntofwisdom]

Using this, I love these gradients!

[lvb]

Amazing! I'm using this in my journal now

[doctorpalmer]

Using with numerous journals and will link back here for others as well! Thank you so much for this!