@extends('layouts.app')

@section('titre', 'CV')

@section('h1', 'CV')

@section('contenu')

<style>
    .photo {
        position: relative;
        left: 0;
    }
    .texte {
        position: relative;
        left: 200px;
        top: -150px;
    }


    @media (min-width: 769px) or (orientation: Landscape)  {
        .parent {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(6, 1fr);
        grid-column-gap: 0px;
        grid-row-gap: 0px;
    }

    .div1comp { grid-area: 1 / 1 / 5 / 2; }
    .div2cent { grid-area: 5 / 1 / 7 / 2; }
    .div3prof { grid-area: 1 / 2 / 3 / 4; }
    .div4parc { grid-area: 3 / 2 / 5 / 4; }
    .div5form { grid-area: 5 / 2 / 7 / 4; }


    .div2cent {
        top: -115%;
    }
    .div4parc {
        top: -70%;
    }
    .div5form {
        top: -115%;
    }
    }

    @media (max-width: 768px) and (orientation: portrait) {
  .div1comp,
  .div2cent,
  .div3prof,
  .div4parc,
  .div5form {
    display: block;
    width: 95%;
    margin: 10px auto;
  }

  #nametext {
    position: absolute;
    left: -10px;
    top: 10px;
  }
}


    canvas {
      border: 1px solid rgb(255, 255, 255);
      pointer-events: none;
    }

    #myCanvas {
      position: absolute;
      top: -500;
      left: -200;
      z-index: 1;
    }
</style>

<canvas id="myCanvas"></canvas>
<script src={{ asset('assets/js/balle.js') }}></script>

    <h1 class="text-center">cv</h1>

    <div class="card m-3" style="height:170px;">
        <div class="photo">
            <img src={{ asset('assets/images/photomaton.png') }} alt="" width="150px">
        </div>
        <div class="texte" id="nametext">
            <h3>Cédric Poirier</h3>
            <p><b>Développeur web débutant Full Stack PHP</b></p>
            <p><b>Mail : </b><a href="mailto:lapoart@gmail.com">lapoart@gmail.com</a></p>
            <p>22810 Plougonver</p>
        </div>
    </div>
    <div class="parent">
        <div class="div1comp card m-3" style="height:40%;">
            <h3>Compétences</h3>
            <p>Compétences techniques : Je possède une solide formation en développement web et je suis capable de concevoir des sites web de A à Z en utilisant PHP et le framework Laravel. </p>
            <p> Frontend, j'ai acquis de bonnes compétences en Javascript et CSS, ce qui me permet de créer des interfaces intéractives et attrayantes. Je suis également à l'aise avec la gestion de base de données MySQL.</p>
            <p>Je suis apte à m'adapter efficacement pour répondre aux demandes des clients, résoudre les problèmes rencontrés et optimiser le code.</p>
        </div>
        <div class="div2cent card m-3">
            <h3>Centre d'intérêts</h3>
            <b>Comics</b>
            <p>Ex possesseur d'une collection de 1500 revues Marvel acquises entre 1983 et 2000.</p>
            <i>Scott Summer vous a à l'oeil.</i>
            <h3>Domotique</h3>
            <p>Utilisation de Home Assistant et d'ESP8266. Assistants vocaux, gestion des lumières et du chauffage.</p>
            <p>Grace à divers capteurs, modules et thermostats, j'ai une gestion optimisé du chauffage de la maison, via le controle de la pompe à chaleur, de la température de l'eau qui change en fonction des besoins et de la température extérieur.</p>
            <p>Le langage utilisé pour l'ESP est l'arduino (proche de C++) et pour Home Assistant, c'est le YAML.</p>
            <h3>Bricolage</h3>
            <p>Mécanique voiture et moto, menuiserie, électricité, plomberie.</p>
            <h3>Jardinage</h3>
            <p>Tout aussi reposant et satisfaisant pour l'esprit et agréable pour les papilles. </p>


        </div>
        <div class="div3prof card m-3" style="height:28%;">
            <h3>Profil Professionnel</h3>
            <p>Passionné et doté d'une grande appétence, je sais faire preuve d'autonomie, de créativité et d'inventivité. Face à l'adversité, je suis capable de mettre de côté mon obstination pour demander de l'aide. Mon leadership, ma réactivité, et ma capacité à m'adapter aux changements me permettent de faire face aux situations de manière efficace. Je sais également gérer le stress. Ma ponctualité et mon sens de l'organisation sont des atouts essentiels dans mon approche professionnelle.</p>
        </div>
        <div class="div4parc card m-3" style="height:50%;">
            <h3>Parcours Professionnel</h3>
            <p>Actuellement : création de sites web en freelance</p>
            <li><a href="www.lvrpoirier.fr" target="_blank">www.lvrpoirier.fr</a></li>
            <li><a href="www.perlesetpelotes.cpri.fr" target="_blank">www.perlesetpelotes.cpri.fr</a></li>
            <li><a href="www.edfeconomix.cpri.fr" target="_blank">www.edfeconomix.cpri.fr</a></li>
            <br>
            <p>Espace Aubade de 2006 à 2021 - Sète (34): livreur, magasinier, vendeur comptoir et enfin responsable magasin.</p>
            <p>Transmanudem - Lansargues (34): livreur, déménageur.</p>
            <p>RDTA - Charleville-Mézière (08): entretien et conduite d'autocars.</p>
            <p>IMED - Perpignan (66) : intervenant informatique.</p>
            <p>Divers emplois dans l'agriculture et entretien des espaces vert à Prades (66).</p>
        </div>
        <div class="div5form card m-3">
            <h3>Formations</h3>
            <p>Formation en IT au <b>Soft Collège de Callac</b> de mai 2022 a octobre 2022.</p>
            <p>Langages de programmations :</p>
            <li>C</li>
            <li>Java</li>
            <li>MySQL</li>
            <li>HTML</li>
            <li>CSS</li>
            <li>Javascript</li>
            <li>PHP</li>
            <li>React Nativ</li>
            <br>
            <b>Greta de Perpignan 2000</b>
            <p>Infographiste - web designer</p>
            <p>photoshop, illustrator, indesign, dreamweaver</p>
            <br>
            <b>Autres formations :</b>
            <li>CAP transport de marchandises</li>
            <li>CAP conducteur de personnes</li>
            <li>BAC Comptabilité</li>
            <br>
            <b>Permis :</b>
            <li>A</li>
            <li>B</li>
            <li>C</li>
            <li>D</li>
            <li>E</li>
        </div>
    </div>

@endsection