index.html

---
layout: default
title: Alex Oliveira
description: Software developer and UI designer with a passion for photography based in Lisbon, Portugal
colorscheme: main
background: trees2
selectednav: about
scriptfile: about
#navbackground: ""
---
<div class="full">
    <div class="container full">
        <div class="card elevated" id="about_card">
            <div id="about_part">
                <img id='face' class='elevated' src='res/avatar2.jpg'/>
                <div class='card-child card_title colored'>
                    Hey there! I'm Alex
                </div>
                <div id='about'>
                    <div class='card-child about-item'>
                        <img class='icon tinted' alt="Born in" src="res/icon/calendar.svg" /> Mar/1996 (20)
                    </div>
                    <div class='card-child about-item'>
                        <img class='icon tinted' alt="I am a" src="res/icon/worker.svg" /> Software Developer
                    </div>
                    <div class='card-child about-item'>
                        <img class='icon tinted' alt="Studyed at" src="res/icon/school.svg" /> Faculty of Science ULisboa
                    </div>
                    <div class='card-child about-item'>
                        <img class='icon tinted' src="res/icon/map-marker.svg" title='I live' alt='location' /> Lisbon, Portugal
                    </div>
                </div>
                <div class="button_row">
                    <button class='flat' onclick="onSkillsButtonClick()">Skills</button>
                    <button class='right raised' onclick="location.href='{{ site.baseurl }}/contact'">Contact</button>
                </div>
            </div>
            <div id="skills_part" class="hidden">
                <div class="card_title left colored_bg" id="skills_title_bar">
                    <img src="res/icon/close.svg" alt="back to about" class="icon dry button" onclick="backToAboutCardFromSkills()"/>
                    Skills
                </div>
                <div class="card_title left colored_bg hidden" id="skills_back_to_all">
                    <img src="res/icon/back.svg" alt="back to all skils"
                    class="icon dry button" onclick="backToAllSkills()"/>
                </div>
                <div id="skills_container">
                    {% for skill in site.data.skills %}
                    <div class="skill-wrapper grid-item" id="{{skill.name}}" onclick="showSkillDetails('{{skill.name}}')">
                        <i class="devicon-{{skill.name | downcase}}-plain{%if skill.nowordmark%}{%else%}-wordmark{%endif%} colored skill-icon" title="{{skill.name}}"></i>
                        <div class="hidden skill-rating" id="rating_{{skill.name}}">
                            <script>populateRating('{{skill.name}}', '{{skill.rating}}')</script>
                        </div>
                        {%if skill.projects%}
                        <!-- Has projects... -->
                        {%endif%}
                        {% if skill.description%}
                        <div class="hidden skill-description" id="description_{{skill.name}}">
                            {{skill.description}}
                        </div>
                        {%endif%}
                        <noscript>
                             {{skill.name}}: {{skill.rating}}/5
                        </noscript>
                    </div>
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
</div>