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