Skip to content

Instantly share code, notes, and snippets.

View Calvein's full-sized avatar
🐶

François Robichet Calvein

🐶
View GitHub Profile
@Calvein
Calvein / Custom.css
Created March 23, 2012 20:24
Solarized Dark Skin for the Chrome DevTools
body#-webkit-web-inspector #main{background-color:#002b36!important}body#-webkit-web-inspector #main .panel.network,body#-webkit-web-inspector #main .panel.timeline,body#-webkit-web-inspector #main .panel.profiles,body#-webkit-web-inspector #main .panel.audits,body#-webkit-web-inspector #main .panel.extension{background-color:#fff!important}body#-webkit-web-inspector #console-messages a:hover,body#-webkit-web-inspector #console-messages .console-formatted-function,body#-webkit-web-inspector #console-messages .console-formatted-object{color:#93a1a1!important}body#-webkit-web-inspector #console-prompt,body#-webkit-web-inspector #console-messages a,body#-webkit-web-inspector #console-messages .console-message,body#-webkit-web-inspector #console-messages .console-group-messages .section .header .title{color:#839496!important}body#-webkit-web-inspector #console-messages .console-formatted-null,body#-webkit-web-inspector #console-messages .console-formatted-undefined{color:#657b83!important}body#-webkit-web-inspect
@Calvein
Calvein / font-size.js
Last active August 30, 2022 00:46
Change font-size of an element if text is bigger than the content.
// Resize el if too long
fontSize = parseInt(el.style.fontSize)
while (el.offsetWidth < el.scrollWidth)
el.style.fontSize = --fontSize

React/Redux architecture

Tools

  • [Visual Studio Code]: For its [TypeScript] integration
  • [TypeScript]: Which can also replace React's PropTypes
  • [Create React app]: For a PoC or a small project, you can easily [use TypeScript following this guide]
  • [Storybook]: To develop your component standalone, see Storybook-driven development
  • [Babel]
  • [Webpack]
@Calvein
Calvein / index.html
Created August 20, 2012 14:55
<select> des pays avec code ISO
<select>
<option value="AF">Afghanistan
<option value="ZA">Afrique du sud
<option value="AX">Åland, îles
<option value="AL">Albanie
<option value="DZ">Algérie
<option value="DE">Allemagne
<option value="AD">Andorre
<option value="AO">Angola
<option value="AI">Anguilla
@Calvein
Calvein / getObjects.js
Created April 29, 2014 04:49
Get all objects from a parse class
// Returned promise
var promise = new Parse.Promise()
// Error function
var error = function() {
console.error('Error:', arguments)
// Break it
response.error('Query failed, check logs')
}
@Calvein
Calvein / config
Created January 30, 2017 12:04
Polybar config
[colors]
background = #1b2b34
foreground = #d8dee9
transparent = #00ffffff
base08 = #ec5f67
red = #ec5f67
base09 = #f99157
orange = #f99157
base0a = #fac863
@Calvein
Calvein / index.js
Created October 25, 2018 22:01
Toggle component usage
let Component = () => {
return (
<>
<Toggle defaultIsOn>
{({ isOn, toggle }) => (
<button onClick={toggle}>
is {isOn ? 'on' : 'off'}
</button>
<Modal isOpen={isOn}>
Hello
@Calvein
Calvein / declarative.js
Created September 11, 2018 09:00
Custom Dropdown react component API
<Dropdown
trigger={({ toggle }) => (
<Button
isDropdown
icon={<IconDecoration />}
iconActive={<IconDecorationFill />}
onClick={toggle}
>
Decoration
</Button>
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
#define S_base03 #002b36
#define S_base02 #073642
#define S_base01 #586e75
#define S_base00 #657b83
#define S_base0 #839496
#define S_base1 #93a1a1
#define S_base2 #eee8d5
#define S_base3 #fdf6e3
*background: S_base03