2025-12-06 11:50:17 -08:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en"><head>
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
|
<title>Track the Tree</title>
|
|
|
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
|
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
|
|
|
|
|
<link href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700&family=Caveat:wght@500;600;700&display=swap" rel="stylesheet">
|
|
|
|
|
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet">
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
.font-lora { font-family: 'Lora', serif; }
|
|
|
|
|
.font-caveat { font-family: 'Caveat', cursive; }
|
|
|
|
|
</style>
|
|
|
|
|
<style>*, ::before, ::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/* ! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com */*,::after,::before{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}::after,::before{--tw-content:''}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offs
|
|
|
|
|
<body class="min-h-screen bg-stone-50 flex items-center justify-center p-8">
|
|
|
|
|
|
|
|
|
|
<!-- Postcard -->
|
|
|
|
|
<div style="/*! background-image: linear-gradient(to bottom, #fef3c7 0%, #fde68a 100%); */background-image: url('https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fstatic.vecteezy.com%2Fsystem%2Fresources%2Fpreviews%2F000%2F109%2F425%2Foriginal%2Ffree-vector-watercolor-paper-texture.jpg&f=1&nofb=1&ipt=53717b8b2fe88edf58d2444f60485e242278f887f37ddc3bf9726553dc7029a0');background-position: center;background-size: 600px;/*! transform: rotateZ(-0.6deg); */" class="max-w-xl w-full bg-amber-100 rounded-sm shadow-lg p-8 relative">
|
|
|
|
|
|
|
|
|
|
<!-- Postcard texture overlay -->
|
|
|
|
|
<div class="absolute inset-0 opacity-10 rounded-sm" style="/*! background-image: url('data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%224%22 height=%224%22><rect width=%224%22 height=%224%22 fill=%22%23000%22 fill-opacity=%220.03%22/><rect x=%220%22 y=%220%22 width=%222%22 height=%222%22 fill=%22%23000%22 fill-opacity=%220.02%22/></svg>'); */"></div>
|
|
|
|
|
|
|
|
|
|
<!-- Content -->
|
|
|
|
|
<div style="font-weight: 500;" class="relative font-lora text-gray-700 leading-relaxed">
|
|
|
|
|
|
|
|
|
|
<!-- Stanza 1 -->
|
|
|
|
|
<div class="mb-6">
|
|
|
|
|
<p class="text-lg">Scope creeps, Time leaps</p>
|
|
|
|
|
<p class="text-lg">Blockers land, Plans disband</p>
|
|
|
|
|
<p class="text-lg">Debt compounds, Progress drowns</p>
|
|
|
|
|
<p style="font-weight: 400;color: #000;font-weight: 600;" class="text-xl font-normal">Track the tree</p>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- Stanza 2 -->
|
|
|
|
|
<div class="mb-6" style="margin-bottom: 2rem;">
|
|
|
|
|
<p class="text-lg">Tasks split, Blockers hit</p>
|
|
|
|
|
<p class="text-lg">Backlog stacks, Focus cracks</p>
|
|
|
|
|
<p style="font-weight: 600;color: #000;" class="text-2xl">Track the tree</p>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- Stanza 3 -->
|
|
|
|
|
<div class="mb-6">
|
|
|
|
|
<p class="text-lg">Bugs breed, Timelines bleed</p>
|
|
|
|
|
<p style="font-weight: 500;/*! line-height: 3rem; */color: #000;" class="text-3xl font-semibold">Track the tree</p>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- Final refrain -->
|
|
|
|
|
<div class="mt-8" style="margin-top: 3rem;">
|
|
|
|
|
<p style="font-size: 3rem;font-weight: 500;" class="text-3xl font-semibold text-black">Track the tree</p>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- Little decorative element -->
|
|
|
|
|
<div class="mt-12 text-center">
|
2025-12-06 12:13:09 -08:00
|
|
|
<span class="font-caveat text-2xl">~ Karl ~</span>
|
2025-12-06 11:50:17 -08:00
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</body></html>
|
