{
  "id": "VashonG_unlucky-crab-35",
  "name": "unlucky-crab-35",
  "category": "loaders",
  "author": "VashonG",
  "description": "unlucky-crab-35 组件 (icon, fintech, credit, animation)",
  "tags": [
    "icon",
    "fintech",
    "credit",
    "animation"
  ],
  "original": {
    "html": "<div class=\"virtual-card\">\n  <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 111 84\" height=\"84\" width=\"111\">\n    <rect stroke-dasharray=\"4 4\" stroke-width=\"2\" stroke=\"black\" fill=\"white\" transform=\"matrix(-1.31134e-07 1 1 1.31134e-07 -1.31134e-07 40.7759)\" rx=\"3.40064\" height=\"65.6552\" width=\"41.2241\" y=\"1\" x=\"1\"></rect>\n    <rect fill=\"black\" transform=\"rotate(-180 65.7758 58.6293)\" height=\"10.3362\" width=\"63.8966\" y=\"58.6293\" x=\"65.7758\"></rect>\n    <path class=\"plus-one\" stroke-width=\"2\" stroke=\"black\" d=\"M70.8334 15L70.8334 19.6954M70.8334 19.6954H66.1379M70.8334 19.6954H75.5288M70.8334 19.6954V24.3909\"></path>\n    <path class=\"plus-two\" stroke-width=\"2\" stroke=\"black\" d=\"M93.955 39L93.955 45.8171M93.955 45.8171H87.1379M93.955 45.8171H100.772M93.955 45.8171V52.6341\"></path>\n    <path class=\"plus-three\" stroke-width=\"2\" stroke=\"black\" d=\"M99.9622 0L99.9622 10.8242M99.9622 10.8242H89.1379M99.9622 10.8242H110.786M99.9622 10.8242V21.6484\"></path>\n    <path class=\"plus-four\" stroke-width=\"2\" stroke=\"black\" d=\"M87.4913 22L87.4913 26.3535M87.4913 26.3535H83.1379M87.4913 26.3535H91.8448M87.4913 26.3535V30.7069\"></path>\n    <path class=\"plus-five\" stroke-width=\"2\" stroke=\"black\" d=\"M77.8447 1V3.70685M77.8447 3.70685H75.1379M77.8447 3.70685H80.5516M77.8447 3.70685V6.4137\"></path>\n    <path class=\"plus\" stroke-width=\"2\" stroke=\"black\" d=\"M76.8447 40V42.7068M76.8447 42.7068H74.1379M76.8447 42.7068H79.5516M76.8447 42.7068V45.4137\"></path>\n  </svg>\n</div>",
    "css": "/* From Uiverse.io by VashonG  - Tags: icon, fintech, credit */\n.virtual-card,\n.physical-card,\n.tokenized-card {\n  margin: 0 50px;\n}\n\n.plus {\n  animation: plus 2s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n.plus-one {\n  animation: plus 2.5s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n.plus-two {\n  animation: plus 3s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n.plus-three {\n  animation: plus 3.5s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n.plus-four {\n  animation: plus 4s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n.plus-five {\n  animation: plus 4.5s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n@keyframes plus {\n  0% {\n    opacity: 1;\n  }\n\n  50% {\n    opacity: 0;\n  }\n\n  100% {\n    opacity: 1;\n  }\n}",
    "file_path": "/mnt/persist/workspace/loaders/VashonG_unlucky-crab-35.html"
  },
  "uniapp": {
    "template": "<view class=\"virtual-card\"></view>\n  <view xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 111 84\" height=\"84\" width=\"111\"></view>\n    <rect stroke-dasharray=\"4 4\" stroke-width=\"2\" stroke=\"black\" fill=\"white\" transform=\"matrix(-1.31134e-07 1 1 1.31134e-07 -1.31134e-07 40.7759)\" rx=\"3.40064\" height=\"65.6552\" width=\"41.2241\" y=\"1\" x=\"1\"></rect>\n    <rect fill=\"black\" transform=\"rotate(-180 65.7758 58.6293)\" height=\"10.3362\" width=\"63.8966\" y=\"58.6293\" x=\"65.7758\"></rect>\n    <path class=\"plus-one\" stroke-width=\"2\" stroke=\"black\" d=\"M70.8334 15L70.8334 19.6954M70.8334 19.6954H66.1379M70.8334 19.6954H75.5288M70.8334 19.6954V24.3909\"></path>\n    <path class=\"plus-two\" stroke-width=\"2\" stroke=\"black\" d=\"M93.955 39L93.955 45.8171M93.955 45.8171H87.1379M93.955 45.8171H100.772M93.955 45.8171V52.6341\"></path>\n    <path class=\"plus-three\" stroke-width=\"2\" stroke=\"black\" d=\"M99.9622 0L99.9622 10.8242M99.9622 10.8242H89.1379M99.9622 10.8242H110.786M99.9622 10.8242V21.6484\"></path>\n    <path class=\"plus-four\" stroke-width=\"2\" stroke=\"black\" d=\"M87.4913 22L87.4913 26.3535M87.4913 26.3535H83.1379M87.4913 26.3535H91.8448M87.4913 26.3535V30.7069\"></path>\n    <path class=\"plus-five\" stroke-width=\"2\" stroke=\"black\" d=\"M77.8447 1V3.70685M77.8447 3.70685H75.1379M77.8447 3.70685H80.5516M77.8447 3.70685V6.4137\"></path>\n    <path class=\"plus\" stroke-width=\"2\" stroke=\"black\" d=\"M76.8447 40V42.7068M76.8447 42.7068H74.1379M76.8447 42.7068H79.5516M76.8447 42.7068V45.4137\"></path>\n  </svg>\n</div>",
    "script": "export default {\n  name: 'GalaxyUnluckyCrab35',\n  props: {\n    // 根据组件类型动态生成props\n  },\n  data() {\n    return {\n      // 组件状态\n    };\n  },\n  methods: {\n    // 组件方法\n  }\n}",
    "style": "\n/* From Uiverse.io by VashonG  - Tags: icon, fintech, credit */\n.virtual-card,\n.physical-card,\n.tokenized-card {\n  margin: 0 100rpx;\n}\n\n.plus {\n  animation: plus 2s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n.plus-one {\n  animation: plus 2.5s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n.plus-two {\n  animation: plus 3s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n.plus-three {\n  animation: plus 3.5s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n.plus-four {\n  animation: plus 4s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n.plus-five {\n  animation: plus 4.5s cubic-bezier(0.34, 1.56, 0.64, 1) infinite;\n}\n\n@keyframes plus {\n  0% {\n    opacity: 1;\n  }\n\n  50% {\n    opacity: 0;\n  }\n\n  100% {\n    opacity: 1;\n  }\n}\n\n",
    "component_name": "GalaxyUnluckyCrab35"
  },
  "platforms": {
    "h5": true,
    "mp-weixin": true,
    "mp-alipay": true,
    "mp-baidu": true,
    "mp-toutiao": true,
    "app-plus": true
  },
  "props": [
    {
      "name": "disabled",
      "type": "Boolean",
      "default": false,
      "required": false,
      "description": "是否禁用"
    }
  ],
  "events": [],
  "slots": [
    {
      "name": "",
      "description": "",
      "props": []
    }
  ],
  "compatibility": {
    "h5": {
      "supported": true,
      "issues": [],
      "alternatives": []
    },
    "mp-weixin": {
      "supported": true,
      "issues": [],
      "alternatives": []
    },
    "mp-alipay": {
      "supported": true,
      "issues": [],
      "alternatives": []
    },
    "app-plus": {
      "supported": true,
      "issues": [],
      "alternatives": []
    }
  },
  "performance": {
    "complexity": "medium",
    "bundle_size": 2222,
    "render_cost": "medium",
    "memory_usage": "medium"
  },
  "dependencies": [],
  "examples": [
    {
      "title": "",
      "description": "",
      "code": ""
    }
  ],
  "created_at": "2025-07-31T07:55:40.756Z",
  "updated_at": "2025-07-31T07:55:40.756Z"
}