Skip to content

Instantly share code, notes, and snippets.

View fjaguero's full-sized avatar
🏠
Working from home

Fernando Agüero fjaguero

🏠
Working from home
View GitHub Profile
@fjaguero
fjaguero / background.js
Created July 14, 2017 08:03
Background
// Listen to content.js events
chrome.extension.onMessage.addListener(
function(request, sender, sendResponse) {
if (request.count || request.count === 0) {
chrome.browserAction.setBadgeText({'text': request.count.toString()})
}
}
);
@fjaguero
fjaguero / content.js
Created July 14, 2017 08:01
Content Script
$(document).ready(function() {
// Select the target node (tweet modal)
var target = $('.PermalinkOverlay-modal').get(0);
// Create an observer instance
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
// Get the Twitter modal window replies count
var loneTweetsCount = $('.PermalinkOverlay-body .ThreadedConversation--loneTweet .tweet').length
@fjaguero
fjaguero / simpleObserver.js
Created July 14, 2017 07:51
Simple observer
// select the target node
var target = document.querySelector('#some-id');
// create an observer instance
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
console.log(mutation.type);
});
});
@fjaguero
fjaguero / eventListener.js
Created July 14, 2017 07:46
DOMNodeInserted Event Listener
element.addEventListener("DOMNodeInserted", function (ev) {
// ...
}, false);
@fjaguero
fjaguero / Button.js
Created June 6, 2017 12:10
Styled components: Using props from a <ThemeProvider />
// Define our button, but with the use of props.theme this time
const Button = styled.button`
font-size: 1em;
margin: 1em;
padding: 0.25em 1em;
border-radius: 3px;
/* Color the border and text with theme properties */
color: ${props => props.theme.darkGray};
border: 2px solid ${props => props.theme.darkGray};
@fjaguero
fjaguero / Button.js
Last active June 6, 2017 12:09
Styled components: Using props from a <ThemeProvider />
// Define our button, but with the use of props.theme this time
const Button = styled.button`
font-size: 1em;
margin: 1em;
padding: 0.25em 1em;
border-radius: 3px;
/* Color the border and text with theme properties */
color: ${props => props.theme.darkGray};
border: 2px solid ${props => props.theme.darkGray};
@fjaguero
fjaguero / App.js
Last active June 6, 2017 15:10
Styled Components: <ThemeProvider /> usage
// Style guide definition
const styleGuide = {
cloudy: '#F2F4F7',
darkGray: '#4A637C',
gray: '#7A8D9F',
// ...more colors or mixins
};
return (
// The theme styles are available everywhere (thanks to React's context API)
@fjaguero
fjaguero / .jshintc
Created April 5, 2015 17:27
Meteor .jshintrc
//.jshintrc
{
// JSHint Meteor Configuration File
// Match the Meteor Style Guide
//
// By @raix with contributions from @aldeed and @awatson1978
// Source https://github.com/raix/Meteor-jshintrc
//
// See http://jshint.com/docs/ for more details
@fjaguero
fjaguero / SassMeister-input.sass
Created July 22, 2014 14:14
Generated by SassMeister.com.
// ----
// Sass (v3.4.0.rc.1)
// Compass (v1.0.0.alpha.20)
// ----
// Mixin Breakpoints
@mixin breakpoint($class)
@if $class == mobile
@media (max-width: 767px)
@content
@fjaguero
fjaguero / console-log.js
Created May 30, 2014 08:42
Console.log improvement
console.clear();
var old = console.log;
console.log = function() {
var args = [].slice.apply(arguments).concat([(new Error()).stack.split(/\n/)[2].trim()]);
return old.apply(this, args);
};
function test(t) {