<html>
  <head>
    <%- include("partials/_head") %>
    <link rel="icon" type="image/x-icon" href="/images/favicon.png"></link>

  </head>
  <body class="dark-theme github">
    <div class="fullscreen">
      <div class="background" style="background-image: url('https://bucket.umurcan.dev/images/background.webp');"></div>
      <div class="center-object">
        <div class="container">
          <section class="me unset">
            <div class="avatar-container">
              <!-- <img draggable="false" src="/images/antlers.png" class="image-antlers"> -->
              <img draggable="false" alt="profile picture" src="https://bucket.umurcan.dev/images/profile.png" class="image-title">
            </div>
            <div class="unset">
              <h1 class="title monospace">UÆRMAN</h1>
              <p class="undertitle monospace"><i class="emoji turkey"></i> I drink coffee.</p>
            </div>
          </section>
          <div class="buttons">
            <!-- <span class="btn sun-flower-dropshadow black-text animation hover" onclick="scroll_to('branding')">Branding</span> -->
            <a href="<%=process.env.DISCORD%>" class="btn discord-dropshadow black-text animation hover" target="_blank">Discord</a>
            <a href="<%=process.env.TWITTER%>" class="btn twitter-dropshadow black-text animation hover" target="_blank">Twitter</a>
            <a href="mailto:ermanumur@gmail.com" class="btn emerald-dropshadow black-text animation hover">Email</a>
            <a href="<%=process.env.GITHUB%>" class="btn github-dropshadow white-text animation hover" target="_blank">GitHub</a>
            <a href="<%=process.env.YOUTUBE%>" class="btn youtube-dropshadow white-text animation hover" target="_blank">YouTube</a>
          </div>
        </div>
      </div>

      <span class="info-button" onclick="scroll_to('information')"><div id="fade" class="arrow bounce">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 481.32 291.98" class="white-fill">
          <path d="M466.5,15.5L466,15c-19.8-19.8-52-19.8-71.9,0L240.8,168.3L87.2,14.8C67.4-5,35.2-5,15.4,14.8l-0.5,0.5 C-5,35.2-5,67.4,14.8,87.2l186.6,186.6c0.9,1,1.8,2,2.7,3v0c3.8,3.8,8.1,6.9,12.7,9.3c17,9,38.1,7.7,53.9-3.9 c2.2-1.6,4.4-3.4,6.4-5.4L466.5,87.4C486.4,67.6,486.4,35.4,466.5,15.5z"/>
        </svg>
      </div></span>
    </div>

    <section class="container" id="information">

      <div class="box-container">
        <h2 class="title emerald-text"><i class="emoji drink-juice"></i> Information:</h2>
        <div class="info-container"><p>
          Hello, my name is <span class="emerald-text">Umurcan Ali Erman</span>, but known as <span class="emerald-text">uærman</span> over the internet.
          I'm a back-end developer that spends time coding and drinking coffee. Coding is not just a job for me, coding is my <span class="emerald-text">hobby</span> and i'm always exciting for new coding <span class="gold-text">technologies</span>. 
          Been coding for around <span class="gold-text" id="years-of-coding">[THANK YOU ALEXFLIPNOTE]</span> now and still learning new technologies and try to improve my self.
          Current coding languages I learning <span class="gold-text">JavaScript, </span> <span class="belize-hole-text">TypeScript,</span> </span> <span class="green-sea-text">VueJS,</span> <span class="emerald-text">NodeJS, ExpressJS,</span>  <span class="spotify-text">MongoDB</span> and <span class="spotify-text">MySQL</span>.
        </p></div>
      </div>
      <div class="box-container">
        <h2 class="title emerald-text"><i class="emoji cookie"></i> Work:</h2>
        <div class="info-container">
        <% for (item of workData) { %>
          <p><a class="emerald-text bold" target="_blank"><%= item.company %></a> (<a class="linkedin-text italic"><%= item.position %></a>) - <a class="linkedin-text"><%= item.startDate %></a>/<a class="<%= item.endDate ? 'linkedin-text' : 'disco-ball-text italic' %>"><%= item.endDate || 'Present' %></a></p>
          <% } %> 

        </div>
      </div>
      <div class="box-container">
        <h2 class="title emerald-text"><i class="emoji uwu"></i> Projects:</h2>
        <div class="info-container">
        <% for (item of projData) { %>
          <p><a href="<%= item.url %>" target="_blank"><%= item.name %></a>, <%= item.desc %></p>
          <% } %> 

        </div>
      </div>

    </section>
    <%- include("partials/_footer")%>
  </body>
</html>
