quack.gay/stoplight.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta charset="utf-8">
        <meta http-equiv="content-type" content="text/html">
        <title>Stoplight Schema</title>
        <link rel="stylesheet" href="./styles.css">
        <link rel="stylesheet" href="./stoplight-styles.css">
        <link rel="icon" href="./res/icon.png">
    </head>
    <body>
        <div id="wrapper">
            <header>
                <h1>Stoplight Schema</h1>
                <nav>
                    <ul>
                        <li>
                            <a href="/">Home</a>
                        </li>
                        <li>
                            <a href="./stoplight">Stoplight Schema</a>
                        </li>
                    </ul>
                </nav>
                <hr>
            </header>
            <div id="content">
                <p>Managing routines is a very important part of me being able to function as a person. In trying to do this, there's one major problem I'd consistently come across.</p>
                <p>In every system I make to manage my routines, I would create it for one version of me. It would work best for my headspace and energy level at the time, and when that headspace would shift the system would fall apart.</p>
                <p>Enter, the Stoplight Schema...</p>
                <div class="example-img-container">
                    <img width="100%" src="./res/stoplight-habit-v2.png" alt="Habit Tracker with additional energy level indicators, and markers to associate tasks with energy levels.">
                </div>
                <hr>
                <p>This may look like your standard habit tracker, but it has a few unique traits that help you get stuff done, no matter your energy level.</p>
                <p>It does this by allowing you to:</p>
                <ul>
                    <li>Keep your energy level in mind as best you can.</li>
                    <li>Do only what is required with respect to your energy level.</li>
                </ul>
                <p>Both of these things together help you avoid burnout while getting what's required done. Now, how does this work?</p>
                <hr>
                <svg width="24", height="32">
                    <rect x="0", y="24", width="16", height="8", fill="#FC6467"></rect>
                    <rect x="0", y="12", width="16", height="8", fill="#FFD483"></rect>
                    <rect x="0", y="0", width="16", height="8", fill="#6E9277"></rect>
                </svg>
                <hr>
                <p>These "stoplights" represent your energy level. Green being high-energy, yellow being mid-energy, and red being low-energy. You'll see these next to spots where you can write a task, and above each date.</p>
                <p>Here's how you use it:</p>
                <ol>
                    <li>Write each task on the list in the space provided.</li>
                    <li>Mark the energy level associated with each task.
                        <ul>
                            <li>Red items are tasks that must be done, like brushing your teeth or taking medicine.</li>
                            <li>Yellow items are tasks that should be done, like showering or applying deodorant.</li>
                            <li>Green items are tasks that can be done, like applying lotion or planning for tomorrow.</li>
                        </ul>
                    </li>
                    <li>Each day, mark your energy level when you start the routine (or day in the habit tracker version).</li> 
                        <ul>
                            <li>You are only required to do tasks labeled at or below the energy level you marked down.</li>
                        </ul>
                </ol>
                <hr>
                <p>This system has benefit me in allowing my routines to be as flexible as I require, and by allowing me to be kinder to myself for not getting everything done every day; especially cutting myself some slack on low-energy days.</p>
                <p>Feel free to take elements from this or modify it however you wish, hope you're able to find some benefit from it as well!</p>
                <hr>
                <div id="downloads">
                    <h3>Downloads</h3>
                    <div class="img-container">
                        <a href="./res/stoplight-habit-v2.pdf"><img class="dl-img" src="./res/stoplight-habit-v2.png" alt="stoplight schema habit tracker download"></a>
                        <figcaption>A basic habit tracker.</figcaption>
                    </div>
                    <div class="img-container">
                        <a href="./res/stoplight-routine-v2.pdf"><img class="dl-img" src="./res/stoplight-routine-v2.png" alt="stoplight schema routine tracker download"></a>
                        <figcaption>A routine tracker, allowing you to split up things a bit more.</figcaption>
                    </div>
                    <div class="img-container">
                        <a href="./res/stoplight-routine-weekly-v2.pdf"><img class="dl-img" src="./res/stoplight-routine-weekly-v2.png" alt="stoplight schema weekly routine tracker download"></a>
                        <figcaption>A weekly routine tracker, for routines done only once a week, like laundry.</figcaption>
                    </div>
                    <div class="img-container">
                        <a href="./res/stoplight-key-v2.pdf"><img class="dl-img" src="./res/stoplight-key-v2.png" alt="stoplight schema key download"></a>
                        <figcaption>A printable key to help track any custom symbols you come up with.</figcaption>
                    </div>
                    <div class="img-container">
                        <a href="./res/stoplight-routine-v2-bw.pdf"><img class="dl-img" src="./res/stoplight-routine-v2-bw.png" alt="stoplight schema black and white routine tracker download"></a>
                        <figcaption>A black and white version of the routine tracker, colorblind friendly. :)</figcaption>
                    </div>
                </div>
            </div>
            <footer>
                <hr>
                <p>ur gay <3</p>
            </footer>
        </div>
    </body>
</html>
Initial commit 2022-04-22 21:34:50 +00:00			`<!DOCTYPE html>`
			`<html lang="en">`
			`<head>`
			`<meta name="viewport" content="width=device-width, initial-scale=1.0">`
			`<meta charset="utf-8">`
			`<meta http-equiv="content-type" content="text/html">`
			`<title>Stoplight Schema</title>`
split styles.css into multiple files 2022-11-09 18:27:25 +00:00			`<link rel="stylesheet" href="./styles.css">`
updoot 2022-04-22 22:06:43 +00:00			`<link rel="stylesheet" href="./stoplight-styles.css">`
			`<link rel="icon" href="./res/icon.png">`
Initial commit 2022-04-22 21:34:50 +00:00			`</head>`
			`<body>`
			`<div id="wrapper">`
			`<header>`
			`<h1>Stoplight Schema</h1>`
			`<nav>`
			`<ul>`
			`<li>`
update links (again) 2022-04-22 22:42:27 +00:00			`<a href="/">Home</a>`
Initial commit 2022-04-22 21:34:50 +00:00			`</li>`
			`<li>`
update links 2022-04-22 22:39:36 +00:00			`<a href="./stoplight">Stoplight Schema</a>`
Initial commit 2022-04-22 21:34:50 +00:00			`</li>`
			`</ul>`
			`</nav>`
			`<hr>`
			`</header>`
			`<div id="content">`
			`<p>Managing routines is a very important part of me being able to function as a person. In trying to do this, there's one major problem I'd consistently come across.</p>`
			`<p>In every system I make to manage my routines, I would create it for one version of me. It would work best for my headspace and energy level at the time, and when that headspace would shift the system would fall apart.</p>`
			`<p>Enter, the Stoplight Schema...</p>`
			`<div class="example-img-container">`
updoot 2022-04-22 22:06:43 +00:00			`<img width="100%" src="./res/stoplight-habit-v2.png" alt="Habit Tracker with additional energy level indicators, and markers to associate tasks with energy levels.">`
Initial commit 2022-04-22 21:34:50 +00:00			`</div>`
			`<hr>`
			`<p>This may look like your standard habit tracker, but it has a few unique traits that help you get stuff done, no matter your energy level.</p>`
add black and white routine tracker 2022-11-06 05:30:28 +00:00			`<p>It does this by allowing you to:</p>`
Initial commit 2022-04-22 21:34:50 +00:00			`<ul>`
add black and white routine tracker 2022-11-06 05:30:28 +00:00			`<li>Keep your energy level in mind as best you can.</li>`
			`<li>Do only what is required with respect to your energy level.</li>`
Initial commit 2022-04-22 21:34:50 +00:00			`</ul>`
			`<p>Both of these things together help you avoid burnout while getting what's required done. Now, how does this work?</p>`
			`<hr>`
			`<svg width="24", height="32">`
			`<rect x="0", y="24", width="16", height="8", fill="#FC6467"></rect>`
			`<rect x="0", y="12", width="16", height="8", fill="#FFD483"></rect>`
			`<rect x="0", y="0", width="16", height="8", fill="#6E9277"></rect>`
			`</svg>`
			`<hr>`
add black and white routine tracker 2022-11-06 05:30:28 +00:00			`<p>These "stoplights" represent your energy level. Green being high-energy, yellow being mid-energy, and red being low-energy. You'll see these next to spots where you can write a task, and above each date.</p>`
Initial commit 2022-04-22 21:34:50 +00:00			`<p>Here's how you use it:</p>`
			`<ol>`
			`<li>Write each task on the list in the space provided.</li>`
			`<li>Mark the energy level associated with each task.`
			`<ul>`
add black and white routine tracker 2022-11-06 05:30:28 +00:00			`<li>Red items are tasks that must be done, like brushing your teeth or taking medicine.</li>`
			`<li>Yellow items are tasks that should be done, like showering or applying deodorant.</li>`
			`<li>Green items are tasks that can be done, like applying lotion or planning for tomorrow.</li>`
Initial commit 2022-04-22 21:34:50 +00:00			`</ul>`
			`</li>`
			`<li>Each day, mark your energy level when you start the routine (or day in the habit tracker version).</li>`
			`<ul>`
add black and white routine tracker 2022-11-06 05:30:28 +00:00			`<li>You are only required to do tasks labeled at or below the energy level you marked down.</li>`
Initial commit 2022-04-22 21:34:50 +00:00			`</ul>`
			`</ol>`
			`<hr>`
			`<p>This system has benefit me in allowing my routines to be as flexible as I require, and by allowing me to be kinder to myself for not getting everything done every day; especially cutting myself some slack on low-energy days.</p>`
			`<p>Feel free to take elements from this or modify it however you wish, hope you're able to find some benefit from it as well!</p>`
			`<hr>`
			`<div id="downloads">`
			`<h3>Downloads</h3>`
			`<div class="img-container">`
updoot 2022-04-22 22:06:43 +00:00			`<a href="./res/stoplight-habit-v2.pdf"><img class="dl-img" src="./res/stoplight-habit-v2.png" alt="stoplight schema habit tracker download"></a>`
Initial commit 2022-04-22 21:34:50 +00:00			`<figcaption>A basic habit tracker.</figcaption>`
			`</div>`
			`<div class="img-container">`
updoot 2022-04-22 22:06:43 +00:00			`<a href="./res/stoplight-routine-v2.pdf"><img class="dl-img" src="./res/stoplight-routine-v2.png" alt="stoplight schema routine tracker download"></a>`
Initial commit 2022-04-22 21:34:50 +00:00			`<figcaption>A routine tracker, allowing you to split up things a bit more.</figcaption>`
			`</div>`
			`<div class="img-container">`
updoot 2022-04-22 22:06:43 +00:00			`<a href="./res/stoplight-routine-weekly-v2.pdf"><img class="dl-img" src="./res/stoplight-routine-weekly-v2.png" alt="stoplight schema weekly routine tracker download"></a>`
add black and white routine tracker 2022-11-06 05:30:28 +00:00			`<figcaption>A weekly routine tracker, for routines done only once a week, like laundry.</figcaption>`
Initial commit 2022-04-22 21:34:50 +00:00			`</div>`
			`<div class="img-container">`
updoot 2022-04-22 22:06:43 +00:00			`<a href="./res/stoplight-key-v2.pdf"><img class="dl-img" src="./res/stoplight-key-v2.png" alt="stoplight schema key download"></a>`
Initial commit 2022-04-22 21:34:50 +00:00			`<figcaption>A printable key to help track any custom symbols you come up with.</figcaption>`
			`</div>`
add black and white routine tracker 2022-11-06 05:30:28 +00:00			`<div class="img-container">`
			`<a href="./res/stoplight-routine-v2-bw.pdf"><img class="dl-img" src="./res/stoplight-routine-v2-bw.png" alt="stoplight schema black and white routine tracker download"></a>`
			`<figcaption>A black and white version of the routine tracker, colorblind friendly. :)</figcaption>`
			`</div>`
Initial commit 2022-04-22 21:34:50 +00:00			`</div>`
			`</div>`
			`<footer>`
			`<hr>`
			`<p>ur gay <3</p>`
			`</footer>`
			`</div>`
			`</body>`
			`</html>`