Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!doctype html>
- <html>
- <head>
- <script type="text/javascript">
- var TxtType = function(el, toRotate, period) {
- this.toRotate = toRotate;
- this.el = el;
- this.loopNum = 0;
- this.period = parseInt(period, 10) || 2000;
- this.txt = '';
- this.tick();
- this.isDeleting = false;
- };
- TxtType.prototype.tick = function() {
- var i = this.loopNum % this.toRotate.length;
- var fullTxt = this.toRotate[i];
- if (this.isDeleting) {
- this.txt = fullTxt.substring(0, this.txt.length - 1);
- } else {
- this.txt = fullTxt.substring(0, this.txt.length + 1);
- }
- this.el.innerHTML = '<span class="wrap">'+this.txt+'</span>';
- var that = this;
- var delta = 200 - Math.random() * 100;
- if (this.isDeleting) { delta /= 2; }
- if (!this.isDeleting && this.txt === fullTxt) {
- delta = this.period;
- this.isDeleting = true;
- } else if (this.isDeleting && this.txt === '') {
- this.isDeleting = false;
- this.loopNum++;
- delta = 500;
- }
- setTimeout(function() {
- that.tick();
- }, delta);
- };
- window.onload = function() {
- var elements = document.getElementsByClassName('typewrite');
- for (var i=0; i<elements.length; i++) {
- var toRotate = elements[i].getAttribute('data-type');
- var period = elements[i].getAttribute('data-period');
- if (toRotate) {
- new TxtType(elements[i], JSON.parse(toRotate), period);
- }
- }
- // INJECT CSS
- var css = document.createElement("style");
- css.type = "text/css";
- css.innerHTML = ".typewrite > .wrap { border-right: 0.08em solid #fff}";
- document.body.appendChild(css);
- };
- </script>
- <style type="text/css">html {
- scroll-behavior: smooth;
- }</style>
- <link href="lightbox.css" rel="stylesheet">
- "@Url.Content("~/css/style.css">
- <meta charset="utf-8"/>
- <meta http-equiv="x-ua-compatible" content="ie=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
- <meta itemprop="name" content="Josh Mcguinness | Full Stack Developer"/>
- <meta itemprop="url" content="https://joshmcguinness.co.uk/"/>
- <title>@Model.Content.Name - @home.Sitename</title>
- <link href="http://gmpg.org/xfn/11" rel="profile"/>
- <!-- Favicons -->
- <meta name="application-name" content=" "/>
- <!-- Meta -->
- <meta name="author" content="Josh Mcguinness">
- <meta name="description" content="Josh Mcguinness is a front end web developer from Glasgow, Scotland">
- <link rel="canonical" href="http://joshmcguinness.co.uk">
- <!-- Facebook -->
- <meta property="og:url" content="https://joshmcguinness.co.uk">
- <meta property="og:type" content="website">
- <meta property="og:title" content="Josh Mcguinness">
- <meta property="og:image" content="">
- <meta property="og:image:type" content="image/jpg">
- <meta property="og:image:width" content="1200">
- <meta property="og:image:height" content="630">
- <meta property="og:description" content="osh Mcguinness is a front end web developer from Glasgow, Scotland">
- <!-- Twitter -->
- <link rel='dns-prefetch' href='//s.w.org' />
- <!-- SEO meta tags powered by SmartCrawl -->
- <!-- Global site tag (gtag.js) - Google Analytics -->
- <script async src="https://www.googletagmanager.com/gtag/js?id=UA-131802537-1"></script>
- <script>
- window.dataLayer = window.dataLayer || [];
- function gtag(){dataLayer.push(arguments);}
- gtag('js', new Date());
- gtag('config', 'UA-131802537-1');
- </script>
- <script>
- (function(h,o,t,j,a,r){
- h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
- h._hjSettings={hjid:1165353,hjsv:6};
- a=o.getElementsByTagName('head')[0];
- r=o.createElement('script');r.async=1;
- r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
- a.appendChild(r);
- })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
- </script>
- <script type="application/ld+json">
- {"@context":"http://schema.org","@type":"WebSite","name":"Josh Mcguinness","headline":"Josh Mcguinness","author":{"@type":"Person","name":"Josh Mcguinness"},"description":"Front end Web Developer","url":"https://joshmcguinness.co.uk/"}
- </script>
- </head>
- <body id="top" class="home page-template-default page page-id-8" itemscope itemtype="http://schema.org/Blog">
- <main role="main"><section class="intro" style=" background-image: url("bg.jpg")!important;">
- <div class="intro-overlay"></div>
- <div class="intro-content">
- <h3 class="intro-subtitle">Hello, World.</h3>
- <h1 class="intro-title title">I'm Josh McGuinness.</h1>
- <p class="intro-position">
- <a href="" class="typewrite" data-period="2000" data-type='[ "front-end Web Developer", "entrepreneur", "computer science grad", "Beer enthusiast","Digital-nomad" ]'>
- <span class="wrap"></span>
- </a>
- </p>
- </p>
- <a href="#section1"><button>Learn More</button></a></a>
- <div class="is-flex social-connect">
- <a href="" target="_blank">
- <i class="fab fa-linkedin-in"></i>
- </a>
- <a href="" target="_blank">
- <i class="fab fa-twitter"></i>
- </a>
- <a href="" target="_blank">
- <i class="fab fa-github"></i>
- </a>
- <a href="mailto:hello@joshmcguinness.co.uk" target="_blank">
- <i class="far fa-envelope"></i>
- </a>
- </div>
- </div>
- </section><section class="section about" id="section1">
- <div class="container">
- <div class="content has-text-centered">
- <div class="header-intro">
- <h5>About</h5>
- <h6>Get to know me.</h6>
- </div>
- </div>
- <div class="columns">
- <div class="column is-6 my-profile">
- <h5 class="title">My Profile</h5>
- <p>I am a creative and skilled designer/developer.with a real passion for creating beautiful and functional websites. I also enjoy turning complex problems into simple, attractive and innovative interface designs.</p>
- <br>
- <ul class="about-list">
- <li>
- <strong>Name:</strong><br>
- <span>Joshua Michael McGuinness</span>
- </li>
- <li>
- <strong>Place of Birth:</strong><br>
- <span>Ayrshire Scotland</span>
- </li>
- <li>
- <strong>Date of Birth:</strong><br>
- <span>Jan 1992</span>
- </li>
- <li>
- <strong>Current Location:</strong><br>
- <span>United Kingdom</span>
- </li>
- <li>
- <strong>Current Job:</strong><br>
- <span>Front end Web Developer</span>
- </li>
- <li>
- <strong>Email Address</strong><br>
- <a href="mailto:hello@joshmcguinness.co.uk"><span>hello@joshmcguinness.co.uk</span></a>
- </li>
- </ul>
- </div>
- <div class="column is-6 my-skills">
- <h5 class="title">My Skills</h5>
- <p>I have been within the web development sphere for many years now, below you will find a list of some of my favorite languages and code bases. First and foremost i am a PHP/wordpress developer but have begun to broaden my horizons into the realms of MS tech stack & React Native.</p>
- <br>
- <ul class="skills-list">
- <li>
- <strong class="is-uppercase">PHP</strong>
- <progress class="progress is-small" value="90" max="100">90</progress>
- <strong>90%</strong>
- </li>
- <li>
- <strong class="is-uppercase">Wordpress</strong>
- <progress class="progress is-small" value="90" max="100">90</progress>
- <strong>90%</strong>
- </li>
- <li>
- <strong class="is-uppercase">.net</strong>
- <progress class="progress is-small" value="70" max="100">79</progress>
- <strong>70%</strong>
- </li>
- <li>
- <strong class="is-uppercase">HTML5</strong>
- <progress class="progress is-small" value="90" max="100">90</progress>
- <strong>85%</strong>
- </li>
- <li>
- <strong class="is-uppercase">CSS3</strong>
- <progress class="progress is-small" value="90" max="100">90</progress>
- <strong>85%</strong>
- </li>
- <li>
- <strong class="is-uppercase">JS</strong>
- <progress class="progress is-small" value="75" max="100">75</progress>
- <strong>75%</strong>
- </li>
- <li>
- <strong class="is-uppercase">Java (Android)</strong>
- <progress class="progress is-small" value="30" max="100">30</progress>
- <strong>70%</strong>
- </li>
- <li>
- <strong class="is-uppercase">React</strong>
- <progress class="progress is-small" value="50" max="100">49</progress>
- <strong>50%</strong>
- </li>
- </ul>
- </div>
- </div>
- <div class="columns has-text-centered">
- <div class="column">
- <div class="content tools-list">
- <h5 class="title">My Development Tools:</h5>
- <p>PhpStorm, Personal CSS Framework, Bulma, Bitbucket, Gitlab, Github, Laragon, Git Bash.</p>
- </div>
- </div>
- </div>
- </div>
- </section>
- <section class="section hero is-light" id="resume">
- <div class="content has-text-centered">
- <div class="header-intro">
- <h5>My Resume</h5>
- <h6>My work experience.</h6>
- </div>
- </div>
- <div class="timeline is-centered">
- <div class="timeline-item item-1">
- <div class="timeline-marker green"></div>
- <div class="timeline-content">
- <p class="heading">January 2019 - Present</p>
- <p>Web Developer at Coder Pro.net</p>
- </div>
- </div>
- <div class="timeline-item item-2">
- <div class="timeline-marker red"></div>
- <div class="timeline-content">
- <p class="heading">November 2017 - December 2018</p>
- <p>front end developer & spires art<sup>8</sup></p>
- </div>
- </div>
- <div class="timeline-item item-3">
- <div class="timeline-marker red"></div>
- <div class="timeline-content">
- <p class="heading">April 2016 - November 2017</p>
- <p>front end & UI developer at SOLUS UK</p>
- </div>
- </div>
- <div class="timeline-item item-4">
- <div class="timeline-marker red"></div>
- <div class="timeline-content">
- <p class="heading">August 2014 - March 2016</p>
- <p>junior webdeveloper @ buzz agency</p>
- </div>
- </div>
- <div class="timeline-item item-5">
- <div class="timeline-marker red"></div>
- <div class="timeline-content">
- <p class="heading">February 2014 - present</p>
- <p>Freelance web developer</p>
- </div>
- </div>
- <div class="timeline-item item-6">
- <div class="timeline-marker red"></div>
- <div class="timeline-content">
- <p class="heading">January 2012 - January 2013</p>
- <p>Graduated from UWS Paisley with a BSC in <br> comuter science - Web and Mobile development </p>
- </div>
- </div>
- </div>
- </section>
- <section class="section hero portfolio">
- <div class="content has-text-centered">
- <div class="header-intro">
- <h5>My Recent Work</h5>
- <h6>Here are some of thing i've built & worked on over the years</h6>
- </div>
- <div class="container">
- <div class="portfolio-grid">
- <div class="columns is-multiline is-mobile">
- <div class="column is-12-mobile is-half-tablet is-one-third-desktop">
- <div class="portfolio-item-1">
- <figure class="image is-3by2">"
- <img class="portfolio-thumb" src="img/ogilvie.png" alt="">
- <div class="overlay">
- <div class="content">
- <p class="text">Property developer website I worked on while Working for Digital agency in Glasgow</p>
- <a href="ogilvie.png" data-lightbox="image-1" data-title="My caption" class="button is-rounded view-website">View</a>
- <a href="https://ogilviehomes.co.uk" class="button is-rounded view-website"> live site</a>
- </div>
- </div>
- </figure>
- </div>
- </div>
- <div class="column is-12-mobile is-half-tablet is-one-third-desktop">
- <div class="portfolio-item-2">
- <figure class="image is-3by2">
- <img class="portfolio-thumb" src="mack.png" alt="">
- <div class="overlay">
- <div class="content">
- <p class="text">Hi-synergy Wprdpress website</p>
- <a href="mack.png" data-lightbox="image-1" data-title="My caption" class="button is-rounded view-website">View</a>
- </div>
- </div>
- </figure>
- </div>
- </div>
- <div class="column is-12-mobile is-half-tablet is-one-third-desktop">
- <div class="portfolio-item-3">
- <figure class="image is-3by2">
- <img class="portfolio-thumb" src="spires1.png" alt="">
- <div class="overlay">
- <div class="content">
- <p class="text">Spires Art- Fine Art retailer</p>
- <a href="spires1.png" data-lightbox="image-1" data-title="My caption" class="button is-rounded view-website">view</a>
- <a href="http://www.spiresart.com" class="button is-rounded view-website"> live site</a> <
- </div>
- </div>
- </figure>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="container">
- <div class="portfolio-grid">
- <div class="columns is-multiline is-mobile">
- <div class="column is-12-mobile is-half-tablet is-one-third-desktop">
- <div class="portfolio-item-1">
- <figure class="image is-3by2">"
- <img class="portfolio-thumb" src="search1.png" alt="">
- <div class="overlay">
- <div class="content">
- <p class="text">spires artwork database</p>
- <a href="http://www.spiresart2.com/bridgeman_new/" class="button is-rounded view-website">live site</a> <
- </div>
- </figure>
- </div>
- </div>
- <div class="column is-12-mobile is-half-tablet is-one-third-desktop">
- <div class="portfolio-item-2">
- <figure class="image is-3by2">
- <img class="portfolio-thumb" src="ems1.png" alt="">
- <div class="overlay">
- <div class="content">
- <p class="text">Emergency Medical Supplies-Wordpress website</p>
- <a href="ems1.png" data-lightbox="image-1" data-title="My caption" class="button is-rounded view-website">View</a>
- <a href="http://emergencymedicalsupplies.co.uk" class="button is-rounded view-website">live site</a>
- http://emergencymedicalsupplies.co.uk
- </div>
- </div>
- </figure>
- </div>
- </div>
- <div class="column is-12-mobile is-half-tablet is-one-third-desktop">
- <div class="portfolio-item-3">
- <figure class="image is-3by2">
- <img class="portfolio-thumb" src="crawford.png" alt="">
- <div class="overlay">
- <div class="content">
- <p class="text">Crawford Residences- website</p>
- <a data-lightbox="image-1" data-title="My caption" class="button is-rounded view-website">under construction</a>
- </div>
- </div>
- </figure>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="container">
- <div class="portfolio-grid">
- <div class="columns is-multiline is-mobile">
- <div class="column is-12-mobile is-half-tablet is-one-third-desktop">
- <div class="portfolio-item-1">
- <figure class="image is-3by2">"
- <img class="portfolio-thumb" src="kingdom1.png" alt="">
- <div class="overlay">
- <div class="content">
- <p class="text">Kingdom crafts</p>
- <a href="kingdom1.png" data-lightbox="image-1" data-title="My caption" class="button is-rounded view-website">View</a>
- </div>
- </div>
- </figure>
- </div>
- </div>
- <div class="column is-12-mobile is-half-tablet is-one-third-desktop">
- <div class="portfolio-item-2">
- <figure class="image is-3by2">
- <img class="portfolio-thumb" src="vip.png" alt="">
- <div class="overlay">
- <div class="content">
- <p class="text">VIP Group- Glasgow</p>
- <a href="vip.png" data-lightbox="image-1" data-title="My caption" class="button is-rounded view-website">View</a>
- </div>
- </div>
- </figure>
- </div>
- </div>
- <div class="column is-12-mobile is-half-tablet is-one-third-desktop">
- <div class="portfolio-item-3">
- <figure class="image is-3by2">
- <img class="portfolio-thumb" src="logo.png" alt="">
- <div class="overlay">
- <div class="content">
- <p class="text">Josh Mcguinness- Logo</p>
- <a href="logo.png" data-lightbox="image-1" data-title="My caption" class="button is-rounded view-website">View</a>
- </div>
- </div>
- </figure>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="support">
- <h5>Want to show appreciation or support future projects?</h5>
- <a class="bmc-button" target="_blank" href="https://www.buymeacoffee.com/mRf6CF2Ys">
- <img src="https://www.buymeacoffee.com/assets/img/BMC-btn-logo.svg" alt="Buy me a coffee">
- <span style="margin-left:5px">Buy me a coffee</span>
- </a>
- </div>
- </section>
- <section class="section hero is-light testimonials">
- <div class="content has-text-centered">
- <div class="header-intro">
- <h5>Testimonials</h5>
- <h6>What people have to say..</h6>
- </div>
- <div class="columns is-centered">
- <div class="column is-two-thirds">
- <div class="testimonials-carousel">
- <div class="testimonial-block">
- <img class="avatar" src="mary.jpg" alt="Graeme Mcintosh" />
- <p class="reference">
- βHis work approach, maturity and willingness to learn were definitively accomplishments, i would work with him again. β </p>
- <h5>Mary McPhillips</h5>
- <p>owner, kingdom krafts</p>
- </div>
- </div>
- </div>
- </div>
- </div>
- </section>
- <section class="section hero is-dark contact">
- <div class="container">
- <div class="header-intro">
- <h5 class="has-text-centered is-uppercase">Contact</h5>
- <h6 class="has-text-centered has-text-white">Do you have an idea or simply want to chat?</h6>
- <h6 class="has-text-centered has-text-white">I'd love to hear from you.</h6>
- </div>
- <script src="https://www.google.com/recaptcha/api.js" async defer></script>
- <script>
- function onSubmit(token) {
- document.getElementById("form").submit();
- }
- </script>
- <form id="form" accept-charset="UTF-8" action="https://usebasin.com/f/dc73642ac527" method="POST">
- <div class="columns is-centered">
- <div class="column is-half">
- <div class="field">
- <label class="label">Name</label>
- <div class="control is-expanded">
- <input class="input is-medium" name="name" id="name" type="text" required>
- </div>
- </div>
- </div>
- <div class="column is-half">
- <div class="field">
- <label class="label">Email</label>
- <div class="control is-expanded">
- <input class="input is-medium" type="email" id="email" name="email" required>
- </div>
- </div>
- </div>
- </div>
- <div class="columns is-centered">
- <div class="column">
- <div class="field">
- <label class="label">Message</label>
- <div class="control is-expanded">
- <textarea class="textarea is-medium" name="comment" rows="5" required></textarea>
- </div>
- </div>
- </div>
- </div>
- <div class="columns is-centered">
- <div class="column is-one-third">
- <div class="field">
- <div class="control">
- <button class="button is-medium is-rounded g-recaptcha"
- data-sitekey="6Lew3SMUAAAAAJ82QoS7gqOTkRI_dhYrFy1f7Sqy"
- data-callback='onSubmit'
- data-badge="inline">Submit</button>
- </div>
- </div>
- </div>
- </div>
- </form>
- </div>
- </section><footer class="section hero is-dark has-text-centered" role="contentInfo" itemscope="itemscope" itemtype="http://schema.org/WPFooter">
- <div class="container is-narrow">
- <div class="copyright">
- <p>Copyright Β© Josh Mcguinness 2019</p>
- </div>
- <a href="https://bulma.io"><img src="https://bulma.io/images/made-with-bulma--white.png" alt="Made with Bulma" width="163" height="31"></a>
- <div id="scroll-top">
- <a class="scroll" title="Scroll Back To Top" href="#top">
- <i class="fas fa-arrow-up"></i>
- </a>
- </div>
- </div>
- </footer>
- <script type='text/javascript' src='main.js'></script>
- <script type='text/javascript' src='jquery.js'></script>
- <script type='text/javascript' src='jquery-migrate.js'></script>
- <script src="lightbox.js"></script>
- });</script>
- </main>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement