Skip to content

Instantly share code, notes, and snippets.

View codedcontainer's full-sized avatar
💭
Learning about GraphQL through a Pluralsight.

codedcontainer

💭
Learning about GraphQL through a Pluralsight.
11 followers · 13 following
View GitHub Profile
@codedcontainer
codedcontainer / slick-slider-multiple-animate
Last active January 5, 2016 14:27
Animates and an image that you hover in a slick slider when you have multiple images
/* animates the slider images so that when you hover
on an image the full width of image is animated
*/
var imgParent, imgParentWidth, sizeDiff, sliderWidth;
$('.slick-slide img').hover(function()
{
var imgWidth = $(this).innerWidth(); // actual width of hovered image
imgParent = $(this).parent(); // get the parent element of hovered image
imgParentWidth = imgParent.innerWidth(); // width of hovered iamge pared
@codedcontainer
codedcontainer / material-design.css
Created February 8, 2016 18:09
Removed all of the comments, media queries, and base styles for Twitter Bootstrap.
/**
* material-design-lite - Material Design Components in CSS, JS and HTML
* @version v1.1.1
* @license Apache-2.0
* @copyright 2015 Google, Inc.
* @link https://github.com/google/material-design-lite
*/
@charset "UTF-8";
.visuallyhidden {
@codedcontainer
codedcontainer / fullCalendar
Created February 11, 2016 15:13
Creates a new instance of FullCalendar from an XML file (example)
function fullCalendar()
{
$('#calendar').fullCalendar(
{
eventBackgroundColor: '#7A1705',
eventBorderColor: '#7A1705',
header:
{
left: 'title',
center: '',
@codedcontainer
codedcontainer / YoutubeSlider.js
Created February 26, 2016 15:36
YouTube API with control settings. Should change height of slide area when the video is played or stopped.
/* youtube video in slider */
// Load the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// Replace the 'ytplayer' element with an <iframe> and
// YouTube player after the API code downloads.
@codedcontainer
codedcontainer / broken-image.css
Created March 10, 2016 15:43
Broken image placeholder design
img {
/* Same as first example */
min-height: 50px;
}
img:before {
content: " ";
display: block;
position: absolute;
@codedcontainer
codedcontainer / Angular Icon Loop.js
Created April 22, 2016 14:40
Allows you to repeat a number of icons numerous times such as if you were using a for loop in JavaScript
<i class="material-icons md-48" ng-repeat="_ in ((_ = []) && (_.length=3) && _) track by $index">star</i>
@codedcontainer
codedcontainer / angular manual link.js
Created April 22, 2016 14:43
A manual way of splitting a Angular object so that you can add items to rows in Bootstrap.
@codedcontainer
codedcontainer / ie.js
Created October 18, 2016 18:24
Flex box does not work with ie 11 > 9, you need to adjust the height for ie 11
function ieTag(){
var ie = {
eleven: 'rv:11',
ten: 'MSIE 10',
nine: 'MSIE 9'
};
var appVersion = window.navigator.appVersion;
for( key in ie )
@codedcontainer
codedcontainer / bookmark.html
Created October 19, 2016 13:45
Allows for the use of anchor bookmark links.
<a href="/#/:policy.html/?scrollTo=scope" target="_self">Link</a>
<h2 id="scope">Scope</h2>
@codedcontainer
codedcontainer / scss
Created November 15, 2016 17:08
Flexbox internet explorer fix for bootstrap 4 in sass
//fix for flexbox in internet explorer
$list: xm sm md lg xl;
@for $i from 1 through 12{
@each $b in $list{
.ie .col-#{$b}-#{$i}{
padding-left: 0px !important; padding-right: 0px !important;
}
}
}