jay, novice human (![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png)
10billionghosts) wrote2024-03-03 12:59 pm
10billionghosts) wrote2024-03-03 12:59 pm
live preview & code for SALAD Thread Trackers
This is the release post for the SALAD set's thread trackers. Don't forget to head over to the SALAD release hub to see the other codes released as part of this pack!
SALAD Thread Tracker was the first code I developed for this set. It comes in three in-entry flavors and a comment compatible code that is as close to the general aesthetic of this set as I could get while still being functional lmao. You can pick up the code for each styling beneath its live preview, or head over to the release hub to see all the codes in the set!
HOW TO USE:
❣️ Mind those lj-raw tags!!
❣️ This code is mobile compatible, insane journal friendly and comes with a comment compatible variant featured in the comments of this post. NO OTHER PART OF THIS SET IS COMMENT COMPATIBLE.
❣️ While this set is modular, it doesn't make for good Frankenstein fodder. What that means is, I can't guarantee it'll play nice with other codes (like '98, TAYNE, or codes made by other creators) without some amount of code tweaking, so combine with other codes at your own risk.
❣️ For the in-entry codes, you can apply a seamless tiling background to the outer wrapper. Replace the BG_HERE placeholder text with the URL for the image you'd like to use. The stuff at transparenttextures.com works great for this!
❣️ You can set any collapsible parts of this code to be open by default by adding the word "open" immediately after the word "details" in the code. Like this:
❣️ The tracker portion of each code comes with 1 header row and 2 placeholder "thread" entries by default. You can add additional thread entries by copying and pasting where indicated in the code.
❣️ While you can change the text shown on each header, changing the amount of headers requires messing with grids. If you're really hankering for fewer headers, but aren't comfortable messing with HTML, you can find a variant of JUST the thread tracking portion of the code over at the SALAD hub post.
❣️ Add additional subsections by pasting full codes where indicated. Comments within the code indicate where to add new subsections and where those sections begin and end. You can add as many subsections as you want. Everything will auto-scale!
❣️ By default, colors are standard for all standalone codes and subsections. I encourage you to customize them! Here're the hex codes you'll want to update:
❣️ I love peeking at what people do with my codes, so feel free to comment if you use! If you'd like, you can also donate to my ko-fi!
INDIVIDUAL CODES BENEATH THIS POINT
SALAD Thread Tracker was the first code I developed for this set. It comes in three in-entry flavors and a comment compatible code that is as close to the general aesthetic of this set as I could get while still being functional lmao. You can pick up the code for each styling beneath its live preview, or head over to the release hub to see all the codes in the set!
HOW TO USE:
❣️ Mind those lj-raw tags!!
❣️ This code is mobile compatible, insane journal friendly and comes with a comment compatible variant featured in the comments of this post. NO OTHER PART OF THIS SET IS COMMENT COMPATIBLE.
❣️ While this set is modular, it doesn't make for good Frankenstein fodder. What that means is, I can't guarantee it'll play nice with other codes (like '98, TAYNE, or codes made by other creators) without some amount of code tweaking, so combine with other codes at your own risk.
❣️ For the in-entry codes, you can apply a seamless tiling background to the outer wrapper. Replace the BG_HERE placeholder text with the URL for the image you'd like to use. The stuff at transparenttextures.com works great for this!
❣️ You can set any collapsible parts of this code to be open by default by adding the word "open" immediately after the word "details" in the code. Like this:
<details open style="width:100%">❣️ The tracker portion of each code comes with 1 header row and 2 placeholder "thread" entries by default. You can add additional thread entries by copying and pasting where indicated in the code.
❣️ While you can change the text shown on each header, changing the amount of headers requires messing with grids. If you're really hankering for fewer headers, but aren't comfortable messing with HTML, you can find a variant of JUST the thread tracking portion of the code over at the SALAD hub post.
❣️ Add additional subsections by pasting full codes where indicated. Comments within the code indicate where to add new subsections and where those sections begin and end. You can add as many subsections as you want. Everything will auto-scale!
❣️ By default, colors are standard for all standalone codes and subsections. I encourage you to customize them! Here're the hex codes you'll want to update:
- hex code #5c4677 - used extensively throughout code; definitely use find and replace to update.
- hex code #fff - white. sub-section background color and font color.
- hex code #232323 - used for borders and shadows.
- hex code #e0d7ea - used for some accents.
❣️ I love peeking at what people do with my codes, so feel free to comment if you use! If you'd like, you can also donate to my ko-fi!
Louis de Pointe du Lac
Just putting this here even though I'm not sure anyone ever reads the sample text lmao. I achieved the background on this particular live example by using an otherwise opaque tiling background and then adding background-blend-mode to the CSS and playing around with its options until I found one I liked. You can, too!
SALAD Thread Tracker Basic features a header for some text and one (open by default) collapsible tracker section.
THREAD TRACKER Basic CODE:
Character Name
Character Name
HEADER TEXT.
Dragée marshmallow sweet roll muffin tiramisu shortbread tart oat cake marshmallow. Chocolate bar chocolate powder bear claw bonbon sugar plum. Sweet shortbread sweet roll cake tootsie roll icing macaroon candy canes bear claw.
Dragée marshmallow sweet roll muffin tiramisu shortbread tart oat cake marshmallow. Chocolate bar chocolate powder bear claw bonbon sugar plum. Sweet shortbread sweet roll cake tootsie roll icing macaroon candy canes bear claw.
Character Name
Character Name
HEADER TEXT.
Dragée marshmallow sweet roll muffin tiramisu shortbread tart oat cake marshmallow. Chocolate bar chocolate powder bear claw bonbon sugar plum. Sweet shortbread sweet roll cake tootsie roll icing macaroon candy canes bear claw.
Dragée marshmallow sweet roll muffin tiramisu shortbread tart oat cake marshmallow. Chocolate bar chocolate powder bear claw bonbon sugar plum. Sweet shortbread sweet roll cake tootsie roll icing macaroon candy canes bear claw.
SALAD Thread Tracker by Character is styled to track threads and activity for multiple characters. It utilizes details tags to save a bit on vertical space. You can click each header to open or close a character section.
THREAD TRACKER by Character CODE:
January
January
SALAD Thread Tracker Monthly has three (unnamed) months loaded in by default, even if the above preview only has two. You can add additional months by copying the THREAD TRACKER section and pasting more in where indicated in the code.
THREAD TRACKER Monthly CODE:
(frozen comment) SALAD-ISH, comment compatible thread tracker
no subject
Do you have any idea why this might be, or what I might be able to do to fix it?
Thanks again for your lovely thread tracker!
no subject
So, for example:
<b>HEADER TEXT</b> a short description
should be
<div><b>HEADER TEXT</b> a short description</div>
THAT should solve the issue I think! Let me know if it's still goofy?
no subject