shgysk8zer0.github.io

A responsive, progressive about / portfolio & blog page built using Jekyll

Features

• Progressive Web App manifest.json
service-worker.js
• Responsive Design using @media queries, rem / vw units
• Responsive Images using srcset & sizes
• CSS Grid display: grid
• SVG icons using <symbol>s & <use xlink:href="...">
• ECMAScript modules

    // script.js
    import {myClass} from './myClass.js';
  
    export default class $ {
        constructor(query, base = document) {
            this.els = [...base.querySelectorAll(query)];
        }
  
        // ... Some more methods here
  
        animate(keyframes, opts = 600) {
            this.els.forEach(el => el.animate(keyframes, opts));
        }
    };
  

• CSS custom properties

    @import url("./vars.css");
  
    :root {--my-var: red;}
    .my-class {color: var(--my-var);}
  

• CSS animations & JavaScript Animations API

    import {$} from './script.js';
  
    $('.fade-in').animate([
        {opacity: 0},
        {opacity: 1},
    ], {
        duration: 600,
        easing: 'ease-in',
    });
  

• Content-Security-Policy (CSP)
• SEO via structured data

<address itemprop="homeAddress" itemtype="http://schema.org/PostalAddress" itemscope>
	<!-- Address info here with appropriate `itemprop`s -->
</address>

• Built using Jekyll & GitHub Pages

The links you’re looking for

• Issues
• Pull Requests
• Code of Conduct
• Contributing Guidelines

Contact Info

• Email: chris@chriszuber.com

Donations

https://www.paypal.me/shgysk8zer0

bitcoin:1AdHne5JRY9GxVpYD13KithkNF2WEBbfKf