-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
18 lines (16 loc) · 15.7 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html><html lang="it"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="ie=edge"><meta name="description" content="Sito personale di Matteo Badini, freelancer italiano nel settore informatico. Ingegnerie informatico, insegnante e sviluppatore web."><link rel="manifest" href="manifest.json"><meta name="mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="application-name" content="bad"><meta name="apple-mobile-web-app-title" content="bad"><meta name="theme-color" content="#E65959"><meta name="msapplication-navbutton-color" content="#E65959"><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"><meta name="msapplication-starturl" content="/index.html"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><link rel="icon" type="image/png" sizes="57x57" href="images/touch/apple-touch-icon.png"><link rel="apple-touch-icon" type="image/png" sizes="57x57" href="images/touch/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="72x72" href="images/touch/apple-touch-icon-72x72.png"><link rel="apple-touch-icon" type="image/png" sizes="72x72" href="images/touch/apple-touch-icon-72x72.png"><link rel="icon" type="image/png" sizes="144x144" href="images/touch/apple-touch-icon-144x144.png"><link rel="apple-touch-icon" type="image/png" sizes="144x144" href="images/touch/apple-touch-icon-144x144.png"><link rel="icon" type="image/png" sizes="192x192" href="images/touch/apple-touch-icon-192x192.png"><link rel="apple-touch-icon" type="image/png" sizes="192x192" href="images/touch/apple-touch-icon-192x192.png"><link rel="icon" type="image/png" sizes="512x192" href="images/touch/apple-touch-icon-512x512.png"><link rel="apple-touch-icon" type="image/png" sizes="512x512" href="images/touch/apple-touch-icon-512x512.png"><title>Matteo Badini</title><!-- Critical CSS--><style>a,h1,h2,h3,h4,h5,h6,p{margin:0;padding:0}h1{font-size:1.4em}h2{display:inline-block;font-size:1.5em;padding:.4em 16px}h3{display:inline-block;font-size:1.1em;margin:24px 0}h4{font-size:1em;text-align:center;margin:16px 0}h5{font-size:.8em;display:inline-block;padding:0 8px}h6{position:relative;margin:0 -30px 0 -30px;font-size:1em;padding:4px 8px 4px 30px;display:inline-block;top:-2px}p{font-size:1em}a{text-decoration:none}a.button{position:relative;padding:8px;text-align:center;width:170px}.wrapper{height:calc(100vh - 56px);overflow-y:auto;overflow-x:hidden;position:absolute;top:56px}.section{margin:0;display:block}.section__header{padding-top:24px}.section__content{padding:0 16px 24px 16px}.so-fare__block{display:grid;grid-gap:24px 24px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));text-align:center}.so-fare__item img{width:6em}.section-2 .section__content{display:grid;grid-gap:24px 24px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.educazione__block div,.esperienza__block div{padding:0 24px}.section-2 b{position:relative;display:block;padding:8px 0 4px 0}.section-2 i{font-size:.8em;position:relative;display:block;padding:0 0 8px 0}.section-2 a.button{display:inline-block;margin:-16px 30px 48px 16px}.progetti__block{display:grid;grid-gap:24px 24px;grid-template-columns:repeat(2,minmax(150px,1fr))}.progetti__block img{width:100%}.section-4 .section__content{display:grid;grid-gap:24px 24px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.scrivimi__block ul{padding:0;margin:0;list-style-type:none}.scrivimi__block ul li{padding:8px 0}.scrivimi__block ul b{position:relative;top:2px;padding-left:32px}@media screen and (min-width:960px){h2{margin-left:-10px;padding-left:42px;position:relative}.wrapper{left:300px}.section{margin-left:16px;margin-bottom:16px}.section__content{padding:0 32px 48px 32px}.section-1{margin-top:16px}.section-2 a.button{margin:-16px 30px 48px}}.menu__block{display:flex;flex-direction:column;background-color:#fff;min-height:calc(100vh - 56px);left:0;position:absolute;right:auto;width:100vw;top:56px;transform:translateX(-100%);transition:all .4s ease;z-index:99}.menu__photo{background-color:#eee;border-radius:100%;width:200px;height:200px;max-width:300px;margin:24px auto;position:relative;overflow:hidden}.menu__photo:before{content:'';width:80px;height:80px;margin:40px 0 0 60px;background-color:#fff;border-radius:100%;position:absolute}.menu__photo:after{content:'';width:160px;height:160px;margin:115px 0 0 -175px;background-color:#fff;border-radius:100%;position:absolute;z-index:0}.menu__photo img{width:100%;height:100%;position:relative;z-index:1}.menu__list,.menu__social{font:normal normal 300 1em sans-serif;list-style-type:none;margin:0;padding:0}.menu__list li,.menu__social li{text-align:center}.menu__list li a,.menu__social li a{display:block;padding:16px 0}.menu__social{bottom:0;left:0;right:0;display:flex;flex-direction:row;align-items:stretch}.menu__social li{flex:1;padding:16px}.menu__social i{display:block;height:24px;width:24px;margin:0 auto}@media screen and (min-width:960px){.menu__block{min-height:calc(100vh - 72px);top:72px;transform:translateX(0);right:auto;width:300px}}/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.menu.icon{color:#212121;position:absolute;margin-left:0;margin-top:0;width:17px;height:1px;background-color:currentColor}.menu.icon:before{content:'';position:absolute;top:-5px;right:0;width:17px;height:1px;background-color:currentColor}.menu.icon:after{content:'';position:absolute;top:5px;right:0;width:17px;height:1px;background-color:currentColor}.topbar__block{background:#fff;align-items:center;display:flex;height:56px;position:fixed;top:0;width:100%;z-index:999}.topbar__title{left:16px;position:absolute;display:flex}.topbar__icon{align-items:center;display:flex;justify-content:center;position:absolute;right:16px;width:24px;height:24px}@media screen and (min-width:960px){.topbar__icon{display:none}}</style><!-- Lazy CSS --><link rel="preload" href="styles/lazy.css" as="style" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="styles/lazy.css"></noscript><script>!function(t){"use strict";t.loadCSS||(t.loadCSS=function(){});var e=loadCSS.relpreload={};if(e.support=function(){var e;try{e=t.document.createElement("link").relList.supports("preload")}catch(t){e=!1}return function(){return e}}(),e.bindMediaToggle=function(t){var e=t.media||"all";function a(){t.media=e}t.addEventListener?t.addEventListener("load",a):t.attachEvent&&t.attachEvent("onload",a),setTimeout(function(){t.rel="stylesheet",t.media="only x"}),setTimeout(a,3e3)},e.poly=function(){if(!e.support())for(var a=t.document.getElementsByTagName("link"),n=0;n<a.length;n++){var o=a[n];"preload"!==o.rel||"style"!==o.getAttribute("as")||o.getAttribute("data-loadcss")||(o.setAttribute("data-loadcss",!0),e.bindMediaToggle(o))}},!e.support()){e.poly();var a=t.setInterval(e.poly,500);t.addEventListener?t.addEventListener("load",function(){e.poly(),t.clearInterval(a)}):t.attachEvent&&t.attachEvent("onload",function(){e.poly(),t.clearInterval(a)})}"undefined"!=typeof exports?exports.loadCSS=loadCSS:t.loadCSS=loadCSS}("undefined"!=typeof global?global:this);</script></head><body><!-- Navigation menu --><nav class="menu__block depth-1"><div class="menu__photo depth-1"><picture class="profile-photo"><img class="lazyload" data-srcset="images/[email protected] 1x, images/[email protected] 2x" alt="foto di Matteo Badini"></picture></div><ul class="menu__list"><li><a href="#chi-sono"><span class="active">Chi Sono</span></a></li><li><a href="#curriculum"><span>Curriculum</span></a></li><li><a href="#portfolio"><span>Portfolio</span></a></li><li><a href="#contatti"><span>Contatti</span></a></li><li><a href="#"><span>Blog</span></a></li></ul><span style="flex-grow: 1"></span><ul class="menu__social"><li><a href="https://twitter.com/matteobad95" aria-label="twitter"><i class="twitter"></i></a></li><li><a href="https://www.facebook.com/matteo.badini.95" aria-label="facebook"><i class="facebook"></i></a></li><li><a href="https://github.com/matteobad" aria-label="github"><i class="github"></i></a></li></ul></nav><!-- Topbar --><div class="topbar__block depth-1"><div class="topbar__title"><h1>Matteo Badini</h1><div class="code icon"></div></div><div class="topbar__icon"><div class="menu icon"></div></div></div><!-- Main content --><main class="wrapper"><section id="chi-sono" class="section section-1 depth-1"><div class="section__header"><h2>Chi Sono</h2><h5>Geek, Docente, Sportivo</h5></div><div class="section__content"><h3>Sono un Web Developer</h3><p>Tutto ciò che rientra nell'ambito delle nuove tecnologie mi attrae ed incuriosisce. Cerco di mantenermi sempre aggiornato a riguardo, ma anche di ampliare le mie competenze multi-displinari.<br><br>Mi ritengo uno sportivo, adoro il calcio, quello giocato, non quello in televisione e spesso vado a correre lunghe distanze per mantenermi in forma e per schiarire le idee. La cosa che più stimola però, è buttarmi sempre in nuovi progetti, non per forza informatici.</p><h3>So Fare</h3><div class="so-fare__block"><div class="so-fare__item"><div class="image"><img class="lazyload" data-src="images/services/web-development.svg" alt="Sviluppo web"></div><h4 class="heading-4">Web</h4><p class="text">Analisi, sviluppo e design di siti web e PWA</p></div><div class="so-fare__item"><div class="image"><img class="lazyload" data-src="images/services/e-commerce.svg" alt="Sviluppo E-Commerce"></div><h4 class="heading-4">E-Commerce</h4><p class="text">Realizzo e-commerce con WooCommerce</p></div><div class="so-fare__item"><div class="image"><img class="lazyload" data-src="images/services/api-development.svg" alt="Sviluppo API"></div><h4 class="heading-4">API</h4><p class="text">Progetto e codifico API e sistemi backend ad hoc</p></div><div class="so-fare__item"><div class="image"><img class="lazyload" data-src="images/services/app-development.svg" alt="Sviluppo APP"></div><h4 class="heading-4">Android</h4><p class="text">Insegno a programmare app native per Android</p></div></div></div></section><section id="curriculum" class="section section-2 depth-1"><div class="section__header"><h2>Curriculum</h2><h5>5 anni di esperienza</h5></div><div class="section__content"><div class="educazione__block"><h3>Educazione</h3><div><h6>2014 - Presente</h6><p><b>Università</b></p><p><i>Università degli Studi di Bologna</i></p><p>Conseguimento della laurea triennale in Ingegneria Informatica</p><br><br><h6>2015 - Presente</h6><p><b>Volontario</b></p><p><i>Comune Castel Maggiore</i></p><p>Realizzazione eventi e proposte per sostenere e migliorare il comune</p><br><br><h6>2009 - 2014</h6><p><b>Liceo Economico</b></p><p><i>ITC Rosa Luxemburg</i></p><p>Diploma da "ragioniere, amministrazione e controllo" nell'indirizzo sperimentale in economia</p></div></div><div class="esperienza__block"><h3>Esperienza</h3><div><h6>Giu 2017 - Presente</h6><p><b>Docente e Sviluppatore</b></p><p><i>StudioSBS</i></p><p>Docente di alcuni corsi di programmazione e sicurezza informatica presso inSegno. Sviluppatore web presso QuoLAB web agency</p><br><br><h6>Feb 2017 - Giu 2017</h6><p><b>Sviluppatore Backend</b></p><p><i>MyVoice srl</i></p><p>Sviluppatore software web per una webagency di Bologna</p><br><br><h6>Gen 2016 - Set 2017</h6><p><b>Consulente Informatico</b></p><p><i>Banca Patrimoni Sella</i></p><p>Consulente tecnico all'interno di un progetto universitario</p></div></div></div><a class="button" href="CurriculumVitae-MatteoBadini.pdf" target="_blank" rel="noopener">Download CV</a></section><section id="portfolio" class="section section-3 depth-1"><div class="section__header"><h2>Portfolio</h2><h5>Alcuni progetti</h5></div><div class="section__content"><h3>Progetti</h3><div class="progetti__block"><div><a href="http://frogslab.it" aria-label="frogslab" target="_blank" rel="noopener"><picture><img class="lazyload depth-1" data-srcset="images/[email protected] 1x, images/[email protected] 2x, images/[email protected] 3x" alt="frogslab"></picture></a></div><div><a href="http://orthoponics.com" aria-label="orthoponics" target="_blank" rel="noopener"><picture><img class="lazyload depth-1" data-srcset="images/[email protected] 1x, images/[email protected] 2x, images/[email protected] 3x" alt="orthoponics"></picture></a></div><div><a href="http://armoniaseregno.it" aria-label="daccordo" target="_blank" rel="noopener"><picture><img class="lazyload depth-1" data-srcset="images/[email protected] 1x, images/[email protected] 2x, images/[email protected] 3x" alt="frogslab"></picture></a></div></div></div></section><section id="contatti" class="section section-4 depth-1"><div class="section__header"><h2>Contatti</h2><h5>Chiedimi qualcosa</h5></div><div class="section__content"><div class="scrivimi__block"><h3>Scrivimi</h3><p>Se credi che le mie competenze possano esserti utile in qualunque modo o se semplicemente hai qualche domanda, puoi contattarmi con questo form. In alternativa mi trovi su tutti i maggiori social network.<br>Sono un freelancer sempre aperto a nuove proposte lavorative.</p><br><ul><li><div class="map icon"></div><b>Castel Maggiore, BO</b></li><li><div class="mail icon"></div><b><a href="mailto:[email protected]">[email protected]</a></b><br></li><li><div class="check icon"></div><b>Freelance Disponibile</b><br></li></ul></div></div></section></main><script>// Check that service workers are registered
if ('serviceWorker' in navigator) {
// Use the window load event to keep the page load performant
window.addEventListener('load', () => {
navigator.serviceWorker.register('./sw.js');
});
}</script><script async src="scripts/lazyload-img.js"></script><script async src="scripts/index.js"></script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-130762186-1', 'auto');
ga('send', 'pageview');
</script>
</body></html>