index.html

{% extends 'base.html' %}

{% block styles %}
<link rel="stylesheet" href="{% static 'styles/app.scss' %}">
{% endblock styles %}

{% block scripts %}
{% script 'app' %}
<script src="https://cdn.jsdelivr.net/npm/masonry-layout@4.2.2/dist/masonry.pkgd.min.js" integrity="sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D" crossorigin="anonymous" async></script>

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
{% endblock scripts %}

{% block content %}
<article>
  <header class="container" style="margin-bottom:0px;">
    <h1 style="margin-bottom:0px;">aida ylanan</h1>
    <p class="center">visual information specialist @ cdc</p>
  </header>  

  <div class="container" style="margin-bottom:0px;">
    <h2 id="work" style="margin-top:0px;">portfolio</h2>
    <p class="center" style="font-size:12px; font-style:italic;margin-bottom:0px;">compiled work from the los angeles times</p>
    <div id="module" class="container" style="margin-top:0px;">
    <div class="collapse" id="collapseExample" aria-expanded="false">
              <div class="row grid" data-masonry='{"percentPosition": true }'>
                {% for obj in stories %}
                  {% if obj.type == "dev" %}
                  <div class="card">
                  {% if obj.img %}<a class='outlink' href="{{ obj.url }}"><img src="{% static 'assets/images/' + obj.img %}" class="card-img-top" alt="{{ obj.desc }}"></a>{% endif %}
                  <div class="card-body">
                    <h5 class="card-title">
                      <a class='outlink' href="{{ obj.url }}">{{ obj.hed }}</a>
                    </h5>
                  </div>
                  <div class="card-body">
                    {% if obj.role %}<div class="small"><b>role</b> {{ obj.role }}</div>{% endif %}
                    {% if obj.tools %}<div class="small"><b>tools</b> {{ obj.tools }}</div>{% endif %}
                    {% if obj.related %}<div class="small"><b>related</b>{{ obj.related }}</div>{% endif %}
                    {% if obj.awards %}<div class="small"><b>recognition</b> {{ obj.awards }}</div>{% endif %}
                  </div>
                </div>
                {% endif %}
              {% endfor %}
              </div>
  </div>
  <div class="button-container">
    <a role="button" class="collapsed" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
    </a>
  </div>
  </div>
    
    <h3>selected writing</h3>
      {% for obj in stories %}
        {% if obj.type == "writing" %}
        <p><a href="{{ obj.url }}">{{ obj.hed }}</a> <span class="small">{% if obj.otherpub %}({{ obj.otherpub }}){% endif %}<br> </span>
        {% if obj.related %}<span class="small">↳ <b>related</b> {{ obj.related }}</span>{% endif %}</p>
        {% endif %}
      {% endfor %}  
    <h3>talks</h3>
    <div class="talks">
      {% for obj in talks %}
      <p>
        <b>{{ obj.date }}</b> <a href="{{ obj.url }}">{{ obj.talk }}</a> / {{ obj.host }}
      </p>
      {% endfor %}
    </div>
    <h3>previous roles</h3>
    <div class="talks">
      {% for obj in roles %}
      <p>
        <b>{{ obj.date }}</b> {{ obj.talk }} / <a href="{{ obj.url }}">{{ obj.host }}</a>
      </p>
      {% endfor %}
    </div>
    <h2 id="about">about</h2>
      <div class="row">
        <div class="column left">
          <img src="{% static 'assets/images/profile.jpg' %}" alt="Photo of Aida" width=125 />
        </div>
        <div class="column right">
          <p>Hi, I'm a visual information specialist at the Centers for Disease Control and Prevention. I grew up in Long Beach, CA, and graduated from UCLA, where I studied statistics and English. When I'm not working, I like visiting museums, reading books, and traveling.</p>
        </div>
      </div>
    <h2 id="contact">contact</h2>
    <div>
      <p class="center">
        <a href="https://github.com/aidaylanan/">github</a> /
        <a href="https://www.linkedin.com/in/a1daylanan?original_referer=">linkedin</a><br>
        <span class="small">✉️ ylanan.aida [at] gmail [dot] com </span><br>
        <span class="small">résumé available upon request </span>
      </p>
    </div>
    <div class="footnote">
      <p class="smaller">updated june 2024</p>
    </div>
  </div>
</article>
{% endblock content %}