Skip to content

Instantly share code, notes, and snippets.

View alexcican's full-sized avatar

Alex Cican alexcican

318 followers · 0 following
View GitHub Profile
@alexcican
alexcican / :visited.js
Created May 20, 2015 06:19
Adding :visited styling to visited links with JS (CSS: a[data-visited])
localStorage.setItem('visited-'+window.location.pathname,true);
var links = document.getElementsByTagName('a');
for (i=0;i<links.length;i++) {
var link = links[i];
if (link.host == window.location.host
&& localStorage.getItem('visited-' + link.pathname + '/')) {
link.dataset.visited = true;
}
}
@alexcican
alexcican / flexbox.css
Last active July 9, 2016 09:39
Centring a div vertically and horizontally with CSS Flexbox (tested on Chrome 30, Safari 6, Firefox 24, Mobile Safari iOS 7, Mobile IE 10)
.parent {
display: flex;
height: 500px;
}
.child {
max-width: 20em;
margin: auto;
border: solid 1px;
}
@alexcican
alexcican / Preferences.sublime-settings
Last active March 7, 2024 05:37
SublimeText User settings
{
"auto_complete_commit_on_tab": true,
"color_scheme": "Packages/Color Scheme - Default/Tomorrow-Night-Eighties.tmTheme",
"file_exclude_patterns":
[
".DS_Store"
],
"folder_exclude_patterns":
[
"bin",
@alexcican
alexcican / style.css
Created March 8, 2013 22:24
Useful CSS snippet for creating a new website. Sets typography for vertical rhythm and icon font for icons, as well as mobile, tablet, and large screen query. Based on 32px baseline height and 22px font-size for body.
/*** GLOBAL ***/
/**************/
img, embed, object, video {
max-width: 100%;
}
@font-face {
font-family: 'sicanstudios-icons';
src:url('./fonts/sicanstudios-icons.eot');
}
@alexcican
alexcican / recent-posts.html
Created February 11, 2013 09:31
Displaying recent posts on Scriptogr.am
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load("feeds", "1");
google.setOnLoadCallback(OnLoad);
/* creates a feed instance and loads the feed */
function OnLoad() {
var feed = new google.feeds.Feed("http://scriptogr.am/sican/feed/");
feed.load(feedLoaded);
}
@alexcican
alexcican / retina-media-query.css
Created February 6, 2013 21:57
CSS3 Media Query for serving different images on retina devices
/* future proof retina targetting */
@media (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx), {
}
@alexcican
alexcican / fadein-scroll.js
Created February 5, 2013 21:41
Snippet for fading in content as you scroll
$(document).ready(function() {
/* Every time the window is scrolled ... */
$(window).scroll( function(){
/* Check the location of each desired element */
$('.hideme').each( function(i){
var bottom_of_object = $(this).position().top + $(this).outerHeight();
var bottom_of_window = $(window).scrollTop() + $(window).height();
/* If the object is completely visible in the window, fade it it */
if( bottom_of_window > bottom_of_object ){
@alexcican
alexcican / keyboard-keys.js
Created January 23, 2013 02:45
Snippet for capturing keyboard keys with Javascript (unfinshed)
$(document).on('keydown', function(e) {
if (e.keyCode >= 65 && e.keyCode <= 90) {
var char = (e.metaKey ? '⌘-' : '') + String.fromCharCode(e.keyCode)
$('#keydown').append('<kbd>' + char + '</kbd>')
e.preventDefault();
}
});
@alexcican
alexcican / index.html
Created January 14, 2013 20:31
Account Menu Dropdown (CSS3 & HTML5 Experiment)
<!doctype html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="shortcut icon" href="favicon.png" />
<title>Account Menu Dropdown &#8211; CSS3 &amp; HTML5 experiment</title>
<meta name="description" content="Card flip | SicanStudios.com">
<meta name="author" content="http://SicanStudios.com">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>
@alexcican
alexcican / movies-series.md
Last active May 8, 2023 16:02
List of favourite movies & series (alphabetical order).

FAVOURITE MOVIES

4 Months, 3 Weeks and 2 Days
12 Angry Men
14 Peaks
28 Days Later
127 Hours
A Beautiful Mind
A Clockwork Orange