QML flipable messes up my opacity

Lyven

Dear All

@Flipable{
id: sheet;

     anchors.fill: parent;
     anchors.leftMargin: 100;
     anchors.topMargin: 20;
     anchors.rightMargin: 20;
     anchors.bottomMargin: 20;

     property bool flipped: false;



     front: Rectangle{
         id: frontRect;
         anchors.fill: parent;
         radius: 10;
         color: "#FFFFFF";
         opacity: 0.7;


     }


     back: Rectangle{
         id: backRect;
         anchors.fill: parent;
         radius: 10;
         color: "#FFFFFF";
         opacity: 0.7;


     }


     transform: Rotation {
        id: rotation;
        origin.x: sheet.width / 2;
        origin.y: sheet.height / 2;
        axis: Qt.vector3d(0, 1, 0);
        angle: 0;    // the default angle
     }

     states: State {
         name: "back";
         PropertyChanges {
             target: rotation;
             angle: 180
         }

         when: sheet.flipped
     }

     transitions: Transition {
         NumberAnimation { target: rotation; property: "angle"; duration: 450 }
     }

     MouseArea {
         anchors.fill: parent
         onClicked: sheet.flipped = !sheet.flipped
     }@

I try this according to the textbook :) but when loading my rectangle is indeed 0.7 opac, but when flipped it goes to 1.0, and when flipping back stays at 1.0. What am i doing wrong here?

kind regards

Lieven