@fishtank/fishtank-vue
Version:
[Fish Tank VueJS Component Module](https://fishtank.bna.com)
1,309 lines (1,094 loc) • 762 kB
JavaScript
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
var Vue = _interopDefault(require('vue'));
var __vue_normalize__ = _interopDefault(require('vue-runtime-helpers/dist/normalize-component.js'));
var __vue_create_injector__ = _interopDefault(require('vue-runtime-helpers/dist/inject-style/browser.js'));
var iconsVue = require('@fishtank/icons-vue');
var defineProperty = _interopDefault(require('core-js/library/fn/object/define-property'));
var iterator = _interopDefault(require('core-js/library/fn/symbol/iterator'));
var symbol = _interopDefault(require('core-js/library/fn/symbol'));
var getPrototypeOf = _interopDefault(require('core-js/library/fn/object/get-prototype-of'));
var setPrototypeOf = _interopDefault(require('core-js/library/fn/object/set-prototype-of'));
var create = _interopDefault(require('core-js/library/fn/object/create'));
var tslib_1 = require('tslib');
var vuePropertyDecorator = require('vue-property-decorator');
require('core-js/modules/es6.regexp.to-string');
require('core-js/modules/es6.function.name');
var isArray = _interopDefault(require('core-js/library/fn/array/is-array'));
var from = _interopDefault(require('core-js/library/fn/array/from'));
var isIterable = _interopDefault(require('core-js/library/fn/is-iterable'));
require('core-js/modules/es6.object.keys');
require('core-js/modules/es6.array.sort');
require('core-js/modules/es6.array.from');
require('core-js/modules/web.dom.iterable');
require('core-js/modules/es6.string.iterator');
require('core-js/modules/es6.set');
var _ = _interopDefault(require('lodash'));
require('core-js/modules/es6.regexp.replace');
var ftColorsObj = _interopDefault(require('@fishtank/colors/dist/text.common.js'));
require('core-js/modules/es6.number.constructor');
require('core-js/modules/es6.regexp.split');
require('core-js/modules/es6.string.fixed');
var vueClassComponent = require('vue-class-component');
var colors = require('@fishtank/colors/dist/index.common');
var colors__default = colors['default'];
require('core-js/modules/es6.string.small');
var getIterator = _interopDefault(require('core-js/library/fn/get-iterator'));
var VueJsPaginate = require('vuejs-paginate');
var vueContentLoader = require('vue-content-loader');
require('core-js/modules/es7.symbol.async-iterator');
require('core-js/modules/es6.symbol');
var ftColorsObj$1 = _interopDefault(require('@fishtank/colors/dist/heading.common.js'));
require('core-js/modules/es6.array.find');
require('core-js/modules/es6.string.anchor');
var Popper = _interopDefault(require('popper.js'));
var vueClickaway = require('vue-clickaway');
var axios = _interopDefault(require('axios'));
require('core-js/modules/es6.regexp.constructor');
var VTooltip = _interopDefault(require('v-tooltip'));
require('core-js/modules/es7.object.get-own-property-descriptors');
var script = Vue.extend({
name: "BaseAlert",
props: {
heading: {
type: String,
required: true
}
},
computed: {
hasIcon: function hasIcon() {
return !!this.$slots.icon;
}
}
});
/* script */
var __vue_script__ = script;
/* template */
var __vue_render__ = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("div", {
class: _vm.$style.alert
}, [_vm.hasIcon ? _c("div", {
class: _vm.$style.icon
}, [_vm._t("icon")], 2) : _vm._e(), _vm._v(" "), _c("div", {
class: _vm.hasIcon ? _vm.$style.contentWIcon : _vm.$style.content
}, [_c("div", {
class: _vm.$style.heading
}, [_vm._v(_vm._s(_vm.heading))]), _vm._v(" "), _vm._t("default")], 2)]);
};
var __vue_staticRenderFns__ = [];
__vue_render__._withStripped = true;
/* style */
var __vue_inject_styles__ = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-56e99658_0", {
source: ".ft-alert-EqSB {\n padding: 0.75rem;\n position: relative;\n border-color: #292E31;\n border-width: 1px;\n border-style: solid;\n}\n.ft-icon-1qwv {\n position: absolute;\n}\n.ft-icon-1qwv svg {\n height: 2rem;\n width: 2rem;\n}\n.ft-contentWIcon-1StY {\n margin-left: 2.75rem;\n}\n.ft-content-yzHv {\n font-size: 0.75rem;\n line-height: 1rem;\n margin-left: 0.75rem;\n}\n.ft-heading-1j03 {\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 600;\n margin-bottom: 0.5rem;\n}\n",
map: undefined,
media: undefined
});
Object.defineProperty(this, "$style", {
value: {
"alert": "ft-alert-EqSB",
"icon": "ft-icon-1qwv",
"contentWIcon": "ft-contentWIcon-1StY",
"content": "ft-content-yzHv",
"heading": "ft-heading-1j03"
}
});
};
/* scoped */
var __vue_scope_id__ = undefined;
/* module identifier */
var __vue_module_identifier__ = undefined;
/* functional template */
var __vue_is_functional_template__ = false;
/* style inject SSR */
var BaseAlert = __vue_normalize__({
render: __vue_render__,
staticRenderFns: __vue_staticRenderFns__
}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, __vue_create_injector__, undefined);
var script$1 = {
name: "AlertError",
components: {
BaseAlert: BaseAlert,
WarningIcon: iconsVue.Warning32
},
props: {
heading: {
type: String,
required: true
}
}
};
/* script */
var __vue_script__$1 = script$1;
/* template */
var __vue_render__$1 = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("base-alert", {
class: _vm.$style.error,
attrs: {
heading: _vm.heading
}
}, [_c("WarningIcon", {
class: _vm.$style.icon,
attrs: {
slot: "icon",
scale: 1
},
slot: "icon"
}), _vm._v(" "), _vm._t("default")], 2);
};
var __vue_staticRenderFns__$1 = [];
__vue_render__$1._withStripped = true;
/* style */
var __vue_inject_styles__$1 = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-70da196a_0", {
source: ".ft-error-1UNG {\n background-color: #FBECEB;\n border-color: #E1483E;\n}\n.ft-error-1UNG .ft-icon-2GHs {\n color: #E1483E;\n}\n",
map: undefined,
media: undefined
});
Object.defineProperty(this, "$style", {
value: {
"error": "ft-error-1UNG",
"icon": "ft-icon-2GHs"
}
});
};
/* scoped */
var __vue_scope_id__$1 = undefined;
/* module identifier */
var __vue_module_identifier__$1 = undefined;
/* functional template */
var __vue_is_functional_template__$1 = false;
/* style inject SSR */
var AlertError = __vue_normalize__({
render: __vue_render__$1,
staticRenderFns: __vue_staticRenderFns__$1
}, __vue_inject_styles__$1, __vue_script__$1, __vue_scope_id__$1, __vue_is_functional_template__$1, __vue_module_identifier__$1, __vue_create_injector__, undefined);
var script$2 = Vue.extend({
name: "AlertInfo",
components: {
BaseAlert: BaseAlert
},
props: {
heading: {
type: String,
required: true
}
}
});
/* script */
var __vue_script__$2 = script$2;
/* template */
var __vue_render__$2 = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("base-alert", {
class: _vm.$style.info,
attrs: {
heading: _vm.heading
}
}, [_vm._t("default")], 2);
};
var __vue_staticRenderFns__$2 = [];
__vue_render__$2._withStripped = true;
/* style */
var __vue_inject_styles__$2 = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-698eea9e_0", {
source: ".ft-info-15HG {\n background-color: #E7F5FB;\n border-color: #0D9DDB;\n}\n",
map: undefined,
media: undefined
});
Object.defineProperty(this, "$style", {
value: {
"info": "ft-info-15HG"
}
});
};
/* scoped */
var __vue_scope_id__$2 = undefined;
/* module identifier */
var __vue_module_identifier__$2 = undefined;
/* functional template */
var __vue_is_functional_template__$2 = false;
/* style inject SSR */
var AlertInfo = __vue_normalize__({
render: __vue_render__$2,
staticRenderFns: __vue_staticRenderFns__$2
}, __vue_inject_styles__$2, __vue_script__$2, __vue_scope_id__$2, __vue_is_functional_template__$2, __vue_module_identifier__$2, __vue_create_injector__, undefined);
var script$3 = Vue.extend({
name: "AlertSuccess",
components: {
BaseAlert: BaseAlert
},
props: {
heading: {
type: String,
required: true
}
}
});
/* script */
var __vue_script__$3 = script$3;
/* template */
var __vue_render__$3 = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("base-alert", {
class: _vm.$style.success,
attrs: {
heading: _vm.heading
}
}, [_vm._t("default")], 2);
};
var __vue_staticRenderFns__$3 = [];
__vue_render__$3._withStripped = true;
/* style */
var __vue_inject_styles__$3 = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-3164918f_0", {
source: ".ft-success-30AK {\n background-color: #EBF6F1;\n border-color: #49B88B;\n}\n",
map: undefined,
media: undefined
});
Object.defineProperty(this, "$style", {
value: {
"success": "ft-success-30AK"
}
});
};
/* scoped */
var __vue_scope_id__$3 = undefined;
/* module identifier */
var __vue_module_identifier__$3 = undefined;
/* functional template */
var __vue_is_functional_template__$3 = false;
/* style inject SSR */
var AlertSuccess = __vue_normalize__({
render: __vue_render__$3,
staticRenderFns: __vue_staticRenderFns__$3
}, __vue_inject_styles__$3, __vue_script__$3, __vue_scope_id__$3, __vue_is_functional_template__$3, __vue_module_identifier__$3, __vue_create_injector__, undefined);
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
var defineProperty$1 = defineProperty;
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;
defineProperty$1(target, descriptor.key, descriptor);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
return Constructor;
}
var iterator$1 = iterator;
var symbol$1 = symbol;
function _typeof2(obj) { if (typeof symbol$1 === "function" && typeof iterator$1 === "symbol") { _typeof2 = function _typeof2(obj) { return typeof obj; }; } else { _typeof2 = function _typeof2(obj) { return obj && typeof symbol$1 === "function" && obj.constructor === symbol$1 && obj !== symbol$1.prototype ? "symbol" : typeof obj; }; } return _typeof2(obj); }
function _typeof(obj) {
if (typeof symbol$1 === "function" && _typeof2(iterator$1) === "symbol") {
_typeof = function _typeof(obj) {
return _typeof2(obj);
};
} else {
_typeof = function _typeof(obj) {
return obj && typeof symbol$1 === "function" && obj.constructor === symbol$1 && obj !== symbol$1.prototype ? "symbol" : _typeof2(obj);
};
}
return _typeof(obj);
}
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
function _possibleConstructorReturn(self, call) {
if (call && (_typeof(call) === "object" || typeof call === "function")) {
return call;
}
return _assertThisInitialized(self);
}
var getPrototypeOf$1 = getPrototypeOf;
var setPrototypeOf$1 = setPrototypeOf;
function _getPrototypeOf(o) {
_getPrototypeOf = setPrototypeOf$1 ? getPrototypeOf$1 : function _getPrototypeOf(o) {
return o.__proto__ || getPrototypeOf$1(o);
};
return _getPrototypeOf(o);
}
var create$1 = create;
function _setPrototypeOf(o, p) {
_setPrototypeOf = setPrototypeOf$1 || function _setPrototypeOf(o, p) {
o.__proto__ = p;
return o;
};
return _setPrototypeOf(o, p);
}
function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function");
}
subClass.prototype = create$1(superClass && superClass.prototype, {
constructor: {
value: subClass,
writable: true,
configurable: true
}
});
if (superClass) setPrototypeOf(subClass, superClass);
}
var inputOrientation =
/*#__PURE__*/
function (_Vue) {
_inherits(inputOrientation, _Vue);
function inputOrientation() {
_classCallCheck(this, inputOrientation);
return _possibleConstructorReturn(this, _getPrototypeOf(inputOrientation).apply(this, arguments));
}
return inputOrientation;
}(vuePropertyDecorator.Vue);
tslib_1.__decorate([vuePropertyDecorator.Prop({
type: String,
default: null
})], inputOrientation.prototype, "orientation", void 0);
inputOrientation = tslib_1.__decorate([vuePropertyDecorator.Component({})], inputOrientation);
var orientation = inputOrientation;
var TextInputMixin =
/*#__PURE__*/
function (_Vue) {
_inherits(TextInputMixin, _Vue);
function TextInputMixin() {
_classCallCheck(this, TextInputMixin);
return _possibleConstructorReturn(this, _getPrototypeOf(TextInputMixin).apply(this, arguments));
}
_createClass(TextInputMixin, [{
key: "data",
value: function data() {
return {
identifier: (Math.random() * 10000).toFixed(0).toString(),
isFocused: false
};
}
}, {
key: "showRightIcon",
get: function get() {
return !!this.$slots.rightIcon || this.$props.value && this.$props.value.length > 0;
}
}, {
key: "errorMessage",
get: function get() {
if (!this.error) {
return undefined;
}
if (typeof this.error === "string") {
return this.error;
} else if (this.error.fullMessage) {
return this.error.fullMessage;
} else {
return undefined;
}
}
}]);
return TextInputMixin;
}(vuePropertyDecorator.Vue);
tslib_1.__decorate([vuePropertyDecorator.Prop({
required: false,
type: String,
default: ""
})], TextInputMixin.prototype, "value", void 0);
tslib_1.__decorate([vuePropertyDecorator.Prop({
required: false,
type: String,
default: undefined
})], TextInputMixin.prototype, "label", void 0);
tslib_1.__decorate([vuePropertyDecorator.Prop({
type: String,
default: null,
required: false
})], TextInputMixin.prototype, "id", void 0);
tslib_1.__decorate([vuePropertyDecorator.Prop({
type: Boolean,
default: false,
required: false
})], TextInputMixin.prototype, "required", void 0);
tslib_1.__decorate([vuePropertyDecorator.Prop({
required: false,
default: null,
type: [String, Object],
validator: function validator(value) {
if (typeof value === 'string') {
return true;
}
if (value.fullMessage) {
return true;
} // eslint-disable-next-line no-console
console.warn("InputText's `error` prop should be a string or an object with a `fullMessage` string property");
return false;
}
})], TextInputMixin.prototype, "error", void 0);
TextInputMixin = tslib_1.__decorate([vuePropertyDecorator.Component({})], TextInputMixin);
var textInputMixin = TextInputMixin;
var a11y = Vue.extend({
created: function created() {
window.addEventListener('keydown', this.handleFirstTab);
},
mounted: function mounted() {
this.setBodyAriaForLoader(this);
},
destroyed: function destroyed() {
this.removeBodyAriaForLoader(this);
},
methods: {
handleFirstTab: function handleFirstTab(e) {
if (e.keyCode === 9) {
document.body.classList.add('user-is-tabbing');
window.removeEventListener('keydown', this.handleFirstTab);
window.addEventListener('mousedown', this.handleMouseDownOnce);
}
},
handleMouseDownOnce: function handleMouseDownOnce() {
document.body.classList.remove('user-is-tabbing');
window.removeEventListener('mousedown', this.handleMouseDownOnce);
window.addEventListener('keydown', this.handleFirstTab);
},
setBodyAriaForLoader: function setBodyAriaForLoader(vm) {
if (["FishTankLoaderSpinner", "FishTankLoaderContent"].indexOf(vm.$options.name) >= 0) {
document.body.getAttribute('aria-busy') === null ? document.body.setAttribute('aria-busy', 'true') : document.body.getAttribute('aria-busy') === 'false' ? document.body.setAttribute('aria-busy', 'true') : null;
}
},
removeBodyAriaForLoader: function removeBodyAriaForLoader(vm) {
if (["FishTankLoaderSpinner", "FishTankLoaderContent"].indexOf(vm.$options.name) >= 0) {
document.body.getAttribute('aria-busy') === null ? null : document.body.setAttribute('aria-busy', 'false');
}
}
}
});
var boxMixin = {
props: {// tag:{
// default:'div',
// required:false,
// type:String,
// validator: function (value: IsBoxType) {
// return ["div", "span", "section", "article", "aside", "footer", "header", "details", "figcaption", "figure", "main", "nav", "summary", "time"].indexOf(value) !== -1
// },
// description:"Box semantic element"
// },
// as:{
// default:'div',
// required:false,
// type:String,
// validator: function (value: IsBoxType) {
// return ["div", "span", "section", "article", "aside", "footer", "header", "details", "figcaption", "figure", "main", "nav", "summary", "time"].indexOf(value) !== -1
// },
// description:"Box semantic element"
// },
// column: {
// type:Number,
// default:undefined,
// required:false,
// validator: function(value: Column){
// return (0<value && 13>value)
// },
// description:'Box grid columns; maps to xs-column grid',
// },
// // Column, /* 1 -12 */
// // // @Prop()
// xsColumn: {
// type:Number,
// default:null,
// required:false,
// validator: function(value: Column){
// return (0<value && 13>value)
// },
// description:'Box grid columns - XS Breakpoint',
// },
// // xsColumn, /* 1 -12 */
// // // @Prop()
// smColumn: {
// type:Number,
// default:null,
// required:false,
// validator: function(value: Column){
// return (0<value && 13>value)
// },
// description:'Box grid columns - SM Breakpoint',
// },
// // smColumn, /* 1 -12 */
// // // @Prop()
// mdColumn: {
// type:Number,
// default:null,
// required:false,
// validator: function(value: Column){
// return (0<value && 13>value)
// },
// description:'Box grid columns - MD Breakpoint',
// },
// // mdColumn, /* 1 -12 */
// // // @Prop()
// lgColumn: {
// type:Number,
// default:null,
// required:false,
// validator: function(value: Column){
// return (0<value && 13>value)
// },
// description:'Box grid columns - LG Breakpoint',
// },
// // lgColumn, /* 1 -12 */
// // // @Prop()
// xlColumn: {
// type:Number,
// default:null,
// required:false,
// validator: function(value: Column){
// return (0<value && 13>value)
// },
// description:'Box grid columns - LG Breakpoint',
// },
// // xlColumn, /* 1 -12 */
// // // @Prop()
},
computed: {
tagElement: function tagElement() {
return this.as === undefined ? this.tag : this.as;
}
}
};
var FishTankBaseButton =
/*#__PURE__*/
function (_Vue) {
_inherits(FishTankBaseButton, _Vue);
function FishTankBaseButton() {
_classCallCheck(this, FishTankBaseButton);
return _possibleConstructorReturn(this, _getPrototypeOf(FishTankBaseButton).apply(this, arguments));
}
_createClass(FishTankBaseButton, [{
key: "listeners",
// computed functions
get: function get() {
var _this = this;
return Object.assign({}, this.$listeners, {
click: function click($event) {
if (_this.disabled) return;
/**
* Mouse click event.
* @event click
* @type {Event}
*/
_this.$emit("click", $event);
}
});
}
}]);
return FishTankBaseButton;
}(vuePropertyDecorator.Vue);
tslib_1.__decorate([vuePropertyDecorator.Prop({
default: false,
type: Boolean
})], FishTankBaseButton.prototype, "disabled", void 0);
tslib_1.__decorate([vuePropertyDecorator.Prop({
default: false,
type: Boolean
})], FishTankBaseButton.prototype, "block", void 0);
tslib_1.__decorate([vuePropertyDecorator.Prop({
type: String,
default: "",
required: false
})], FishTankBaseButton.prototype, "name", void 0);
FishTankBaseButton = tslib_1.__decorate([vuePropertyDecorator.Component({
mixins: [a11y]
})], FishTankBaseButton);
var script$4 = FishTankBaseButton;
/* script */
var __vue_script__$4 = script$4;
/* template */
var __vue_render__$4 = function __vue_render__() {
var _obj;
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("button", _vm._g({
class: (_obj = {}, _obj[_vm.$style.button] = true, _obj[_vm.$style.buttonDisabled] = _vm.disabled, _obj[_vm.$style.buttonBlock] = _vm.block, _obj),
attrs: {
disabled: _vm.disabled,
type: "button"
}
}, _vm.$listeners), [_vm._t("default")], 2);
};
var __vue_staticRenderFns__$4 = [];
__vue_render__$4._withStripped = true;
/* style */
var __vue_inject_styles__$4 = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-14cfcf83_0", {
source: "body.ft-user-is-tabbing-2mDK button:focus {\n -webkit-box-shadow: 0 0 0 2px #0D9DDB;\n box-shadow: 0 0 0 2px #0D9DDB;\n}\n.ft-baseButton-3d8c {\n font-size: 1rem;\n line-height: 1.5rem;\n font-family: \"OpenSans\", arial, sans-serif;\n font-weight: 600;\n padding: 6px 11px 10px 11px;\n height: 2.5rem;\n}\n.ft-baseButtonSm-3p0F {\n font-size: 0.75rem;\n line-height: 1rem;\n font-family: \"OpenSans\", arial, sans-serif;\n font-weight: 600;\n padding: 7px 11px 9px 11px;\n height: 2.5rem;\n}\n.ft-button-2Pla {\n font-size: 1rem;\n line-height: 1.5rem;\n font-family: \"OpenSans\", arial, sans-serif;\n font-weight: 600;\n padding: 6px 11px 10px 11px;\n height: 2.5rem;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n border-radius: 2px;\n border-width: 1px;\n border-style: solid;\n outline: none;\n}\n.ft-button-2Pla:active, .ft-button-2Pla:hover {\n cursor: pointer;\n}\n.ft-button-2Pla:active:disabled, .ft-button-2Pla:hover:disabled {\n cursor: default;\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n.ft-button-2Pla:active {\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n.ft-buttonBlock-311V {\n display: block;\n width: 100%;\n}\n",
map: undefined,
media: undefined
});
Object.defineProperty(this, "$style", {
value: {
"user-is-tabbing": "ft-user-is-tabbing-2mDK",
"baseButton": "ft-baseButton-3d8c",
"baseButtonSm": "ft-baseButtonSm-3p0F",
"button": "ft-button-2Pla",
"buttonBlock": "ft-buttonBlock-311V"
}
});
};
/* scoped */
var __vue_scope_id__$4 = undefined;
/* module identifier */
var __vue_module_identifier__$4 = undefined;
/* functional template */
var __vue_is_functional_template__$4 = false;
/* style inject SSR */
var FishTankBaseButton$1 = __vue_normalize__({
render: __vue_render__$4,
staticRenderFns: __vue_staticRenderFns__$4
}, __vue_inject_styles__$4, __vue_script__$4, __vue_scope_id__$4, __vue_is_functional_template__$4, __vue_module_identifier__$4, __vue_create_injector__, undefined);
/**
* FishTankButtonPrimary
* @deprecated
* This component is being deprecated in favor of FishTankButton.
* It will be removed from the library in October 2019.
* FishTankButton offers a more standard and consistant API, and better code quality.
* Please begin using FishTankButton to avoid any breaking changes.
*/
var script$5 = Vue.extend({
name: "FishTankButtonPrimary",
components: {
FishTankBaseButton: FishTankBaseButton$1
},
mounted: function mounted() {
// eslint-disable-next-line no-console
console.warn('FishTankButtonPrimary is being deprecated in favor of FishTankButton. It will be removed from the library in October 2019. Please migrate to FishTankButton.');
}
});
/* script */
var __vue_script__$5 = script$5;
/* template */
var __vue_render__$5 = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("fish-tank-base-button", _vm._g(_vm._b({
staticClass: "button--primary"
}, "fish-tank-base-button", _vm.$attrs, false), _vm.$listeners), [_vm._t("default")], 2);
};
var __vue_staticRenderFns__$5 = [];
__vue_render__$5._withStripped = true;
/* style */
var __vue_inject_styles__$5 = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-47acd396_0", {
source: ".button--primary {\n background-color: #3DA774;\n border-color: #30855C;\n color: #FFFFFF;\n -webkit-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(61, 167, 116, 0.5), 0 10px 15px -8px rgba(0, 0, 0, 0.2);\n box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(61, 167, 116, 0.5), 0 10px 15px -8px rgba(0, 0, 0, 0.2);\n}\n.button--primary:disabled {\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n.button--primary:hover {\n -webkit-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(61, 167, 116, 0.6), 0 10px 15px -8px rgba(0, 0, 0, 0.3);\n box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(61, 167, 116, 0.6), 0 10px 15px -8px rgba(0, 0, 0, 0.3);\n}\n.button--primary:hover {\n background-color: #49B88B;\n}\n.button--primary:active {\n background-color: #399E6E;\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n.button--primary:disabled {\n opacity: 0.4;\n}\n.button--primary:disabled:hover {\n background-color: #3DA774;\n}\n",
map: undefined,
media: undefined
});
};
/* scoped */
var __vue_scope_id__$5 = undefined;
/* module identifier */
var __vue_module_identifier__$5 = undefined;
/* functional template */
var __vue_is_functional_template__$5 = false;
/* style inject SSR */
var FishTankButtonPrimary = __vue_normalize__({
render: __vue_render__$5,
staticRenderFns: __vue_staticRenderFns__$5
}, __vue_inject_styles__$5, __vue_script__$5, __vue_scope_id__$5, __vue_is_functional_template__$5, __vue_module_identifier__$5, __vue_create_injector__, undefined);
/**
* FishTankButtonSecondary
* @deprecated
* This component is being deprecated in favor of FishTankButton.
* It will be removed from the library in October 2019.
* FishTankButton offers a more standard and consistant API, and better code quality.
* Please begin using FishTankButton to avoid any breaking changes.
*/
var script$6 = Vue.extend({
name: "FishTankButtonSecondary",
components: {
FishTankBaseButton: FishTankBaseButton$1
},
mounted: function mounted() {
// eslint-disable-next-line no-console
console.warn('FishTankButtonSecondary is being deprecated in favor of FishTankButton. It will be removed from the library in October 2019. Please migrate to FishTankButton.');
}
});
/* script */
var __vue_script__$6 = script$6;
/* template */
var __vue_render__$6 = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("fish-tank-base-button", _vm._g(_vm._b({
staticClass: "button--secondary"
}, "fish-tank-base-button", _vm.$attrs, false), _vm.$listeners), [_vm._t("default")], 2);
};
var __vue_staticRenderFns__$6 = [];
__vue_render__$6._withStripped = true;
/* style */
var __vue_inject_styles__$6 = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-677a9965_0", {
source: ".button--secondary {\n background-color: #EDF2F5;\n border-color: #C5CACD;\n color: #505558;\n font-weight: 400;\n -webkit-box-shadow: inset 0 -1px 0 0px rgba(0, 0, 0, 0.08), inset 0 1px 0 0px rgba(255, 255, 255, 0.5), 0 3px 1px -2px rgba(237, 242, 245, 0.5), 0 4px 3px -2px rgba(0, 0, 0, 0.15);\n box-shadow: inset 0 -1px 0 0px rgba(0, 0, 0, 0.08), inset 0 1px 0 0px rgba(255, 255, 255, 0.5), 0 3px 1px -2px rgba(237, 242, 245, 0.5), 0 4px 3px -2px rgba(0, 0, 0, 0.15);\n}\n.button--secondary:hover {\n background-color: #F6F8FA;\n color: #292E31;\n -webkit-box-shadow: inset 0 -1px 0 0px rgba(0, 0, 0, 0.08), inset 0 1px 0 0px rgba(255, 255, 255, 0.5), 0 3px 1px -2px rgba(237, 242, 245, 0.6), 0 4px 3px -2px rgba(0, 0, 0, 0.2);\n box-shadow: inset 0 -1px 0 0px rgba(0, 0, 0, 0.08), inset 0 1px 0 0px rgba(255, 255, 255, 0.5), 0 3px 1px -2px rgba(237, 242, 245, 0.6), 0 4px 3px -2px rgba(0, 0, 0, 0.2);\n}\n.button--secondary:active {\n background-color: #E0E5E8;\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n.button--secondary:disabled {\n color: #C5CACD;\n border-color: #C5CACD;\n background-color: #EDF2F5;\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n.button--secondary:disabled:hover {\n background-color: #EDF2F5;\n}\n",
map: undefined,
media: undefined
});
};
/* scoped */
var __vue_scope_id__$6 = undefined;
/* module identifier */
var __vue_module_identifier__$6 = undefined;
/* functional template */
var __vue_is_functional_template__$6 = false;
/* style inject SSR */
var FishTankButtonSecondary = __vue_normalize__({
render: __vue_render__$6,
staticRenderFns: __vue_staticRenderFns__$6
}, __vue_inject_styles__$6, __vue_script__$6, __vue_scope_id__$6, __vue_is_functional_template__$6, __vue_module_identifier__$6, __vue_create_injector__, undefined);
/**
* FishTankButtonDestructive
* @deprecated
* This component is being deprecated in favor of FishTankButton.
* It will be removed from the library in October 2019.
* FishTankButton offers a more standard and consistant API, and better code quality.
* Please begin using FishTankButton to avoid any breaking changes.
*/
var script$7 = Vue.extend({
name: "FishTankButtonDestructive",
introduction: "Destructive Button",
components: {
FishTankBaseButton: FishTankBaseButton$1
},
mounted: function mounted() {
// eslint-disable-next-line no-console
console.warn('FishTankButtonDestructive is being deprecated in favor of FishTankButton. It will be removed from the library in October 2019. Please migrate to FishTankButton.');
}
});
/* script */
var __vue_script__$7 = script$7;
/* template */
var __vue_render__$7 = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("fish-tank-base-button", _vm._g(_vm._b({
staticClass: "button--destructive"
}, "fish-tank-base-button", _vm.$attrs, false), _vm.$listeners), [_vm._t("default")], 2);
};
var __vue_staticRenderFns__$7 = [];
__vue_render__$7._withStripped = true;
/* style */
var __vue_inject_styles__$7 = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-473557d4_0", {
source: ".button--destructive {\n background-color: #E1483E;\n border-color: #B43931;\n color: #FFFFFF;\n -webkit-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(225, 72, 62, 0.5), 0 10px 15px -8px rgba(0, 0, 0, 0.2);\n box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(225, 72, 62, 0.5), 0 10px 15px -8px rgba(0, 0, 0, 0.2);\n}\n.button--destructive:disabled {\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n.button--destructive:hover {\n -webkit-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(225, 72, 62, 0.6), 0 10px 15px -8px rgba(0, 0, 0, 0.3);\n box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(225, 72, 62, 0.6), 0 10px 15px -8px rgba(0, 0, 0, 0.3);\n}\n.button--destructive:hover {\n background-color: #E7564A;\n}\n.button--destructive:active {\n background-color: #D5443A;\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n.button--destructive:disabled {\n opacity: 0.4;\n}\n.button--destructive:disabled:hover {\n background-color: #E1483E;\n}\n",
map: undefined,
media: undefined
});
};
/* scoped */
var __vue_scope_id__$7 = undefined;
/* module identifier */
var __vue_module_identifier__$7 = undefined;
/* functional template */
var __vue_is_functional_template__$7 = false;
/* style inject SSR */
var FishTankButtonDestructive = __vue_normalize__({
render: __vue_render__$7,
staticRenderFns: __vue_staticRenderFns__$7
}, __vue_inject_styles__$7, __vue_script__$7, __vue_scope_id__$7, __vue_is_functional_template__$7, __vue_module_identifier__$7, __vue_create_injector__, undefined);
/**
* FishTankButtonSecondary
* @deprecated
* This component is being deprecated in favor of FishTankButton.
* It will be removed from the library in October 2019.
* FishTankButton offers a more standard and consistant API, and better code quality.
* Please begin using FishTankButton to avoid any breaking changes.
*/
var script$8 = Vue.extend({
name: "FishTankButtonWhite",
components: {
FishTankBaseButton: FishTankBaseButton$1
},
mounted: function mounted() {
// eslint-disable-next-line no-console
console.warn('FishTankButtonWhite is being deprecated in favor of FishTankButton. It will be removed from the library in October 2019. Please migrate to FishTankButton.');
}
});
/* script */
var __vue_script__$8 = script$8;
/* template */
var __vue_render__$8 = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("fish-tank-base-button", _vm._g(_vm._b({
staticClass: "button--white"
}, "fish-tank-base-button", _vm.$attrs, false), _vm.$listeners), [_vm._t("default")], 2);
};
var __vue_staticRenderFns__$8 = [];
__vue_render__$8._withStripped = true;
/* style */
var __vue_inject_styles__$8 = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-1f63938d_0", {
source: ".button--white {\n background-color: #FFFFFF;\n border-color: #EDF2F5;\n color: #777C7F;\n -webkit-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(255, 255, 255, 0.5), 0 10px 15px -8px rgba(0, 0, 0, 0.2);\n box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(255, 255, 255, 0.5), 0 10px 15px -8px rgba(0, 0, 0, 0.2);\n}\n.button--white:disabled {\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n.button--white:hover {\n -webkit-box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(255, 255, 255, 0.6), 0 10px 15px -8px rgba(0, 0, 0, 0.3);\n box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 8px 8px -8px rgba(255, 255, 255, 0.6), 0 10px 15px -8px rgba(0, 0, 0, 0.3);\n}\n.button--white:hover {\n color: #292E31;\n}\n.button--white:active {\n background-color: #EDF2F5;\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n.button--white:disabled {\n opacity: 0.4;\n}\n.button--white:disabled:hover {\n background-color: #C5CACD;\n color: #C5CACD;\n}\n",
map: undefined,
media: undefined
});
};
/* scoped */
var __vue_scope_id__$8 = undefined;
/* module identifier */
var __vue_module_identifier__$8 = undefined;
/* functional template */
var __vue_is_functional_template__$8 = false;
/* style inject SSR */
var FishTankButtonWhite = __vue_normalize__({
render: __vue_render__$8,
staticRenderFns: __vue_staticRenderFns__$8
}, __vue_inject_styles__$8, __vue_script__$8, __vue_scope_id__$8, __vue_is_functional_template__$8, __vue_module_identifier__$8, __vue_create_injector__, undefined);
/**
* FishTankButtonOutline
* @deprecated
* This component is being deprecated in favor of FishTankButton.
* It will be removed from the library in October 2019.
* FishTankButton offers a more standard and consistant API, and better code quality.
* Please begin using FishTankButton to avoid any breaking changes.
*/
var script$9 = Vue.extend({
name: "FishTankButtonOutline",
components: {
FishTankBaseButton: FishTankBaseButton$1
},
mounted: function mounted() {
// eslint-disable-next-line no-console
console.warn('FishTankButtonOutline is being deprecated in favor of FishTankButton. Please migrate to FishTankButton.');
}
});
/* script */
var __vue_script__$9 = script$9;
/* template */
var __vue_render__$9 = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("fish-tank-base-button", _vm._g(_vm._b({
staticClass: "button--outline"
}, "fish-tank-base-button", _vm.$attrs, false), _vm.$listeners), [_vm._t("default")], 2);
};
var __vue_staticRenderFns__$9 = [];
__vue_render__$9._withStripped = true;
/* style */
var __vue_inject_styles__$9 = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-0c478889_0", {
source: ".button--outline {\n background-color: transparent;\n border-color: #777C7F;\n border-width: 2px;\n color: #777C7F;\n}\n.button--outline:hover {\n color: #FFFFFF;\n background-color: #777C7F;\n}\n.button--outline:disabled {\n color: #C5CACD;\n border-color: #C5CACD;\n}\n.button--outline:disabled:hover {\n background-color: transparent;\n}\n.button--outline:active {\n background-color: #505558;\n border-color: #505558;\n}\n",
map: undefined,
media: undefined
});
};
/* scoped */
var __vue_scope_id__$9 = undefined;
/* module identifier */
var __vue_module_identifier__$9 = undefined;
/* functional template */
var __vue_is_functional_template__$9 = false;
/* style inject SSR */
var FishTankButtonOutline = __vue_normalize__({
render: __vue_render__$9,
staticRenderFns: __vue_staticRenderFns__$9
}, __vue_inject_styles__$9, __vue_script__$9, __vue_scope_id__$9, __vue_is_functional_template__$9, __vue_module_identifier__$9, __vue_create_injector__, undefined);
var script$10 = Vue.extend({
name: "FishTankButtonGradient",
components: {
FishTankBaseButton: FishTankBaseButton$1
},
props: {
gradientStart: {
type: String,
required: true,
default: "#000000",
description: "Start Color of Gradient; String(Hex color, or valid CSS color)"
},
gradientEnd: {
type: String,
required: true,
default: "#000000",
description: "End Color of Gradient; String(Hex color, or valid CSS color)"
},
colorDirection: {
type: String,
required: false,
default: "to right",
description: "Horizontal Direction of Gradient; String(\"to right\" or \"to left\")"
},
block: {
type: Boolean,
default: false
}
},
computed: {
returnGradientStyle: function returnGradientStyle() {
return "background-image: linear-gradient(".concat(this.colorDirection, ", ").concat(this.gradientStart, ", ").concat(this.gradientEnd, " );");
}
}
});
/* script */
var __vue_script__$10 = script$10;
/* template */
var __vue_render__$10 = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("a", {
staticClass: "button--wrapper",
class: {
"button--block": _vm.block
},
style: _vm.returnGradientStyle
}, [_c("fish-tank-base-button", _vm._g(_vm._b({
staticClass: "button--gradient",
attrs: {
block: _vm.block
}
}, "fish-tank-base-button", _vm.$attrs, false), _vm.$listeners), [_vm._t("default")], 2)], 1);
};
var __vue_staticRenderFns__$10 = [];
__vue_render__$10._withStripped = true;
/* style */
var __vue_inject_styles__$10 = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-2cdcf685_0", {
source: ".button--block {\n display: block;\n width: 100%;\n}\n.button--wrapper {\n padding: 2px;\n border-radius: 4px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n display: inline-block;\n}\n.button--gradient {\n border: none;\n background-color: #FFFFFF;\n color: #777C7F;\n}\n.button--gradient:hover {\n background: transparent;\n color: #FFFFFF;\n}\n.button--gradient:disabled {\n opacity: 0.4;\n}\n.button--gradient:disabled:hover {\n background-color: #777C7F;\n}\n.button--gradient:active {\n background-color: rgba(0, 0, 0, 0.3);\n border-color: rgba(0, 0, 0, 0.3);\n}\n",
map: undefined,
media: undefined
});
};
/* scoped */
var __vue_scope_id__$10 = undefined;
/* module identifier */
var __vue_module_identifier__$10 = undefined;
/* functional template */
var __vue_is_functional_template__$10 = false;
/* style inject SSR */
var FishTankButtonGradient = __vue_normalize__({
render: __vue_render__$10,
staticRenderFns: __vue_staticRenderFns__$10
}, __vue_inject_styles__$10, __vue_script__$10, __vue_scope_id__$10, __vue_is_functional_template__$10, __vue_module_identifier__$10, __vue_create_injector__, undefined);
var script$11 = Vue.extend({
name: "ButtonFAB",
components: {
FishTankBaseButton: FishTankBaseButton$1
},
props: {
optionsAvailable: {
type: Boolean,
required: true,
default: false
},
fabColorPrimaryStart: {
type: String,
required: true,
default: "#0018AB"
},
fabColorPrimaryEnd: {
type: String,
required: true,
default: "#9933CC"
},
fabColorSecondary: {
type: String,
required: true,
default: "#777C7F"
},
optionOneLink: {
type: String,
required: true,
default: " "
},
optionTwoLink: {
type: String,
required: true,
default: " "
}
},
computed: {
returnPrimaryFabColor: function returnPrimaryFabColor() {
return "background-image: linear-gradient( 135deg, ".concat(this.fabColorPrimaryStart, " 0%, ").concat(this.fabColorPrimaryEnd, " 100% ); \n border-image: linear-gradient( 135deg, ").concat(this.fabColorPrimaryStart, " 0% , ").concat(this.fabColorPrimaryEnd, " 100% ) 1% ; ");
},
returnSecondaryFabColor: function returnSecondaryFabColor() {
return "background: ".concat(this.fabColorSecondary, " ;");
}
},
methods: {}
});
/* script */
var __vue_script__$11 = script$11;
/* template */
var __vue_render__$11 = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("div", {
staticClass: "button--fab-wrapper"
}, [_c("fish-tank-base-button", _vm._g(_vm._b({
staticClass: "button--fab",
style: _vm.returnPrimaryFabColor
}, "fish-tank-base-button", _vm.$attrs, false), _vm.$listeners), [_vm._t("mainIcon")], 2), _vm._v(" "), _vm.optionsAvailable ? _c("ul", [_c("a", {
attrs: {
href: _vm.optionOneLink
}
}, [_c("li", {
style: _vm.returnSecondaryFabColor
}, [_vm._t("option1")], 2)]), _vm._v(" "), _c("a", {
attrs: {
href: _vm.optionTwoLink
}
}, [_c("li", {
style: _vm.returnSecondaryFabColor
}, [_vm._t("option2")], 2)])]) : _vm._e()], 1);
};
var __vue_staticRenderFns__$11 = [];
__vue_render__$11._withStripped = true;
/* style */
var __vue_inject_styles__$11 = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-620dc0cc_0", {
source: ".button--fab-wrapper {\n position: fixed;\n right: 50px;\n bottom: 50px;\n z-index: 49;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: center;\n flex-direction: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n border-color: #3DA774;\n background-color: none;\n text-align: center;\n}\n.button--fab-wrapper .button--fab {\n position: relative;\n z-index: 50;\n background-color: #292E31;\n -o-border-image: transparent;\n border-image: transparent;\n width: 56px;\n height: 56px;\n border-radius: 50%;\n font-size: 6em;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.3);\n box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.3);\n -webkit-transition: all .3s ease-in-out;\n transition: all .3s ease-in-out;\n}\n.button--fab-wrapper .button--fab:hover {\n -webkit-transform: scale(1.25);\n transform: scale(1.25);\n -webkit-box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);\n box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);\n}\n.button--fab-wrapper svg {\n fill: #FFFFFF;\n}\n.button--fab-wrapper svg path {\n fill: #FFFFFF;\n}\n.button--fab-wrapper:hover ul {\n -webkit-transition: 0.5s ease-in;\n transition: 0.5s ease-in;\n bottom: 50px;\n opacity: 1;\n}\n.button--fab-wrapper:hover ul li p {\n right: 70px;\n opacity: 1;\n -webkit-transition: 0.3s ease-in;\n transition: 0.3s ease-in;\n}\n.button--fab-wrapper p, .button--fab-wrapper a {\n text-decoration: none;\n color: #FFFFFF;\n}\n.button--fab-wrapper ul {\n opacity: 0;\n list-style-type: none;\n padding: 0px;\n width: 100%;\n position: absolute;\n z-index: 49;\n bottom: 0px;\n margin-bottom: 0;\n padding-bottom: 12px;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: reverse;\n -ms-flex-direction: column-reverse;\n flex-direction: column-reverse;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-transition: all 0.15s ease-in-out;\n transition: all 0.15s ease-in-out;\n}\n.button--fab-wrapper li {\n background: #777C7F;\n width: 40px;\n height: 40px;\n border-radius: 50%;\n margin-bottom: 12px;\n position: relative;\n font-size: 2em;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -ms-flex-item-align: center;\n align-self: center;\n -webkit-box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);\n box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);\n -webkit-transition: all .5s ease-in-out;\n transition: all .5s ease-in-out;\n}\n.button--fab-wrapper li:hover {\n -webkit-box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);\n box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);\n -webkit-transform: scale(1.25);\n transform: scale(1.25);\n}\n.button--fab-wrapper li svg {\n -ms-flex-item-align: center;\n align-self: center;\n}\n.button--fab-wrapper li a {\n height: 100%;\n width: 100%;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n}\n.button--fab-wrapper li p {\n opacity: 0;\n color: #292E31;\n font-size: 0.5em;\n position: absolute;\n z-index: 499;\n right: 0px;\n top: -12px;\n height: 100%;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -ms-flex-item-align: center;\n align-self: center;\n text-align: left;\n}\n",
map: undefined,
media: undefined
});
};
/* scoped */
var __vue_scope_id__$11 = undefined;
/* module identifier */
var __vue_module_identifier__$11 = undefined;
/* functional template */
var __vue_is_functional_template__$11 = false;
/* style inject SSR */
var FishTankButtonFAB = __vue_normalize__({
render: __vue_render__$11,
staticRenderFns: __vue_staticRenderFns__$11
}, __vue_inject_styles__$11, __vue_script__$11, __vue_scope_id__$11, __vue_is_functional_template__$11, __vue_module_identifier__$11, __vue_c