/* ------------------------------------------------------------------------------
*
* # Grey palette colors
*
* Specific JS code additions for colors_grey.html page
*
* Version: 1.0
* Latest update: Aug 1, 2015
*
* ---------------------------------------------------------------------------- */
$(function() {
// Selects
// ------------------------------
// Basic select2
$('.select').select2({
minimumResultsForSearch: Infinity,
containerCssClass: 'bg-grey-600'
});
// Select2 ultiselect item color
$('.select-item-color').select2({
containerCssClass: 'bg-grey-600'
});
// Select2 dropdown menu color
$('.select-menu-color').select2({
containerCssClass: 'bg-grey-600',
dropdownCssClass: 'bg-grey-600'
});
// Multiselect
$('.multiselect').multiselect({
buttonClass: 'btn bg-grey-600',
nonSelectedText: 'Select your state',
onChange: function() {
$.uniform.update();
}
});
// SelectBoxIt
$(".selectbox").selectBoxIt({
autoWidth: false,
theme: "bootstrap"
});
// Bootstrap select
$.fn.selectpicker.defaults = {
iconBase: '',
tickIcon: 'icon-checkmark-circle'
}
$('.bootstrap-select').selectpicker();
// Notifications
// ------------------------------
// jGrowl
$('.growl-launch').on('click', function () {
$.jGrowl('I am a well highlighted grey notice..', { theme: 'bg-grey', header: 'Well highlighted' });
});
// PNotify
$('.pnotify-launch').on('click', function () {
new PNotify({
title: 'Info Notice',
text: 'Check me out! I\'m a notice.',
icon: 'icon-info22',
animate_speed: 200,
delay: 5000,
addclass: 'bg-grey'
});
});
// Form components
// ------------------------------
// Switchery toggle
var switchery = document.querySelector('.switch');
var init = new Switchery(switchery, {color: '#757575'});
// Checkboxes and radios
$(".styled, .multiselect-container input").uniform({
radioClass: 'choice',
checkboxClass: 'checker',
wrapperClass: "border-grey text-grey-600"
});
// File input
$(".file-styled").uniform({
fileButtonClass: 'action btn bg-grey'
});
// Popups
// ------------------------------
// Tooltip
$('[data-popup=tooltip-custom]').tooltip({
template: '<div class="tooltip"><div class="bg-grey-600"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div></div>'
});
// Popover title
$('[data-popup=popover-custom]').popover({
template: '<div class="popover border-grey-600"><div class="arrow"></div><h3 class="popover-title bg-grey-600"></h3><div class="popover-content"></div></div>'
});
// Popover background color
$('[data-popup=popover-solid]').popover({
template: '<div class="popover bg-grey-600"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
});
});