CSS

musicfortrio.com

Goal: Develop an e-commerce website for the “Music for Trio” company that sells music online. Use WordPress as a CMS for the site with a e-commerce plugin. Test and deploy the site on the company’s server. Provide ongoing maintenance.
Web technologies used: HTML5, CSS, PHP, WordPress.
Tools and software: Photoshop, MS Visual Studio Code
Release date: October, 2017
Project type: Contract work for Music for Trio.
musicfortrio.com

An overlay layer for a background image

Make an overlay layer for a background image on your template. This is the HTML:

<header id="bg-section">
  <div class="dark-overlay">
   ...
   </div>
  </div>

The SASS:

$dark-overlay: rgba(0,0,0,0.7);

#bg-section {
    background: url('img/bg.jpg') no-repeat center top fixed;
    background-size: cover;
    background-attachment: fixed;
    min-height: 700px;

    .dark-overlay {
        background-color: $dark-overlay;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        min-height: 700px;
    }
}

Bootstrap 4 beta Starter Template for Vue.js

This is an HTML5 Bootstrap 4 Beta template with Bootstrap CDN links with SRI. Great start for developing Vue.js applications.

<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
  </head>
  <body>
    <div id="app"></div>
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
  </body>
</html>

clicksand.net

Goal: Develop a website (theme) for a book author based on provided PDF mocks. Use WordPress as a CMS for the site. Test and deploy the site on the company’s server.
Web technologies used: HTML5, CSS, PHP, WordPress.
Tools and software: Photoshop, MS Visual Studio Code
Release date: May, 2017
Project type: Contract work for Civilis Marketing.
clicksand.net

merkelfinancial.com

Goal: Develop a website (theme) for a financial company based on provided PDF mocks. Use WordPress as a CMS for the site. Test and deploy the site on the company’s server.
Web technologies used: HTML5, CSS, PHP, WordPress.
Tools and software: Photoshop, MS Visual Studio Code
Release date: April, 2017
Project type: Contract work for Civilis Marketing.
merkelfinancial.com