Skip to content

Instantly share code, notes, and snippets.

Alex Cican alexcican

Block or report user

Report or block alexcican

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@alexcican
alexcican / :visited.js
Created May 20, 2015
Adding :visited styling to visited links with JS (CSS: a[data-visited])
View :visited.js
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 Jul 9, 2016
Centring a div vertically and horizontally with CSS Flexbox (tested on Chrome 30, Safari 6, Firefox 24, Mobile Safari iOS 7, Mobile IE 10)
View flexbox.css
.parent {
display: flex;
height: 500px;
}
.child {
max-width: 20em;
margin: auto;
border: solid 1px;
}
@alexcican
alexcican / Preferences.sublime-settings
Last active Aug 14, 2019
SublimeText User settings
View Preferences.sublime-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 Mar 8, 2013
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.
View style.css
/*** 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 Feb 11, 2013
Displaying recent posts on Scriptogr.am
View recent-posts.html
<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 Feb 6, 2013
CSS3 Media Query for serving different images on retina devices
View retina-media-query.css
/* 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 Feb 5, 2013
Snippet for fading in content as you scroll
View fadein-scroll.js
$(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 Jan 23, 2013
Snippet for capturing keyboard keys with Javascript (unfinshed)
View keyboard-keys.js
$(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 Jan 14, 2013
Account Menu Dropdown (CSS3 & HTML5 Experiment)
View index.html
<!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 Nov 1, 2019
List of favourite movies & series (alphabetical order).
View movies-series.md

FAVOURITE MOVIES

4 Months, 3 Weeks and 2 Days
12 Angry Men
28 Days Later
127 Hours
A Beautiful Mind
A Clockwork Orange
A Separation
You can’t perform that action at this time.