Add files via upload

assets/js/main.js

@@ -0,0 +1,172 @@
+/*
+	Eventually by HTML5 UP
+	html5up.net | @ajlkn
+	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+*/
+
+(function() {
+
+	"use strict";
+
+	var	$body = document.querySelector('body');
+
+	// Methods/polyfills.
+
+		// classList | (c) @remy | github.com/remy/polyfills | rem.mit-license.org
+			!function(){function t(t){this.el=t;for(var n=t.className.replace(/^\s+|\s+$/g,"").split(/\s+/),i=0;i<n.length;i++)e.call(this,n[i])}function n(t,n,i){Object.defineProperty?Object.defineProperty(t,n,{get:i}):t.__defineGetter__(n,i)}if(!("undefined"==typeof window.Element||"classList"in document.documentElement)){var i=Array.prototype,e=i.push,s=i.splice,o=i.join;t.prototype={add:function(t){this.contains(t)||(e.call(this,t),this.el.className=this.toString())},contains:function(t){return-1!=this.el.className.indexOf(t)},item:function(t){return this[t]||null},remove:function(t){if(this.contains(t)){for(var n=0;n<this.length&&this[n]!=t;n++);s.call(this,n,1),this.el.className=this.toString()}},toString:function(){return o.call(this," ")},toggle:function(t){return this.contains(t)?this.remove(t):this.add(t),this.contains(t)}},window.DOMTokenList=t,n(Element.prototype,"classList",function(){return new t(this)})}}();
+
+		// canUse
+			window.canUse=function(p){if(!window._canUse)window._canUse=document.createElement("div");var e=window._canUse.style,up=p.charAt(0).toUpperCase()+p.slice(1);return p in e||"Moz"+up in e||"Webkit"+up in e||"O"+up in e||"ms"+up in e};
+
+		// window.addEventListener
+			(function(){if("addEventListener"in window)return;window.addEventListener=function(type,f){window.attachEvent("on"+type,f)}})();
+
+	// Play initial animations on page load.
+		window.addEventListener('load', function() {
+			window.setTimeout(function() {
+				$body.classList.remove('is-preload');
+			}, 100);
+		});
+
+	// Slideshow Background.
+		(function() {
+
+			// Settings.
+				var settings = {
+
+					// Images (in the format of 'url': 'alignment').
+						images: {
+							'images/bg01.jpg': 'center',
+							'images/bg02.jpg': 'center',
+							'images/bg03.jpg': 'center'
+						},
+
+					// Delay.
+						delay: 6000
+
+				};
+
+			// Vars.
+				var	pos = 0, lastPos = 0,
+					$wrapper, $bgs = [], $bg,
+					k, v;
+
+			// Create BG wrapper, BGs.
+				$wrapper = document.createElement('div');
+					$wrapper.id = 'bg';
+					$body.appendChild($wrapper);
+
+				for (k in settings.images) {
+
+					// Create BG.
+						$bg = document.createElement('div');
+							$bg.style.backgroundImage = 'url("' + k + '")';
+							$bg.style.backgroundPosition = settings.images[k];
+							$wrapper.appendChild($bg);
+
+					// Add it to array.
+						$bgs.push($bg);
+
+				}
+
+			// Main loop.
+				$bgs[pos].classList.add('visible');
+				$bgs[pos].classList.add('top');
+
+				// Bail if we only have a single BG or the client doesn't support transitions.
+					if ($bgs.length == 1
+					||	!canUse('transition'))
+						return;
+
+				window.setInterval(function() {
+
+					lastPos = pos;
+					pos++;
+
+					// Wrap to beginning if necessary.
+						if (pos >= $bgs.length)
+							pos = 0;
+
+					// Swap top images.
+						$bgs[lastPos].classList.remove('top');
+						$bgs[pos].classList.add('visible');
+						$bgs[pos].classList.add('top');
+
+					// Hide last image after a short delay.
+						window.setTimeout(function() {
+							$bgs[lastPos].classList.remove('visible');
+						}, settings.delay / 2);
+
+				}, settings.delay);
+
+		})();
+
+	// Signup Form.
+		(function() {
+
+			// Vars.
+				var $form = document.querySelectorAll('#signup-form')[0],
+					$submit = document.querySelectorAll('#signup-form input[type="submit"]')[0],
+					$message;
+
+			// Bail if addEventListener isn't supported.
+				if (!('addEventListener' in $form))
+					return;
+
+			// Message.
+				$message = document.createElement('span');
+					$message.classList.add('message');
+					$form.appendChild($message);
+
+				$message._show = function(type, text) {
+
+					$message.innerHTML = text;
+					$message.classList.add(type);
+					$message.classList.add('visible');
+
+					window.setTimeout(function() {
+						$message._hide();
+					}, 3000);
+
+				};
+
+				$message._hide = function() {
+					$message.classList.remove('visible');
+				};
+
+			// Events.
+			// Note: If you're *not* using AJAX, get rid of this event listener.
+				$form.addEventListener('submit', function(event) {
+
+					event.stopPropagation();
+					event.preventDefault();
+
+					// Hide message.
+						$message._hide();
+
+					// Disable submit.
+						$submit.disabled = true;
+
+					// Process form.
+					// Note: Doesn't actually do anything yet (other than report back with a "thank you"),
+					// but there's enough here to piece together a working AJAX submission call that does.
+						window.setTimeout(function() {
+
+							// Reset form.
+								$form.reset();
+
+							// Enable submit.
+								$submit.disabled = false;
+
+							// Show message.
+								$message._show('success', 'Thank you!');
+								window.open('https://chproducts.tech/docs', '_blank');
+								//$message._show('failure', 'Something went wrong. Please try again.');
+
+						}, 750);
+
+				});
+
+		})();
+
+})();

assets/sass/base/_bg.scss

@@ -0,0 +1,67 @@
+///
+/// Eventually by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* BG */
+
+	#bg {
+		@include vendor('transition', 'opacity #{_duration(bg-fadein)} ease-in-out');
+		height: 100%;
+		left: 0;
+		opacity: 0.375;
+		position: fixed;
+		top: 0;
+		width: 100%;
+		z-index: 1;
+
+		div {
+			@include vendor('transition', ('opacity #{_duration(bg-transition)} ease'));
+			background-size: cover;
+			height: 100%;
+			left: 0;
+			opacity: 0;
+			position: absolute;
+			top: 0;
+			visibility: hidden;
+			width: 150%;
+
+			&.visible {
+				@include vendor('animation', 'bg #{_duration(bg-slide)} linear infinite');
+				opacity: 1;
+				visibility: visible;
+				z-index: 1;
+
+				&.top {
+					z-index: 2;
+				}
+
+				@include breakpoint('<=large') {
+					@include vendor('animation', 'bg #{_duration(bg-slide) * 0.65} linear infinite');
+				}
+
+				@include breakpoint('<=small') {
+					@include vendor('animation', 'bg #{_duration(bg-slide) * 0.4} linear infinite');
+				}
+			}
+
+			&:only-child {
+				@include vendor('animation-direction', 'alternate !important');
+			}
+		}
+
+		body.is-preload & {
+			opacity: 0;
+		}
+	}
+
+	@include keyframes(bg) {
+		0% {
+			@include vendor('transform', 'translateX(0)');
+		}
+
+		100% {
+			@include vendor('transform', 'translateX(-25%)');
+		}
+	}

assets/sass/base/_page.scss

@@ -0,0 +1,78 @@
+///
+/// Eventually by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Basic */
+
+	// MSIE: Required for IEMobile.
+		@-ms-viewport {
+			width: device-width;
+		}
+
+	// MSIE: Prevents scrollbar from overlapping content.
+		body {
+			-ms-overflow-style: scrollbar;
+		}
+
+	// Ensures page width is always >=320px.
+		@include breakpoint('<=xsmall') {
+			html, body {
+				min-width: 320px;
+			}
+		}
+
+	// Set box model to border-box.
+	// Based on css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice
+		html {
+			box-sizing: border-box;
+		}
+
+		*, *:before, *:after {
+			box-sizing: inherit;
+		}
+
+	html, body {
+		height: 100%;
+		overflow-x: hidden;
+		width: 100%;
+
+		@include breakpoint('short') {
+			height: auto;
+			min-height: 100%;
+		}
+	}
+
+	body {
+		@include vendor('display', 'flex');
+		@include vendor('flex-direction', 'column');
+		@include vendor('justify-content', 'center');
+		background-color: _palette(bg);
+		padding: 6em 4em 4em 4em;
+
+		// Stops initial animations until page loads.
+			&.is-preload {
+				*, *:before, *:after {
+					@include vendor('animation', 'none !important');
+					@include vendor('transition', 'none !important');
+				}
+			}
+
+		> * {
+			position: relative;
+			z-index: 2;
+		}
+
+		@include breakpoint('<=xlarge') {
+			padding: 6em 3.5em 3.5em 3.5em;
+		}
+
+		@include breakpoint('<=small') {
+			padding: 5em 2em 2em 2em;
+		}
+
+		@include breakpoint('<=xxsmall') {
+			padding: 5em 1.25em 1.25em 1.25em;
+		}
+	}