eduardoboucas

const hue = require('node-hue-api')
const HueApi = hue.HueApi
const lightState = hue.lightState

const IP = '192.168.1.85'
const USERNAME = 'XXXXXX'
const TIMEOUT = 30000

const api = new HueApi(IP, USERNAME)
const offState = lightState.create().off()

eduardoboucas

1. Install Dust.js dependency

Web 3.0 supports multiple template engines. As a consequence, Dust.js is now decoupled from core and needs to be included as a dependency on projects that want to use it.

npm install @dadi/web-dustjs --save

2. Change bootstrap script

eduardoboucas

https://docs.google.com/a/dadi.co/presentation/d/1KfHPJNXATjvcVLyQdf7fnmbcl1xs0KD-HKyb7jis8_g/edit?usp=sharing

eduardoboucas

include-media — hidden classes

Get include-media here.

This plugin generates classes that can be used to hide elements (using display: none) at any specific breakpoint.

/* Hides an element on the "medium" breakpoint */

eduardoboucas

include-media — em units

Get include-media here.

If you're using include-media to manage your breakpoints, you might want to have it generate media queries in em units but still declare the breakpoints in px for convenience.

We decided not to add this to the library core, as it's outside the scope of the project, but you can achieve that with a tiny function:

eduardoboucas

// ----
// libsass (v3.3.2)
// ----

$foo: true;

.bar {
  color: if($foo, 'red', 'green');;
}

eduardoboucas

// ----
// libsass (v3.3.2)
// ----

@import "include-media";

$breakpoints:(
    'bp1': 375px,
    'bp2': 580px,
    'bp3': 768px,

eduardoboucas

// ----
// libsass (v3.3.2)
// ----

@import "include-media";

$breakpoints:(
    'small': 400px,
    'large': 1200px
);

eduardoboucas

// ----
// libsass (v3.2.5)
// ----

@import "include-media";

///
/// Generates grid classes based on the defined breakpoints,
/// named with the convention `.col--x-y@breakpoint`, where
/// `x` is a subdivision of `y`.

eduardoboucas

// ----
// Sass (v3.4.14)
// Compass (v1.0.3)
// Include Media (v1.3.0)
// ----

@import 'include-media';

// ----- Plugin starts here -----