let shapeWidth = 100;

let avSand;

let avNavy;

let avGrass;

let avClay;

let avenuesColor;

let yesSize = 30;

let noSize = 30;

let fontsizeTV = 100;

​

function preload() {

  myFont = loadFont('assets/Halyard Display.ttf');

}

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  noStroke();

 // background(255);

  textFont(myFont);

  avSand = color('rgb(245,205,100)');

  avNavy = color('rgb(39,56,121)');

  avGrass = color('rgb(13,154,72)');

  avClay = color('rgb(195,65,30)');

  avenuesColor = [avSand,avNavy,avClay,avGrass];

}

​

function draw() {

  // keep draw() here to continue looping while waiting for keys

  background(255);

  fill(0);

  textSize(40);

  //QUESTION

  text("Do you spend more time on your phone than you think it is healthy? Press the left arrow key for 'yes' and the right for 'no'",30,80,width-30)

  //NO

  fill(195,65,30,100);

  ellipse(width/4*3, height/2+20, noSize);

  fill(0);

  text(noSize-30,width/4*3, height/2+20)

  //YES

  fill(13,154,72,100);

  ellipse(width/4, height/2+20, yesSize);

  fill(0);

  text(yesSize-30,width/4, height/2+20);

}

​

function keyPressed() {

    if (keyCode === LEFT_ARROW) {

    yesSize = yesSize + 1;

  } else if(keyCode === RIGHT_ARROW){ 

    noSize = noSize + 1;

  }

}

​