{
        "ClassName": "HTMLClip",
        "version": "9.5.6",
        "plugin": "@donkeyclip/self-contained-incidents",
        "plugin_npm_name": "@donkeyclip/self-contained-incidents",
        "attrs": {

        },
        "props": {
          "html": "<div class="container"> <p>{{initParams.text}}</p> </div> ",
          "css": "
            *{
              --font-size:{{ initParams.fontSize }};
              --font-color:{{ initParams.color }}
            }
            .container{
              align-items:center;
              color:#fff;
              display:flex;
              flex-direction:column;
              font-size:var(--font-size);
              height:100%;
              justify-content:center;
            }
          ",
          "host": {},
          "initParamsValidationRules": {
            "text": {
              "label": "Text",
              "type": "string",
              "optional": true,
              "default": "Hello"
            }
          },
          "initParams": {
            "text": "Hello"
          },
          "containerParams": {
            "width": "800px",
            "height": "450px"
          }
        },
        "incidents": {
          "944bf2fb-d72f-da18": {
            "id": "944bf2fb-d72f-da18",
            "position": 0,
            "leaf": {
              "ClassName": "CSSEffect",
              "version": "*",
              "plugin": "@donkeyclip/css-layer",
              "plugin_npm_name": "@donkeyclip/css-layer",
              "attrs": {
                "animatedAttrs": {
                  "fontSize": "50px"
                }
              },
              "props": {
                "selector": ".container",
                "duration": 2000,
                "easing": "linear"
              }
            }
          }
        },
        "duration": 2000
      }

prieston

Presentations

Didn't find what you're looking for?