<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="icon" href="images/logo.ico" type="image/x-icon" />
    <link rel="stylesheet" href="css/style.css" />
    <title>The Unconcerned Ape</title>
  </head>
  <body>
    <div id="header">
      <img src="images/other-logo.png" alt="My Logo" />
      <div id="nav">
        <a href="https://blog.theunconcernedape.me" target="_blank"> blog <span>&middot;</span> </a>
        <a href="/contact"> contact <span>&middot;</span> </a>
        <a href="/projects"> projects <span>&middot;</span> </a>
        <a href="/resume"> resume </a>
      </div>
    </div>
    <div id="content">
      <p>
        <span class="title">Hi, I'm Sai Vishnu // The Unconcerned Ape</span>
        <br />
        <span class="smaller mono">Just a tech</span> <br />
        Just a lost grain of sand from the beaches that were left behind. <br />

        I'm a <%= current_age %> yo guy <%= status %>
      </p>
      <br />
      <p>
        Here are few phrases/sentences that I randomly threw together <br />
        <span class="bold smallest">
          (Click on the <span class="sub-keywords">title</span> for the looong
          boring texts)
        </span>
      </p>
      <ul class="smaller">
        <!-- computers -->
        <li onclick="revealText('computers')">
          <span class="bullets">1.</span> Why Computers?
          <span class="keyword"> // </span> Best Man-Made Thing Ever
          <div class="visually-hidden box" id="computers">
            I've been interested in
            <span class="keyword">computers</span> since I was a 15 year old
            kid. It all started when I got curious on why
            <span class="sub-keywords">int</span> can't store any value above
            <span class="sub-keywords">2147483647</span>. I was fascinated by
            the fact that a computer is very structured and everything that it
            does has a well thought out reason behind it.
            <span class="mono smaller">(I'm a nerd!)</span>
          </div>
        </li>

        <!-- linux -->
        <li onclick="revealText('linux')">
          <span class="bullets">2.</span> Why I use Linux?
          <span class="keyword"> // </span> The Love of my Life
          <div class="visually-hidden box" id="linux">
            I love
            <span class="keyword">Linux</span>.
            <span class="bold smallest">
              (GNU/Linux, or as I've recently taken to calling it, GNU plus
              Linux.)
            </span>
            I love the fact that it's open and I can customise it to my liking.
            The mere fact that I have some control on what my computer can do /
            does. I initially got into it mostly because I hated Windows 10.
            This is probably one of the best decisions I've ever made and I
            don't regret it a bit.
            <span class="mono smaller">(I use Arch btw!)</span>
          </div>
        </li>

        <!-- why web dev lately -->
        <li onclick="revealText('web-dev')">
          <span class="bullets">3.</span> Why Am I learning Web Dev lately?
          <span class="keyword"> // </span>
          Current Shizz
          <div class="visually-hidden box" id="web-dev">
            I've been doing a lot of
            <span class="keyword">web dev</span> stuff lately. I think it's
            because I've been kinda demotivated lately and saw some quick
            timepass with web dev. I'm not sure if I'll stick with it though.
            Don't get me wrong. This is a very interesting field and I'm
            learning a lot of new stuff. But it's just not what I am aiming for
            my future to be
            <span class="bold smallest">
              (mostly because I suck at UI/UX big time).
            </span>
            I'm still trying to figure out what I want to do with my life.
            <span class="mono smaller">
              (I liked Express, EJS and would like to know more about AWS!)
            </span>
          </div>
        </li>

        <!-- want to learn/dream of a future in -->
        <li onclick="revealText('future')">
          <span class="bullets">4.</span> What is my aim for the future?
          <span class="keyword"> // </span> What Next?
          <div class="visually-hidden box" id="future">
            I have tinkered around in a lot of things/tools for the past few
            years and from what I've observed, I've come to this conclusion that
            my heart lies in
            <span class="keyword">low level programming</span>. I really love
            how it is implemented. I've been trying to learn something related
            to it for a while but never got my way around it but it is true that
            every time I think of what my
            <span class="keyword">future role</span> should be, it always ends
            up being something Systems related and specifically Linux or low
            level management. <br />
            <span class="mono smaller">
              I'm still trying to figure out how to achieve this goal of mine.
              <span class="bold smallest">
                (Any suggestions or motivations is welcomed)
              </span>
            </span>
          </div>
        </li>

        <!-- what I do in my free time -->
        <li onclick="revealText('free-time')">
          <span class="bullets">5.</span> What do i do in my free time?
          <span class="keyword"> // </span>
          Hobbies
          <div class="visually-hidden box" id="free-time">
            I like to spend my
            <span class="keyword">free time</span>
            <span class="sub-keywords"> reading books </span> or
            <span class="sub-keywords"> watching Movies </span> <br />
            <!-- Books -->
            My favorite books are:
            <ul class="border">
              <li>
                <span class="italic underline">They Both Die At The End </span>
                <span class="smaller bold">- Adam Silvera</span>
                <div class="quote">
                  To live is the rarest thing in the world. Most people exist,
                  that's all.
                </div>
              </li>
              <li>
                <span class="italic underline">A Walk To Remember</span>
                <span class="smaller bold">- Nicholas Sparks</span>
                <div class="quote">
                  I don't think that we're meant to understand it all the time.
                  I think that sometimes we just have to have faith.
                </div>
              </li>
              <li>
                <span class="italic underline">The Fault In Our Stars</span>
                <span class="smaller bold">- John Green</span>
                <div class="quote">
                  What a slut time is. She screws everyone.
                </div>
              </li>
              <li>
                <span class="italic underline">
                  Aristotle and Dante Discover the Secrets of the Universe
                </span>
                <br />
                <span class="smaller bold">- Simon & Schuster</span>
                <div class="quote">
                  And it seemed to me that Dante's face was a man of the world.
                  A world without any darkness. <br />
                  Wow, a world without darkness. How beautiful was that?
                </div>
              </li>
              <li>
                <span class="italic underline">Digital Fortress</span>
                <span class="smaller bold">- Dan Brown</span>
                <div class="quote">
                  Everything is possible. The impossible just takes longer.
                </div>
              </li>
            </ul>
            <!-- Movies -->
            My favorite Movies/Shows are:
            <ul class="border">
              <li>
                <span class="italic underline">Fault in our Stars </span>
                <span class="smaller bold">- Josh Boone</span>
                <div class="quote">
                  It's a metaphor: see, You put the killing thing right between
                  your teeth, but you don't give it the power to do its killing.
                </div>
              </li>
              <li>
                <span class="italic underline">Fight Club</span>
                <span class="smaller bold">- David Fincher</span>
                <div class="quote">
                  It's only after you've lost everything that you are free to do
                  anything.
                </div>
              </li>
              <li>
                <span class="italic underline">Interstellar</span>
                <span class="smaller bold">- Christopher Nolan</span>
                <div class="quote">
                  Murphy's Law: What it means is that whatever can happen will
                  happen.
                </div>
              </li>
              <li>
                <span class="italic underline"> Top Gun: Maverick </span>
                <span class="smaller bold">- Joseph Krasinski</span>
                <div class="quote">
                  You don't have time to think up there. If you think, you're
                  dead.
                </div>
              </li>

              <li>
                <span class="italic underline"> The Office (US) </span>
                <span class="smaller bold"> - Steve Carell </span>
                <div class="quote">
                  I Knew Exactly What To Do but in a much more real sense, I had
                  no idea what to do.
                </div>
              </li>
            </ul>
          </div>
        </li>
      </ul>
      <!-- projects -->
      <p class="title">Projects // Lame ahh things I've done</p>
      <% projects.forEach(function(p) { %>
      <div class="box-container">
        <div class="box">
          <h2><%= p.name %></h2>
          <img
            src="images/projects/<%= p.image %>"
            alt="<%= p.name %>'s image"
            class="project-img"
          />
          <p class="description"><%= p.description %></p>
          <a href="/projects/<%= p.readMoreLink %>" class="read-more">
            read more about this project...
          </a>
        </div>
        <% }); %>
        <a href="/projects" class="read-more"> see all projects... </a>
      </div>
      <!-- end of projects -->
      <hr />
      <!-- blogs -->
      <p class="title">Blogs // Some boring stuff that I've written</p>
      <% blogs.forEach(function(b) { %>
      <div class="box-container">
        <div class="box">
          <h3><%= b.title %></h3>
          <p class="description"><%= b.description %></p>
          <a href="<%= b.link %>" class="read-more">
            read the thing (beware of boredom) ...
          </a>
        </div>
        <% }); %>
        <a href="<%= blog_link %>"  target="_blank"class="read-more"> see all blogs... </a>
      </div>
      <!-- end of blogs -->
      <hr />
      <!-- social media/ email links -->
      <p class="title" id="socials">Socials // Where I waste my time</p>
      <%- include('common/socials') %>
      <p>
        I spend most of my time on
        <span class="sub-keywords">Instagram</span> and
        <span class="sub-keywords">Discord</span>. <br />
        However, you will find me replying to your
        <span class="underline">Email</span> faster than any of my other
        socials.
      </p>
      <!-- end of social media/ email links -->
      <!-- end of contents -->
    </div>
    <!-- footer -->
    <%- include('common/footer') %>
    <script src="js/home.js"></script>
  </body>
</html>
