Content.
This commit is contained in:
aminecmi
Vendored
+251
-296
@@ -1,10 +1,10 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<title>devfolio</title>
|
||||
<title>Amine Bouabdallaoui</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" href="favicon.png" type="image/x-icon">
|
||||
<link rel="icon" href="favicon.ico" type="image/x-icon">
|
||||
<meta charset="UTF-8">
|
||||
<link rel="stylesheet" href="css/main.bundle.css">
|
||||
<script src="https://kit.fontawesome.com/4e5a72c756.js"></script>
|
||||
</head>
|
||||
@@ -13,28 +13,18 @@
|
||||
<nav class="navbar is-primary" role="navigation" aria-label="main navigation">
|
||||
<div class="navbar-brand">
|
||||
<div class="navbar-item is-hidden-desktop">
|
||||
<a href="https://github.com/mmacneil" class="icon is-large has-text-light">
|
||||
<a href="https://github.com/aminecmi" class="icon is-large has-text-light">
|
||||
<i class="fab fa-2x fa-github"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-item is-hidden-desktop">
|
||||
<a href="https://fullstackmark.com" class="icon is-large has-text-light">
|
||||
<i class="fas fa-2x fa-globe"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="navbar-menu">
|
||||
<div class="navbar-end">
|
||||
<div class="navbar-item">
|
||||
<a href="https://github.com/mmacneil" class="icon is-large has-text-light">
|
||||
<a href="https://github.com/aminecmi" class="icon is-large has-text-light">
|
||||
<i class="fab fa-2x fa-github"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-item">
|
||||
<a href="https://fullstackmark.com" class="icon is-large has-text-light">
|
||||
<i class="fas fa-2x fa-globe"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
@@ -52,10 +42,10 @@
|
||||
<div class="columns has-text-centered">
|
||||
<div class="column">
|
||||
<h1 class="title is-1">
|
||||
Mark Macneil
|
||||
Amine Bouabdallaoui
|
||||
</h1>
|
||||
<h2 class="subtitle">
|
||||
FullStack .NET Dev, Halifax, NS
|
||||
Développeur Java, JS, Kotlin/Android FullStack, avec une pointe de DevOps
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
@@ -65,36 +55,43 @@
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<h1 class="title">About Me</h1>
|
||||
<h1 class="title">Je suis passionné par l'informatique</h1>
|
||||
<hr />
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
|
||||
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
|
||||
pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est
|
||||
laborum.</p>
|
||||
<p>
|
||||
Je fais du Java/Scala pour le back, Angular et un peu de React pour le front, avec un brin de Cordova, au boulot.
|
||||
</p>
|
||||
<p>
|
||||
Chez moi, je m'amuse à développer des apps android en Kotlin (toutes open-source sur Github)
|
||||
</p>
|
||||
<p>
|
||||
Je m'amuse aussi à héberger le maximum des services que j'utilise sur mon serveur perso.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<h1 class="title">Experience</h1>
|
||||
<h1 class="title">Expériences professionnelles</h1>
|
||||
<hr />
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<figure class="image is-48x48">
|
||||
<img src="img/dunder-mifflin-logo.png" alt="Placeholder image">
|
||||
<figure class="image is-64x64">
|
||||
<img src="img/wecook-logo.svg" alt="Wecook">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="media-content">
|
||||
<p class="title is-4">Company Name</p>
|
||||
<p class="subtitle is-6">Title - <time datetime="2018-1">January 2018</time> - <time
|
||||
datetime="2019-9">Sepemter 2019</time> </p>
|
||||
<p class="title is-4">WeCook We Care (By Alantaya)</p>
|
||||
<p class="subtitle is-6">Développeur FullStack - <time datetime="2013-9">Février 2017</time> - <time
|
||||
datetime="now">Aujourd'hui</time> </p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
||||
Phasellus nec iaculis mauris.
|
||||
<ul>
|
||||
<li>Développement de microservices utilisant Spring, Neo4J et Kafka.</li>
|
||||
<li>Développement Front utilisant Angular 5 et NodeJS.</li>
|
||||
<li>Développement mobile avec Cordova.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -102,19 +99,68 @@
|
||||
<div class="card-content">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<figure class="image is-48x48">
|
||||
<img src="img/pied-piper-logo.png" alt="Placeholder image">
|
||||
<figure class="image is-64x64">
|
||||
<img src="img/wecook-logo.svg" alt="Wecook">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="media-content">
|
||||
<p class="title is-4">Company Name</p>
|
||||
<p class="subtitle is-6">Title - <time datetime="2018-1">August 2017</time> - <time
|
||||
datetime="2017-9">January 2018</time></p>
|
||||
<p class="title is-4">WeCook (By Kiwings)</p>
|
||||
<p class="subtitle is-6">Développeur Web, Mobile, Backend - <time datetime="2013-9">Septembre 2013</time> - <time
|
||||
datetime="2017-2">Février 2017</time> </p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
||||
Phasellus nec iaculis mauris.
|
||||
<ul>
|
||||
<li>Développement back en Scala et utilisation de PlayFramework</li>
|
||||
<li>Développement Front avec AngularJs, ScalaJS, ScalaReact, ScalaCSS.</li>
|
||||
<li>Développement Mobile avec SteroidsJs, Ionic et AngularJs</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card card-gap">
|
||||
<div class="card-content">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<figure class="image is-64x64">
|
||||
<img src="img/cityzen-logo.jpg" alt="CityzenCar">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="media-content">
|
||||
<p class="title is-4">CityzenCar</p>
|
||||
<p class="subtitle is-6">Développeur Web - <time datetime="2012-8">Aout 2012</time> - <time
|
||||
datetime="2017-9">Aout 2013</time></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<ul>
|
||||
<li>Développements sur divers projets de la start-up</li>
|
||||
<li>Installation et configuration de plusieurs serveurs</li>
|
||||
<li>Utilisation de diverses API tel que API Cloud OVH, et IDN La Poste</li>
|
||||
<li>Intégration d'un moteur d'indexation et de recherche Elasticsearch</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card card-gap">
|
||||
<div class="card-content">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<figure class="image is-64x64">
|
||||
<img src="img/nextformation-logo.png" alt="NextFormation">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="media-content">
|
||||
<p class="title is-4">NextFormation</p>
|
||||
<p class="subtitle is-6">Développeur Web - <time datetime="2011-4">Avril 2011</time> - <time
|
||||
datetime="2011-6">Juin 2011</time></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<ul>
|
||||
<li>Développement Web : PHP, HTML, CSS, JavaScript, AJAX, Zend</li>
|
||||
<li>Développement d'une plate-forme d'apprentissage pour l'entreprise</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -123,33 +169,54 @@
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<h1 class="title">Projects</h1>
|
||||
<h1 class="title">Compétences</h1>
|
||||
<hr />
|
||||
<div class="tile is-ancestor">
|
||||
<div class="tile is-vertical is-12">
|
||||
<div class="tile">
|
||||
<div class="tile is-parent is-vertical">
|
||||
<div class="tile is-parent">
|
||||
<article class="tile is-child notification">
|
||||
<p class="title">Project title</p>
|
||||
<figure class="image is-4by3">
|
||||
<img class="modal-trigger" data-target="project-1-modal" src="img/project-1-cover.png">
|
||||
</figure>
|
||||
<p class="title">Langages de programmation</p>
|
||||
<p class="content">
|
||||
<ul>
|
||||
<li>Kotlin</li>
|
||||
<li>Java</li>
|
||||
<li>Javascript</li>
|
||||
<li>Typescript</li>
|
||||
<li>ECMAScript 6</li>
|
||||
<li>Scala</li>
|
||||
<li>PHP</li>
|
||||
<li>Bash</li>
|
||||
</ul>
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
<div class="tile is-parent">
|
||||
<article class="tile is-child notification">
|
||||
<p class="title">Project title</p>
|
||||
<figure class="image is-4by3">
|
||||
<img class="modal-trigger" data-target="project-2-modal" src="img/project-2-cover.png">
|
||||
</figure>
|
||||
<p class="title">Front</p>
|
||||
<p class="content">
|
||||
<ul>
|
||||
<li>Angular 1.5 et >= 2</li>
|
||||
<li>Bootstrap</li>
|
||||
<li>Bulma</li>
|
||||
<li>React (ScalaReact)</li>
|
||||
<li>MeteorJs</li>
|
||||
</ul>
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
<div class="tile is-parent">
|
||||
<article class="tile is-child notification">
|
||||
<p class="title">Project title</p>
|
||||
<figure class="image is-4by3">
|
||||
<img class="modal-trigger" data-target="project-3-modal" src="img/project-3-cover.png">
|
||||
</figure>
|
||||
<p class="title">Mobile</p>
|
||||
<p class="content">
|
||||
<ul>
|
||||
<li>Java</li>
|
||||
<li>Kotlin</li>
|
||||
<li>PhoneGap/Cordova</li>
|
||||
<li>SteroidsJS</li>
|
||||
<li>Ionic</li>
|
||||
</ul>
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
@@ -158,28 +225,47 @@
|
||||
<div class="tile is-ancestor">
|
||||
<div class="tile is-vertical is-12">
|
||||
<div class="tile">
|
||||
<div class="tile is-parent is-vertical">
|
||||
<div class="tile is-parent">
|
||||
<article class="tile is-child notification">
|
||||
<p class="title">Project title</p>
|
||||
<figure class="image is-4by3">
|
||||
<img class="modal-trigger" data-target="project-4-modal" src="img/project-4-cover.png">
|
||||
</figure>
|
||||
<p class="title">Back</p>
|
||||
<p class="content">
|
||||
<ul>
|
||||
<li>Spring 4 (Core, MVC, Data, Security, AOP)</li>
|
||||
<li>Hibernate</li>
|
||||
<li>Kafka</li>
|
||||
<li>Stack ELK</li>
|
||||
<li>Nginx</li>
|
||||
<li>Apache server</li>
|
||||
</ul>
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
<div class="tile is-parent">
|
||||
<article class="tile is-child notification">
|
||||
<p class="title">Project title</p>
|
||||
<figure class="image is-4by3">
|
||||
<img class="modal-trigger" data-target="project-5-modal" src="img/project-5-cover.png">
|
||||
</figure>
|
||||
<p class="title">BDD</p>
|
||||
<p class="content">
|
||||
<ul>
|
||||
<li>MySQL</li>
|
||||
<li>Postgresql</li>
|
||||
<li>Neo4J</li>
|
||||
<li>Elasticsearch</li>
|
||||
<li>MongoDB</li>
|
||||
<li>Room</li>
|
||||
</ul>
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
<div class="tile is-parent">
|
||||
<article class="tile is-child notification">
|
||||
<p class="title">Project title</p>
|
||||
<figure class="image is-4by3">
|
||||
<img class="modal-trigger" data-target="project-6-modal" src="img/project-6-cover.png">
|
||||
</figure>
|
||||
<p class="title">OPS</p>
|
||||
<p class="content">
|
||||
<ul>
|
||||
<li>Administration de serveurs Ubuntu, Redhat et FreeBSD</li>
|
||||
<li>Gitlab / GitlabCI</li>
|
||||
<li>Jenkins</li>
|
||||
<li>Docker</li>
|
||||
</ul>
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
@@ -190,39 +276,109 @@
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<h1 class="title">Education / Training</h1>
|
||||
<h1 class="title">Centres d'intérêt</h1>
|
||||
<hr />
|
||||
<div class="tile is-ancestor">
|
||||
<div class="tile is-vertical is-12">
|
||||
<div class="tile">
|
||||
<div class="tile is-parent is-vertical">
|
||||
<article class="tile is-child notification">
|
||||
<p class="title">Langues</p>
|
||||
<p class="content">
|
||||
<ul>
|
||||
<li>Français : langue parentale</li>
|
||||
<li>Arabe : langue parentale</li>
|
||||
<li>Anglais : courant (970 TOEIC)</li>
|
||||
</ul>
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
<div class="tile is-parent is-vertical">
|
||||
<article class="tile is-child notification">
|
||||
<p class="title">Musique</p>
|
||||
<p class="content">
|
||||
<ul>
|
||||
<li>Guitare</li>
|
||||
<li>Piano</li>
|
||||
<li>Chorale</li>
|
||||
</ul>
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
<div class="tile is-parent is-vertical">
|
||||
<article class="tile is-child notification">
|
||||
<p class="title">Médias</p>
|
||||
<p class="content">
|
||||
<ul>
|
||||
<li>Films (Her, Predestination)</li>
|
||||
<li>Séries (Black Mirror, Orphan Black, The OA)</li>
|
||||
<li>Jeux Vidéos (Kingdom Hearts, No Man's Sky)</li>
|
||||
</ul>
|
||||
</p>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<h1 class="title">Formations</h1>
|
||||
<hr />
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
<p class="title is-4">School Name</p>
|
||||
<p class="subtitle is-6">Program/Course - <time datetime="2016-9">September 2016</time> - <time
|
||||
datetime="2019-9">Sepemter 2019</time></p>
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<figure class="image is-64x64">
|
||||
<img src="img/esgi-logo.jpg" alt="ESGI">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="media-content">
|
||||
<p class="title is-4">ESGI</p>
|
||||
<p class="subtitle is-6"><time datetime="2015">2015</time></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
||||
Phasellus nec iaculis mauris.
|
||||
<ul>
|
||||
<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
|
||||
<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
|
||||
</ul>
|
||||
Mastère Architecture des Logiciels
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card card-gap">
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
<p class="title is-4">School Name</p>
|
||||
<p class="subtitle is-6">Program/Course - <time datetime="2015-9">September 2014</time> - <time
|
||||
datetime="2015-9">Sepemter 2015</time></p>
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<figure class="image is-64x64">
|
||||
<img src="img/montreuil-logo.png" alt="IUT de Montreuil">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="media-content">
|
||||
<p class="title is-4">IUT De Montreuil</p>
|
||||
<p class="subtitle is-6"><time datetime="2013">2013</time></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
|
||||
Phasellus nec iaculis mauris.
|
||||
<ul>
|
||||
<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
|
||||
<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
|
||||
</ul>
|
||||
Licence Profesionnelle CSID (Conception des systèmes d’information, intégration et décision)
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card card-gap">
|
||||
<div class="card-content">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<figure class="image is-64x64">
|
||||
<img src="img/montreuil-logo.png" alt="IUT de Montreuil">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="media-content">
|
||||
<p class="title is-4">IUT De Montreuil</p>
|
||||
<p class="subtitle is-6"><time datetime="2011">2011</time></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
DUT Informatique
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -236,26 +392,18 @@
|
||||
<nav class="level">
|
||||
<div class="level-item has-text-centered">
|
||||
<div>
|
||||
<a href="https://github.com/mmacneil" class="icon is-large">
|
||||
<a href="https://github.com/aminecmi" class="icon is-large">
|
||||
<i class="fab fa-2x fa-github"></i>
|
||||
</a>
|
||||
<p class="heading"><a href="https://github.com/mmacneil">github.com/mmacneil</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="level-item has-text-centered">
|
||||
<div>
|
||||
<a href="https://fullstackmark.com" class="icon is-large">
|
||||
<i class="fas fa-2x fa-globe"></i>
|
||||
</a>
|
||||
<p class="heading"><a href="https://fullstackmark.com">fullstackmark.com</a></p>
|
||||
<p class="heading"><a href="https://github.com/aminecmi">github.com/aminecmi</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="level-item has-text-centered">
|
||||
<div>
|
||||
<a href="mailto:markmacneil@gmail.com" class="icon is-large">
|
||||
<a href="mailto:amine.bouabdallaoui@gmail.com" class="icon is-large">
|
||||
<i class="fas fa-2x fa-envelope"></i>
|
||||
</a>
|
||||
<p class="heading"><a href="mailto:markmacneil@gmail.com">markmacneil@gmail.com</a></p>
|
||||
<p class="heading"><a href="mailto:amine.bouabdallaoui@gmail.com">amine.bouabdallaoui@gmail.com</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="level-item has-text-centered">
|
||||
@@ -263,211 +411,18 @@
|
||||
<a href="https://www.linkedin.com/in/markmacneilhfx" class="icon is-large">
|
||||
<i class="fab fa-2x fa-linkedin-in"></i>
|
||||
</a>
|
||||
<p class="heading"><a href="https://www.linkedin.com/in/markmacneilhfx">linkedin</a></p>
|
||||
<p class="heading"><a href="https://www.linkedin.com/in/bouamine">linkedin</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Modals -->
|
||||
<div id="project-1-modal" class="modal">
|
||||
<div class="modal-background"></div>
|
||||
<div class="modal-card">
|
||||
<header class="modal-card-head">
|
||||
<p class="modal-card-title">Project title</p>
|
||||
<button class="delete" aria-label="close"></button>
|
||||
</header>
|
||||
<section class="modal-card-body">
|
||||
<p class="image is-3by2">
|
||||
<img src="img/project-1-cover.png" alt="">
|
||||
</p>
|
||||
|
||||
<div class="content">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
|
||||
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat.
|
||||
</div>
|
||||
|
||||
<div class="tags">
|
||||
<span class="tag">angular</span>
|
||||
<span class="tag">mongo</span>
|
||||
<span class="tag">typscript</span>
|
||||
<span class="tag">node</span>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<footer class="modal-card-foot">
|
||||
<button class="button is-success">Close</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="project-2-modal" class="modal">
|
||||
<div class="modal-background"></div>
|
||||
<div class="modal-card">
|
||||
<header class="modal-card-head">
|
||||
<p class="modal-card-title">Project title</p>
|
||||
<button class="delete" aria-label="close"></button>
|
||||
</header>
|
||||
<section class="modal-card-body">
|
||||
<p class="image is-3by2">
|
||||
<img src="img/project-2-cover.png" alt="">
|
||||
</p>
|
||||
|
||||
<div class="content">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
|
||||
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat.
|
||||
</div>
|
||||
|
||||
<div class="tags">
|
||||
<span class="tag">angular</span>
|
||||
<span class="tag">mongo</span>
|
||||
<span class="tag">typscript</span>
|
||||
<span class="tag">node</span>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<footer class="modal-card-foot">
|
||||
<button class="button is-success">Close</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="project-3-modal" class="modal">
|
||||
<div class="modal-background"></div>
|
||||
<div class="modal-card">
|
||||
<header class="modal-card-head">
|
||||
<p class="modal-card-title">Project title</p>
|
||||
<button class="delete" aria-label="close"></button>
|
||||
</header>
|
||||
<section class="modal-card-body">
|
||||
<p class="image is-3by2">
|
||||
<img src="img/project-3-cover.png" alt="">
|
||||
</p>
|
||||
|
||||
<div class="content">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
|
||||
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat.
|
||||
</div>
|
||||
|
||||
<div class="tags">
|
||||
<span class="tag">angular</span>
|
||||
<span class="tag">mongo</span>
|
||||
<span class="tag">typscript</span>
|
||||
<span class="tag">node</span>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<footer class="modal-card-foot">
|
||||
<button class="button is-success">Close</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="project-4-modal" class="modal">
|
||||
<div class="modal-background"></div>
|
||||
<div class="modal-card">
|
||||
<header class="modal-card-head">
|
||||
<p class="modal-card-title">Project title</p>
|
||||
<button class="delete" aria-label="close"></button>
|
||||
</header>
|
||||
<section class="modal-card-body">
|
||||
<p class="image is-3by2">
|
||||
<img src="img/project-4-cover.png" alt="">
|
||||
</p>
|
||||
|
||||
<div class="content">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
|
||||
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat.
|
||||
</div>
|
||||
|
||||
<div class="tags">
|
||||
<span class="tag">angular</span>
|
||||
<span class="tag">mongo</span>
|
||||
<span class="tag">typscript</span>
|
||||
<span class="tag">node</span>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<footer class="modal-card-foot">
|
||||
<button class="button is-success">Close</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="project-5-modal" class="modal">
|
||||
<div class="modal-background"></div>
|
||||
<div class="modal-card">
|
||||
<header class="modal-card-head">
|
||||
<p class="modal-card-title">Project title</p>
|
||||
<button class="delete" aria-label="close"></button>
|
||||
</header>
|
||||
<section class="modal-card-body">
|
||||
<p class="image is-3by2">
|
||||
<img src="img/project-5-cover.png" alt="">
|
||||
</p>
|
||||
|
||||
<div class="content">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
|
||||
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat.
|
||||
</div>
|
||||
|
||||
<div class="tags">
|
||||
<span class="tag">angular</span>
|
||||
<span class="tag">mongo</span>
|
||||
<span class="tag">typscript</span>
|
||||
<span class="tag">node</span>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<footer class="modal-card-foot">
|
||||
<button class="button is-success">Close</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="project-6-modal" class="modal">
|
||||
<div class="modal-background"></div>
|
||||
<div class="modal-card">
|
||||
<header class="modal-card-head">
|
||||
<p class="modal-card-title">Project title</p>
|
||||
<button class="delete" aria-label="close"></button>
|
||||
</header>
|
||||
<section class="modal-card-body">
|
||||
<p class="image is-3by2">
|
||||
<img src="img/project-6-cover.png" alt="">
|
||||
</p>
|
||||
|
||||
<div class="content">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
|
||||
magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat.
|
||||
</div>
|
||||
|
||||
<div class="tags">
|
||||
<span class="tag">angular</span>
|
||||
<span class="tag">mongo</span>
|
||||
<span class="tag">typscript</span>
|
||||
<span class="tag">node</span>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<footer class="modal-card-foot">
|
||||
<button class="button is-success">Close</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="content has-text-centered">
|
||||
<p>
|
||||
<p>
|
||||
<a href="https://github.com/mmacneil/devfolio" target="_blank" class="icon has-text-primary">
|
||||
<i class="fab fa-github"></i> <strong>devfolio</strong></a>
|
||||
<i class="fab fa-github"></i> <strong>devfolio</strong></a>
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
@@ -475,4 +430,4 @@
|
||||
<script src="js/bundle.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user