% import random
% rebase('frame.tpl')
    <div class="content-grid">
<h1>website to-do </h1>
    <p>It'd be cool to add a few more things... <br></p>
    <br>
<h2>general </h2>
<ul>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; site map </li>
</ul>
<h2>play page </h2>
<ul>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; link to previous demos </li>
</ul>
<h2>about page </h2>
<ul>    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; some cute presentation of links. maybe nice promo art with table of contents over a long page. click on what you want or scroll around. I had one of those old myspace css boxes with links, but I can't imagine that working on mobile, etc. </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; artwork: 6 panels of Helia with each job </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; screenshots and diagrams of skills, skill library, skillbar </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; screenshots and diagrams of team window, team member editing window </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; slideshow, 3-panel comic, etc of gist of the story with a sentence or two describing each part. </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; cute character section with image links - panels, animated sprites, something
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; info section - genre, list platforms, engine, dev. link to presskit, credits, game design document. </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; timeline/roadmap - list all the beats. link to milestones. </li>
</ul>
<h2>dev page </h2>
<ul>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; make it like Barbie's old room on her website - hover over stuff, it animates, opens up new window or takes you to new page. </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; add picture links for GitLab, itch, Twitter, Discord, Bible verse, OCs, artwork, etc. </li>
</ul>
<h2>toolbox </h2>
<ul>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; <a href="https://cssgrid-generator.netlify.app/">CSS Grid Generator</a> for easy CSS grid design and coding </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; <a href="https://validator.w3.org/nu/">Nu Html Checker</a> for HTML checking </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; <a href="https://jigsaw.w3.org/css-validator/">W3C CSS Validation Service</a> for CSS checking </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; <a href="https://caniuse.com/">caniuse</a> for checking browser compatibility </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; <a href="https://webaim.org/resources/contrastchecker/">WebAIM contrast checker</a> for font/background contrast colors </li>
    <li class="latest">{{random.choice(['.','•','☆','★'])}}&#9; <a href="https://www.fontsquirrel.com/tools/webfont-generator">Font Squirrel Webfont Generator</a> for creating @font-face kits </li>

</ul>
    </div>