Угловая анимация роста кода при наведении

Question

Я хочу отобразить qrcode в верхнем левом краю страницы, и при вводе мышью я хочу, чтобы qrcode выполнял анимацию увеличения, пока он не достигнет определенного размера X.

Я создал небольшой быстрый стек-блицпоказывая мои точные настройки: https://stackblitz.com/edit/angular-bprca7

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
   name = 'Angular';
   qrsize: number = 40;

   mouseEntered(){
     console.log("entered");
     if(this.qrsize<100){
        this.qrsize+=40;
     }
   }
}

При наведении курсора я получаю журнал консоли, но qrcode не корректируется.