TRACKER TEMPLATES
POSTED ON Nov 9, 2023 13:15:46 GMT -5
Post by Oxymelon on Nov 9, 2023 13:15:46 GMT -5
[attr="class","punishment-site-template"]
Here is an optional tracker template for you to use if you like! It will automatically reskin to match both the dark or light versions of the skin! The code is quite large so I would highly recommend uses the CTRL+F or CMMD+F function to find the bits of code you need to edit.
[attr="class","punishment-site-template-track"]
[attr="class","punishment-site-template-track-head"]FIRST MIDDLE LAST
00YRS • OCCUPATION • ASTROLOGICAL • SEXUALITY • APP • PLOT
00YRS • OCCUPATION • ASTROLOGICAL • SEXUALITY • APP • PLOT
[attr="class","punishment-site-template-track-content"]
[attr="class","punishment-site-template-track-break"]
SECTION ONE
[attr="class","punishment-site-template-track-section"]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. Nullam ac lacus dolor. Sed vitae porttitor sapien. In ultrices congue laoreet. Suspendisse potenti. Nulla congue auctor magna, efficitur pharetra quam varius in. Integer eu orci at odio lacinia tristique. Morbi sed lobortis quam. Morbi auctor aliquet enim quis pretium. Nullam convallis augue at dolor rutrum pulvinar. Quisque eros leo, semper sit amet nisl vel, egestas dapibus neque. Maecenas ut posuere ante. Mauris sed odio efficitur, rhoncus tortor vitae, malesuada elit.
[attr="class","th th-flower-1-o"] HEADER TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. Nullam ac lacus dolor. Sed vitae porttitor sapien. In ultrices congue laoreet. Suspendisse potenti. Nulla congue auctor magna, efficitur pharetra quam varius in. Integer eu orci at odio lacinia tristique. Morbi sed lobortis quam. Morbi auctor aliquet enim quis pretium. Nullam convallis augue at dolor rutrum pulvinar. Quisque eros leo, semper sit amet nisl vel, egestas dapibus neque. Maecenas ut posuere ante. Mauris sed odio efficitur, rhoncus tortor vitae, malesuada elit.
[attr="class","punishment-site-template-track-break"]
SECTION TWO
[attr="class","punishment-site-template-track-section"]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. Nullam ac lacus dolor. Sed vitae porttitor sapien. In ultrices congue laoreet. Suspendisse potenti. Nulla congue auctor magna, efficitur pharetra quam varius in. Integer eu orci at odio lacinia tristique. Morbi sed lobortis quam. Morbi auctor aliquet enim quis pretium. Nullam convallis augue at dolor rutrum pulvinar. Quisque eros leo, semper sit amet nisl vel, egestas dapibus neque. Maecenas ut posuere ante. Mauris sed odio efficitur, rhoncus tortor vitae, malesuada elit.
"When all of these people keep falling around me I wonder if I could be next. But let's keep it on the brightside."
Curabitur luctus, erat eu efficitur porttitor, erat ante laoreet velit, in pharetra nunc orci a est. Morbi a ipsum egestas, luctus turpis at, scelerisque ipsum. Fusce consequat est at mauris interdum, ac vestibulum enim volutpat. Curabitur iaculis tristique nulla, a ultricies libero scelerisque eu. Maecenas nec fringilla mi. Fusce cursus leo in lacus scelerisque, at gravida leo tincidunt. Mauris ac scelerisque nisl. Morbi efficitur congue mauris eu dignissim. Phasellus ullamcorper facilisis mi, finibus dictum dolor sodales eu. Maecenas aliquam odio sed libero volutpat, a malesuada enim blandit. Sed semper orci nisl, sed interdum ex scelerisque ac. Ut eget justo ac massa venenatis ultrices. Ut rhoncus pharetra ultrices. Quisque congue nisi nisi, quis auctor ante pretium in.
[attr="class","th th-flower-1-o"] HEADER TITLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. Nullam ac lacus dolor. Sed vitae porttitor sapien. In ultrices congue laoreet. Suspendisse potenti. Nulla congue auctor magna, efficitur pharetra quam varius in. Integer eu orci at odio lacinia tristique. Morbi sed lobortis quam. Morbi auctor aliquet enim quis pretium. Nullam convallis augue at dolor rutrum pulvinar. Quisque eros leo, semper sit amet nisl vel, egestas dapibus neque. Maecenas ut posuere ante. Mauris sed odio efficitur, rhoncus tortor vitae, malesuada elit.
"When all of these people keep falling around me I wonder if I could be next. But let's keep it on the brightside."
Curabitur luctus, erat eu efficitur porttitor, erat ante laoreet velit, in pharetra nunc orci a est. Morbi a ipsum egestas, luctus turpis at, scelerisque ipsum. Fusce consequat est at mauris interdum, ac vestibulum enim volutpat. Curabitur iaculis tristique nulla, a ultricies libero scelerisque eu. Maecenas nec fringilla mi. Fusce cursus leo in lacus scelerisque, at gravida leo tincidunt. Mauris ac scelerisque nisl. Morbi efficitur congue mauris eu dignissim. Phasellus ullamcorper facilisis mi, finibus dictum dolor sodales eu. Maecenas aliquam odio sed libero volutpat, a malesuada enim blandit. Sed semper orci nisl, sed interdum ex scelerisque ac. Ut eget justo ac massa venenatis ultrices. Ut rhoncus pharetra ultrices. Quisque congue nisi nisi, quis auctor ante pretium in.
[attr="class","punishment-site-template-track-break"]
RELATIONSHIPS
[attr="class","punishment-site-template-track-section"]
[attr="class","th th-flower-1-o"] ACTIVE PLAYER CHARACTERS
FIRST LAST DYNAMIC Thoughts, history, notes here! Looots of text. Put all the text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. |
[attr="class","th th-flower-1-o"] INACTIVE PLAYER CHARACTERS
FIRST LAST DYNAMIC Thoughts, history, notes here! Looots of text. Put all the text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. |
[attr="class","th th-flower-1-o"] NPCs
FIRST LAST DYNAMIC Thoughts, history, notes here! Looots of text. Put all the text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. |
[attr="class","punishment-site-template-track-break"]
THREADS
[attr="class","punishment-site-template-track-section"]
THREAD NAME
THREAD NAME
THREAD NAME
THREAD NAME
[attr="class","th th-flower-1-o"] ONGOING
THREAD NAME
WITH CHARACTER NAME
Summary of Events
[attr="class","th th-flower-1-o"] COMPLETE
THREAD NAME
WITH CHARACTER NAME
Summary of Events
[attr="class","th th-flower-1-o"] TECHNOLOGY
THREAD NAME
WITH CHARACTER NAME
Summary of Events
[attr="class","th th-flower-1-o"] INACTIVE
THREAD NAME
WITH CHARACTER NAME
Summary of Events
Code Under the Spoiler:
[div align="center"][div][attr="class","punishment-site-template-track"][div][attr="class","punishment-site-template-track-head"][font color="888888"]FIRST MIDDLE LAST[/font]
[span][b]00YRS • OCCUPATION • ASTROLOGICAL • SEXUALITY • [a]APP[/a] • [a]PLOT[/a][/b][/span][/div][div align="center"][img src="https://placehold.co/500x250"][/div]
[div][attr="class","punishment-site-template-track-content"][div][attr="class","punishment-site-template-track-break"][div align="center"]SECTION ONE[/div][/div]
[spoiler][div][attr="class","punishment-site-template-track-section"]
[div align="center"][div style="width:300px;font:800 15px/12px Poppins;text-transform:uppercase;padding-bottom:10px;border-bottom:1px solid #b6b6b6;][span][attr="class","th th-flower-1-o"][/span] HEADER TITLE[/div][/div]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. Nullam ac lacus dolor. Sed vitae porttitor sapien. In ultrices congue laoreet. Suspendisse potenti. Nulla congue auctor magna, efficitur pharetra quam varius in. Integer eu orci at odio lacinia tristique. Morbi sed lobortis quam. Morbi auctor aliquet enim quis pretium. Nullam convallis augue at dolor rutrum pulvinar. Quisque eros leo, semper sit amet nisl vel, egestas dapibus neque. Maecenas ut posuere ante. Mauris sed odio efficitur, rhoncus tortor vitae, malesuada elit.[/div][/spoiler]
[div][attr="class","punishment-site-template-track-break"][div align="center"]SECTION TWO[/div][/div]
[spoiler][div][attr="class","punishment-site-template-track-section"]
[div align="center"][div style="width:300px;font:800 15px/12px Poppins;text-transform:uppercase;padding-bottom:5px;border-bottom:1px solid #b6b6b6;][span][attr="class","th th-flower-1-o"][/span] HEADER TITLE[/div][/div]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. Nullam ac lacus dolor. Sed vitae porttitor sapien. In ultrices congue laoreet. Suspendisse potenti. Nulla congue auctor magna, efficitur pharetra quam varius in. Integer eu orci at odio lacinia tristique. Morbi sed lobortis quam. Morbi auctor aliquet enim quis pretium. Nullam convallis augue at dolor rutrum pulvinar. Quisque eros leo, semper sit amet nisl vel, egestas dapibus neque. Maecenas ut posuere ante. Mauris sed odio efficitur, rhoncus tortor vitae, malesuada elit.
"When all of these people keep falling around me I wonder if I could be next. But let's keep it on the brightside."
Curabitur luctus, erat eu efficitur porttitor, erat ante laoreet velit, in pharetra nunc orci a est. Morbi a ipsum egestas, luctus turpis at, scelerisque ipsum. Fusce consequat est at mauris interdum, ac vestibulum enim volutpat. Curabitur iaculis tristique nulla, a ultricies libero scelerisque eu. Maecenas nec fringilla mi. Fusce cursus leo in lacus scelerisque, at gravida leo tincidunt. Mauris ac scelerisque nisl. Morbi efficitur congue mauris eu dignissim. Phasellus ullamcorper facilisis mi, finibus dictum dolor sodales eu. Maecenas aliquam odio sed libero volutpat, a malesuada enim blandit. Sed semper orci nisl, sed interdum ex scelerisque ac. Ut eget justo ac massa venenatis ultrices. Ut rhoncus pharetra ultrices. Quisque congue nisi nisi, quis auctor ante pretium in.[/div][/spoiler]
[div][attr="class","punishment-site-template-track-break"][div align="center"]RELATIONSHIPS[/div][/div]
[spoiler][div][attr="class","punishment-site-template-track-section"]
[div align="center"][div style="width:300px;font:800 15px/12px Poppins;text-transform:uppercase;padding-bottom:5px;border-bottom:1px solid #b6b6b6;][span][attr="class","th th-flower-1-o"][/span] ACTIVE PLAYER CHARACTERS[/div][/div]
[div style="width:450px;height:auto;padding:0 10px 0 10px;margin-left:-10px;"][table][tbody][tr][td style="width:100px;][img style="max-width:100px;border-radius:100%;border:5px solid #000;" src="https://placehold.co/100x100"][/td][td style="vertical-align:middle!important;"][span][div style="padding:0 0 0 10px;text-transform:uppercase;font:800 14px/25px Poppins;"][b]FIRST LAST[/b][/div][div style="padding-left:10px;margin-top:-5px;font-family:open sans;font-size:10px;letter-spacing:1px;text-align:left;"]DYNAMIC[/div][div style="padding-left:10px;font-size:11px;margin-top:-10px;"]
Thoughts, history, notes here! Looots of text. Put all the text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. [/div][/span][/td][/tr][/tbody][/table][/div]
[div align="center"][div style="width:300px;font:800 15px/12px Poppins;text-transform:uppercase;padding-bottom:5px;border-bottom:1px solid #b6b6b6;][span][attr="class","th th-flower-1-o"][/span] INACTIVE PLAYER CHARACTERS[/div][/div]
[div style="width:390px;height:auto;padding:0 10px 0 10px;margin-left:-10px;"][table][tbody][tr][td style="width:100px;][img style="max-width:100px;border-radius:100%;border:5px solid #000;" src="https://placehold.co/100x100"][/td][td style="vertical-align:middle!important;"][span][div style="padding:0 0 0 10px;text-transform:uppercase;font:800 14px/25px Poppins;"][b]FIRST LAST[/b][/div][div style="padding-left:10px;margin-top:-5px;font-family:open sans;font-size:10px;letter-spacing:1px;text-align:left;"]DYNAMIC[/div][div style="padding-left:10px;font-size:11px;margin-top:-10px;"]
Thoughts, history, notes here! Looots of text. Put all the text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. [/div][/span][/td][/tr][/tbody][/table][/div]
[div align="center"][div style="width:300px;font:800 15px/12px Poppins;text-transform:uppercase;padding-bottom:5px;border-bottom:1px solid #b6b6b6;][span][attr="class","th th-flower-1-o"][/span] NPCs[/div][/div]
[div style="width:390px;height:auto;padding:0 10px 0 10px;margin-left:-10px;"][table][tbody][tr][td style="width:100px;][img style="max-width:100px;border-radius:100%;border:5px solid #000;" src="https://placehold.co/100x100"][/td][td style="vertical-align:middle!important;"][span][div style="padding:0 0 0 10px;text-transform:uppercase;font:800 14px/25px Poppins;"][b]FIRST LAST[/b][/div][div style="padding-left:10px;margin-top:-5px;font-family:open sans;font-size:10px;letter-spacing:1px;text-align:left;"]DYNAMIC[/div][div style="padding-left:10px;font-size:11px;margin-top:-10px;"]
Thoughts, history, notes here! Looots of text. Put all the text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc commodo pretium arcu sed ornare. Quisque id lacus a nunc sagittis ullamcorper ut quis ante. Curabitur non dui massa. [/div][/span][/td][/tr][/tbody][/table][/div][/div][/spoiler]
[div][attr="class","punishment-site-template-track-break"][div align="center"]THREADS[/div][/div]
[spoiler]
[div][attr="class","punishment-site-template-track-section"][div align="center"][div style="width:300px;font:800 15px/12px Poppins;text-transform:uppercase;padding-bottom:5px;border-bottom:1px solid #b6b6b6;][span][attr="class","th th-flower-1-o"][/span] ONGOING[/div][/div][div style="padding-left:20px;"]
[a]THREAD NAME[/a]
[div style="font:400 11px/11px Poppins;"]WITH [b]CHARACTER NAME[/b][/div][div style="margin-left:15px;font-size:11px;"]Summary of Events[/div]
[div align="center"][div style="width:300px;font:800 15px/12px Poppins;text-transform:uppercase;padding-bottom:5px;border-bottom:1px solid #b6b6b6;][span][attr="class","th th-flower-1-o"][/span] COMPLETE[/div][/div]
[a]THREAD NAME[/a]
[div style="font:400 11px/11px Poppins;"]WITH [b]CHARACTER NAME[/b][/div][div style="margin-left:15px;font-size:11px;"]Summary of Events[/div]
[div align="center"][div style="width:300px;font:800 15px/12px Poppins;text-transform:uppercase;padding-bottom:5px;border-bottom:1px solid #b6b6b6;][span][attr="class","th th-flower-1-o"][/span] TECHNOLOGY[/div][/div]
[a]THREAD NAME[/a]
[div style="font:400 11px/11px Poppins;"]WITH [b]CHARACTER NAME[/b][/div][div style="margin-left:15px;font-size:11px;"]Summary of Events[/div]
[div align="center"][div style="width:300px;font:800 15px/12px Poppins;text-transform:uppercase;padding-bottom:5px;border-bottom:1px solid #b6b6b6;][span][attr="class","th th-flower-1-o"][/span] INACTIVE[/div][/div]
[a]THREAD NAME[/a]
[div style="font:400 11px/11px Poppins;"]WITH [b]CHARACTER NAME[/b][/div][div style="margin-left:15px;font-size:11px;"]Summary of Events[/div]
[/div][/div][/spoiler]
[/div][/div]