{% extends "base.html" %}

{% block head %}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename = 'css/home.css') }}">
{% endblock %}

{% block body %}
<div class="desktop-view">
    <div class="container">
        <div class="wrapper">
            <div class="wrapper-center">
                <div class="owl-logo">
                    <img style="width: 30%; height: 30%;" src="static/images/seekingowl.png">
                </div>
            </div>
        </div>
        <div class="wrapper">
            <div class="top-text">
                <p class="text-title">Rositsa</p>
                <p class="text-title">Ivanova</p>
                <div class="social-icons">
                    <a target="_blank" href="https://github.com/therosko">
                        <img class="title-logo" src="static/images/github.svg">
                    </a>
                    <a target="_blank" href="https://www.linkedin.com/in/roivanova/">
                        <img class="title-logo" src="static/images/linkedin-logo.svg">
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="mobile-view">
    <div class="container">
        <div class="row justify-content-center bottom-buffer">
            <img style="width: 150px" src="static/images/seekingowl.png">
        </div>
        <div class="row justify-content-center bottom-buffer">
            <p class="top-text text-title">Rositsa Ivanova</p>
        </div>
        <div class="row justify-content-center bottom-buffer">
            <div class="social-icons">
                <a target="_blank" href="https://github.com/therosko">
                    <img class="title-logo" src="static/images/github.svg">
                </a>
                <a target="_blank" href="https://www.linkedin.com/in/roivanova/">
                    <img class="title-logo" src="static/images/linkedin-logo.svg">
                </a>
            </div>
        </div>
    </div>
</div>

{% endblock %}