Skip to content

Instantly share code, notes, and snippets.

View fcsonline's full-sized avatar

Ferran Basora fcsonline

View GitHub Profile
@fcsonline
fcsonline / teambox-qrcode.js
Created September 6, 2012 13:28
Teambox QRCode for contacts
$(window).bind('hashchange', function(){
if (window.location.hash.match('users')) {
setTimeout(function() {
console.log('Showing Contact QR-Code...');
var data = "";
alert('lol');
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Test</title>
<script type="text/javascript" src="http://192.168.3.2/assets/javascript/app.js"></script>
<script type="text/javascript" src="./monkeypatch.js"></script>
</head>
<body>
@fcsonline
fcsonline / SelectableList.jsx
Created December 2, 2016 11:45
Cart - SelectableList
class SelectableList extends React.Component {
onClickItem(event, index) {
this.state.setState({
selected: [
...this.state.selected,
index
]
});
}
@fcsonline
fcsonline / CartItem.jsx
Created December 2, 2016 11:53
Cart - CartItem
class CartItem extends React.Component {
onClickRemove () {
// Go to your store and remove item
}
render() {
const { item } = this.props;
const isPremium = item.premium ? 'premium' : '';
return (
.selectable-list {
border: 1px solid #ddd;
}
.selectable-list li {
padding-bottom: 10px; /* margin to padding ;) */
}
.selectable-list .selected {
background-color: blue;
}
@fcsonline
fcsonline / Cart.html
Created December 2, 2016 12:00
Cart - Markup
<ul>
<li>
<div>
<header>Item 1</header>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing.</p>
<button>Remove from cart</button>
</div>
</li>
<li class="selected"> <!-- More clear responsibilities (SelectList) -->
<div class="premium"> <!-- More clear responsibilities (CartItem) -->
@fcsonline
fcsonline / CartList.jsx
Last active December 2, 2016 12:40
Cart - CartList
class CartList extends React.Component {
onClickItem(event, index) {
this.state.setState({
selected: [
...this.state.selected,
index
]
});
}
@fcsonline
fcsonline / CartList.html
Created December 2, 2016 12:12
Cart - CartList markup
<ul class="cart">
<li>
<header>Item 1</header>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing.</p>
<button>Remove from cart</button>
</li>
<li class="premium selected">
<header>Item 2</header>
<p>Fusce vel neque sit amet felis fermentum cursus vitae.</p>
<button>Remove from cart</button>
.cart {
border: 1px solid #ddd;
}
.cart li {
margin-bottom: 10px;
border: 1px solid red;
}
.cart li.selected {