diff --git a/_config.yml b/_config.yml index 3be94b4..e855b85 100644 --- a/_config.yml +++ b/_config.yml @@ -8,6 +8,7 @@ url: https://www.bigchaindb.com email: contact: contact@bigchaindb.com + cla: troy@ascribe.io twitter: BigchainDB disqus: bigchain diff --git a/_src/_assets/javascripts/bigchain.js b/_src/_assets/javascripts/bigchain.js index 5c36ce3..cf460e2 100644 --- a/_src/_assets/javascripts/bigchain.js +++ b/_src/_assets/javascripts/bigchain.js @@ -2,10 +2,14 @@ //=include ../../../node_modules/svg4everybody/dist/svg4everybody.js //=include ../../../node_modules/jquery/dist/jquery.js +//=include ../../../node_modules/foundation-sites/js/foundation.core.js +//=include ../../../node_modules/foundation-sites/js/foundation.util.keyboard.js +//=include ../../../node_modules/foundation-sites/js/foundation.tabs.js + //=include bigchain/analytics.js //=include bigchain/forms.js -//=include bigchain/smoothscroll.js //=include bigchain/dnt.js +//=include bigchain/tab.js //=include bigchain/form-earlyaccess.js //=include bigchain/form-contact.js @@ -18,7 +22,6 @@ jQuery(function($) { // init modules // Forms.init(); - SmoothScroll.init(); FormEarlyAccess.init(); FormCla.init(); diff --git a/_src/_assets/javascripts/bigchain/smoothscroll.js b/_src/_assets/javascripts/bigchain/smoothscroll.js index 1c25ac7..e7d1f7d 100644 --- a/_src/_assets/javascripts/bigchain/smoothscroll.js +++ b/_src/_assets/javascripts/bigchain/smoothscroll.js @@ -1,81 +1,58 @@ +// +// https://github.com/bendc/anchor-scroll/blob/master/scroll.min.js +// -var SmoothScroll = (function(w, d) { - - 'use strict'; - - var app, _private, _config; - - // workaround for blog - var $ = jQuery; - - _config = { - win: $(window) - }, - - _private = { - - scrollToTarget: function() { - - // Check window width helper - function isWide() { - return _config.win.width() >= _config.minWidth; - } - - $("a[href*='#']").not("[href='#'], .nav a[href*='#']").click(function(e) { - if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { - var target = $(this.hash); - target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); - - if (target.length) { - e.preventDefault(); - - if (typeof document.body.style.transitionProperty === 'string') { - var avail = $(document).height() - _config.win.height(); - - scroll = target.offset().top; - - if (scroll > avail) { - scroll = avail; - } - - $('html').css({ - 'transform': 'translate3d(0, ' + ( _config.win.scrollTop() - scroll ) + 'px, 0)', - 'transition' : '.6s ease-in-out' - }).data('transitioning', true); - } - else { - // fallback for dumb browsers - $('html, body').animate({ - scrollTop: target.offset().top - }, 600); - } - } - } - }); +document.addEventListener("DOMContentLoaded", function() { + var e = function() { + if ("scrollingElement" in document) return document.scrollingElement; + var a = document.documentElement, + b = a.scrollTop; + a.scrollTop = b + 1; + var c = a.scrollTop; + a.scrollTop = b; + return c > b ? a : document.body + }(), + g = function(a) { + var b = e.scrollTop; + if (2 > a.length) a = -b; + else if (a = document.querySelector(a)) { + a = a.getBoundingClientRect().top; + var c = e.scrollHeight - window.innerHeight; + a = b + a < c ? a : c - b + } else a = void 0; + if (a) return new Map([ + ["start", b], + ["delta", a] + ]) }, - - // - // remove styles after transition has finished - // - removeStyles: function() { - - $('html').on('transitionend webkitTransitionEnd msTransitionEnd oTransitionEnd', function (e) { - if (e.target == e.currentTarget && $(this).data('transitioning') === true) { - $(this).removeAttr('style').data('transitioning', false); - $('html, body').scrollTop(scroll); - return; - } + h = function(a) { + var b = + a.getAttribute("href"), + c = g(b); + if (c) { + var d = new Map([ + ["duration", 800] + ]), + k = performance.now(); + requestAnimationFrame(function l(a) { + d.set("elapsed", a - k); + a = d.get("duration"); + var f = d.get("elapsed"), + g = c.get("start"), + h = c.get("delta"); + e.scrollTop = Math.round(h * (-Math.pow(2, -10 * f / a) + 1) + g); + d.get("elapsed") < d.get("duration") ? requestAnimationFrame(l) : (history.pushState(null, null, b), e.scrollTop = c.get("start") + c.get("delta")) + }) + } + }, + f = document.querySelectorAll("a.scroll"); + (function b(c, d) { + var e = c.item(d); + e.addEventListener("click", + function(b) { + b.preventDefault(); + h(e) }); - } - }; - - app = { - init: function() { - _private.scrollToTarget(); - _private.removeStyles(); - } - }; - - return app; - -})(window, document); + if (d) return b(c, d - 1) + })(f, f.length - 1) +}); diff --git a/_src/_assets/javascripts/bigchain/tab.js b/_src/_assets/javascripts/bigchain/tab.js new file mode 100644 index 0000000..ae30225 --- /dev/null +++ b/_src/_assets/javascripts/bigchain/tab.js @@ -0,0 +1,421 @@ +'use strict'; + +var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ('value' in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })(); + +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError('Cannot call a class as a function'); } } + +/** + * -------------------------------------------------------------------------- + * Bootstrap (v4.0.0-alpha.2): tab.js + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + * -------------------------------------------------------------------------- + */ + +var Tab = (function ($) { + + /** + * ------------------------------------------------------------------------ + * Constants + * ------------------------------------------------------------------------ + */ + + var NAME = 'tab'; + var VERSION = '4.0.0-alpha.2'; + var DATA_KEY = 'bs.tab'; + var EVENT_KEY = '.' + DATA_KEY; + var DATA_API_KEY = '.data-api'; + var JQUERY_NO_CONFLICT = $.fn[NAME]; + var TRANSITION_DURATION = 150; + + var Event = { + HIDE: 'hide' + EVENT_KEY, + HIDDEN: 'hidden' + EVENT_KEY, + SHOW: 'show' + EVENT_KEY, + SHOWN: 'shown' + EVENT_KEY, + CLICK_DATA_API: 'click' + EVENT_KEY + DATA_API_KEY + }; + + var ClassName = { + DROPDOWN_MENU: 'dropdown-menu', + ACTIVE: 'active', + FADE: 'fade', + IN: 'in' + }; + + var Selector = { + A: 'a', + LI: 'li', + DROPDOWN: '.dropdown', + UL: 'ul:not(.dropdown-menu)', + FADE_CHILD: '> .nav-item .fade, > .fade', + ACTIVE: '.active', + ACTIVE_CHILD: '> .nav-item > .active, > .active', + DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"]', + DROPDOWN_TOGGLE: '.dropdown-toggle', + DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu .active' + }; + + /** + * ------------------------------------------------------------------------ + * Class Definition + * ------------------------------------------------------------------------ + */ + + var Tab = (function () { + function Tab(element) { + _classCallCheck(this, Tab); + + this._element = element; + } + + /** + * ------------------------------------------------------------------------ + * Data Api implementation + * ------------------------------------------------------------------------ + */ + + // getters + + _createClass(Tab, [{ + key: 'show', + + // public + + value: function show() { + var _this = this; + + if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE)) { + return; + } + + var target = undefined; + var previous = undefined; + var ulElement = $(this._element).closest(Selector.UL)[0]; + var selector = Util.getSelectorFromElement(this._element); + + if (ulElement) { + previous = $.makeArray($(ulElement).find(Selector.ACTIVE)); + previous = previous[previous.length - 1]; + } + + var hideEvent = $.Event(Event.HIDE, { + relatedTarget: this._element + }); + + var showEvent = $.Event(Event.SHOW, { + relatedTarget: previous + }); + + if (previous) { + $(previous).trigger(hideEvent); + } + + $(this._element).trigger(showEvent); + + if (showEvent.isDefaultPrevented() || hideEvent.isDefaultPrevented()) { + return; + } + + if (selector) { + target = $(selector)[0]; + } + + this._activate(this._element, ulElement); + + var complete = function complete() { + var hiddenEvent = $.Event(Event.HIDDEN, { + relatedTarget: _this._element + }); + + var shownEvent = $.Event(Event.SHOWN, { + relatedTarget: previous + }); + + $(previous).trigger(hiddenEvent); + $(_this._element).trigger(shownEvent); + }; + + if (target) { + this._activate(target, target.parentNode, complete); + } else { + complete(); + } + } + }, { + key: 'dispose', + value: function dispose() { + $.removeClass(this._element, DATA_KEY); + this._element = null; + } + + // private + + }, { + key: '_activate', + value: function _activate(element, container, callback) { + var active = $(container).find(Selector.ACTIVE_CHILD)[0]; + var isTransitioning = callback && Util.supportsTransitionEnd() && (active && $(active).hasClass(ClassName.FADE) || Boolean($(container).find(Selector.FADE_CHILD)[0])); + + var complete = $.proxy(this._transitionComplete, this, element, active, isTransitioning, callback); + + if (active && isTransitioning) { + $(active).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION); + } else { + complete(); + } + + if (active) { + $(active).removeClass(ClassName.IN); + } + } + }, { + key: '_transitionComplete', + value: function _transitionComplete(element, active, isTransitioning, callback) { + if (active) { + $(active).removeClass(ClassName.ACTIVE); + + var dropdownChild = $(active).find(Selector.DROPDOWN_ACTIVE_CHILD)[0]; + + if (dropdownChild) { + $(dropdownChild).removeClass(ClassName.ACTIVE); + } + + active.setAttribute('aria-expanded', false); + } + + $(element).addClass(ClassName.ACTIVE); + element.setAttribute('aria-expanded', true); + + if (isTransitioning) { + Util.reflow(element); + $(element).addClass(ClassName.IN); + } else { + $(element).removeClass(ClassName.FADE); + } + + if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) { + + var dropdownElement = $(element).closest(Selector.DROPDOWN)[0]; + if (dropdownElement) { + $(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE); + } + + element.setAttribute('aria-expanded', true); + } + + if (callback) { + callback(); + } + } + + // static + + }], [{ + key: '_jQueryInterface', + value: function _jQueryInterface(config) { + return this.each(function () { + var $this = $(this); + var data = $this.data(DATA_KEY); + + if (!data) { + data = data = new Tab(this); + $this.data(DATA_KEY, data); + } + + if (typeof config === 'string') { + if (data[config] === undefined) { + throw new Error('No method named "' + config + '"'); + } + data[config](); + } + }); + } + }, { + key: 'VERSION', + get: function get() { + return VERSION; + } + }]); + + return Tab; + })(); + + $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) { + event.preventDefault(); + Tab._jQueryInterface.call($(this), 'show'); + }); + + /** + * ------------------------------------------------------------------------ + * jQuery + * ------------------------------------------------------------------------ + */ + + $.fn[NAME] = Tab._jQueryInterface; + $.fn[NAME].Constructor = Tab; + $.fn[NAME].noConflict = function () { + $.fn[NAME] = JQUERY_NO_CONFLICT; + return Tab._jQueryInterface; + }; + + return Tab; +})(jQuery); + +/** + * -------------------------------------------------------------------------- + * Bootstrap (v4.0.0-alpha.2): util.js + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + * -------------------------------------------------------------------------- + */ + +'use strict'; + +var Util = (function ($) { + + /** + * ------------------------------------------------------------------------ + * Private TransitionEnd Helpers + * ------------------------------------------------------------------------ + */ + + var transition = false; + + var TransitionEndEvent = { + WebkitTransition: 'webkitTransitionEnd', + MozTransition: 'transitionend', + OTransition: 'oTransitionEnd otransitionend', + transition: 'transitionend' + }; + + // shoutout AngusCroll (https://goo.gl/pxwQGp) + function toType(obj) { + return ({}).toString.call(obj).match(/\s([a-zA-Z]+)/)[1].toLowerCase(); + } + + function isElement(obj) { + return (obj[0] || obj).nodeType; + } + + function getSpecialTransitionEndEvent() { + return { + bindType: transition.end, + delegateType: transition.end, + handle: function handle(event) { + if ($(event.target).is(this)) { + return event.handleObj.handler.apply(this, arguments); + } + } + }; + } + + function transitionEndTest() { + if (window.QUnit) { + return false; + } + + var el = document.createElement('bootstrap'); + + for (var _name in TransitionEndEvent) { + if (el.style[_name] !== undefined) { + return { end: TransitionEndEvent[_name] }; + } + } + + return false; + } + + function transitionEndEmulator(duration) { + var _this = this; + + var called = false; + + $(this).one(Util.TRANSITION_END, function () { + called = true; + }); + + setTimeout(function () { + if (!called) { + Util.triggerTransitionEnd(_this); + } + }, duration); + + return this; + } + + function setTransitionEndSupport() { + transition = transitionEndTest(); + + $.fn.emulateTransitionEnd = transitionEndEmulator; + + if (Util.supportsTransitionEnd()) { + $.event.special[Util.TRANSITION_END] = getSpecialTransitionEndEvent(); + } + } + + /** + * -------------------------------------------------------------------------- + * Public Util Api + * -------------------------------------------------------------------------- + */ + + var Util = { + + TRANSITION_END: 'bsTransitionEnd', + + getUID: function getUID(prefix) { + do { + /* eslint-disable no-bitwise */ + prefix += ~ ~(Math.random() * 1000000); // "~~" acts like a faster Math.floor() here + /* eslint-enable no-bitwise */ + } while (document.getElementById(prefix)); + return prefix; + }, + + getSelectorFromElement: function getSelectorFromElement(element) { + var selector = element.getAttribute('data-target'); + + if (!selector) { + selector = element.getAttribute('href') || ''; + selector = /^#[a-z]/i.test(selector) ? selector : null; + } + + return selector; + }, + + reflow: function reflow(element) { + new Function('bs', 'return bs')(element.offsetHeight); + }, + + triggerTransitionEnd: function triggerTransitionEnd(element) { + $(element).trigger(transition.end); + }, + + supportsTransitionEnd: function supportsTransitionEnd() { + return Boolean(transition); + }, + + typeCheckConfig: function typeCheckConfig(componentName, config, configTypes) { + for (var property in configTypes) { + if (configTypes.hasOwnProperty(property)) { + var expectedTypes = configTypes[property]; + var value = config[property]; + var valueType = undefined; + + if (value && isElement(value)) { + valueType = 'element'; + } else { + valueType = toType(value); + } + + if (!new RegExp(expectedTypes).test(valueType)) { + throw new Error(componentName.toUpperCase() + ': ' + ('Option "' + property + '" provided type "' + valueType + '" ') + ('but expected type "' + expectedTypes + '".')); + } + } + } + } + }; + + setTransitionEndSupport(); + + return Util; +})(jQuery); diff --git a/_src/_assets/javascripts/page-front.js b/_src/_assets/javascripts/page-front.js new file mode 100644 index 0000000..4e8e122 --- /dev/null +++ b/_src/_assets/javascripts/page-front.js @@ -0,0 +1,2 @@ + +//=include bigchain/smoothscroll.js diff --git a/_src/_assets/styles/bigchain.scss b/_src/_assets/styles/bigchain.scss index 97e0e01..5c7d5e1 100644 --- a/_src/_assets/styles/bigchain.scss +++ b/_src/_assets/styles/bigchain.scss @@ -24,6 +24,7 @@ @import 'bigchain/_media'; @import 'bigchain/_sections'; @import 'bigchain/_menus'; +@import 'bigchain/_tabs'; @import 'bigchain/_alerts'; @import 'bigchain/_code'; @import 'bigchain/_syntax'; @@ -48,3 +49,4 @@ @import 'page-features'; @import 'page-community'; @import 'page-contact'; +@import 'page-cla'; diff --git a/_src/_assets/styles/bigchain/_forms.scss b/_src/_assets/styles/bigchain/_forms.scss index ba4289b..62c0d3b 100644 --- a/_src/_assets/styles/bigchain/_forms.scss +++ b/_src/_assets/styles/bigchain/_forms.scss @@ -139,7 +139,7 @@ width: 1.3rem; height: 1.3rem; - border-radius: 50%; + border-radius: $border-radius; border: 2px solid $input-border-color; outline: none; @@ -153,6 +153,11 @@ } } +.radio input[type="radio"], +.radio-inline input[type="radio"] { + border-radius: 50%; +} + .radio + .radio, .checkbox + .checkbox { // Move up sibling radios or checkboxes for tighter spacing diff --git a/_src/_assets/styles/bigchain/_tabs.scss b/_src/_assets/styles/bigchain/_tabs.scss new file mode 100644 index 0000000..48ab7dc --- /dev/null +++ b/_src/_assets/styles/bigchain/_tabs.scss @@ -0,0 +1,31 @@ + +.nav-tabs { + @extend .list-unstyled; + display: flex; + border-bottom: 1px solid $brand-primary; +} + +.nav-item { + flex: 1; +} + +.nav-link { + @extend .text-center; + box-shadow: none; + display: block; + padding: 1rem; + border-bottom: 4px solid transparent; + + &.active { + color: #fff; + border-bottom-color: $brand-primary; + } +} + +.tab-pane { + display: none; + + &.active { + display: block; + } +} diff --git a/_src/_assets/styles/page-cla.scss b/_src/_assets/styles/page-cla.scss new file mode 100644 index 0000000..821a782 --- /dev/null +++ b/_src/_assets/styles/page-cla.scss @@ -0,0 +1,5 @@ + +.form-cla { + padding: $spacer ($spacer * 2); + background: $gray-darker; +} diff --git a/_src/_includes/form-cla.html b/_src/_includes/form-cla.html index ebafd63..76681e7 100644 --- a/_src/_includes/form-cla.html +++ b/_src/_includes/form-cla.html @@ -1,116 +1,121 @@ -