Merge pull request #744 from mozilla/gradients

Gradient experiment
This commit is contained in:
Danny Coates 2018-01-31 12:15:15 -08:00 committed by GitHub
commit 48807bf030
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 42 additions and 7 deletions

View File

@ -1,10 +1,19 @@
import hash from 'string-hash';
const experiments = {
XnN0idVWSxO6A0kiNkxzGw: {
id: 'XnN0idVWSxO6A0kiNkxzGw',
S9wqVl2SQ4ab2yZtqDI3Dw: {
id: 'S9wqVl2SQ4ab2yZtqDI3Dw',
run: function(variant, state, emitter) {
state.promo = variant === 1 ? 'blue' : 'grey';
switch (variant) {
case 1:
state.promo = 'blue';
break;
case 2:
state.promo = 'pink';
break;
default:
state.promo = 'grey';
}
emitter.emit('render');
},
eligible: function() {
@ -14,7 +23,11 @@ const experiments = {
);
},
variant: function(state) {
return this.luckyNumber(state) > 0.5 ? 1 : 0;
const n = this.luckyNumber(state);
if (n < 0.33) {
return 0;
}
return n < 0.66 ? 1 : 2;
},
luckyNumber: function(state) {
return luckyNumber(

View File

@ -5,8 +5,15 @@ module.exports = function(state, emit) {
function clicked() {
emit('experiment', { cd3: 'promo' });
}
const classes = state.promo === 'blue' ? 'banner banner-blue' : 'banner';
let classes = 'banner';
switch (state.promo) {
case 'blue':
classes = 'banner banner-blue';
break;
case 'pink':
classes = 'banner banner-pink';
break;
}
return html`
<div class="${classes}">

View File

@ -1039,7 +1039,7 @@ tbody {
}
.banner-blue {
background-color: #0098f7;
background: linear-gradient(-180deg, #45a1ff 0%, #00feff 94%);
color: #fff;
}
@ -1053,6 +1053,21 @@ tbody {
font-weight: bold;
}
.banner-pink {
background: linear-gradient(-180deg, #ff9400 0%, #ff1ad9 94%);
color: #fff;
}
.banner-pink a {
color: #fff;
font-weight: bold;
}
.banner-pink a:hover {
color: #eee;
font-weight: bold;
}
.selectbox {
display: inline-block;
position: relative;