{"html":"\n","css":".aero-arrow {\n position: relative;\n width: 2em;\n height: 2em;\n padding: 0.3em;\n border-radius: 100%;\n border: 1px solid #4d7bbf;\n background: linear-gradient(#0000 50%, #042c8b 50%, #80f1f9),\n radial-gradient(circle, #3069b2, #bbc6e0 70.7%);\n cursor: pointer;\n isolation: isolate;\n}\n\n.aero-arrow::before {\n content: \"\";\n position: absolute;\n inset: 0;\n border-radius: inherit;\n background: linear-gradient(#0000 50%, #013c97 50%, #a3fcff),\n radial-gradient(circle, #3889e0, #c7d9f2 70.7%);\n z-index: -1;\n opacity: 0;\n transition: 0.5s all;\n}\n\n.aero-arrow::after {\n content: \"\";\n position: absolute;\n inset: 0;\n border-radius: inherit;\n background: linear-gradient(#0000 50%, #01072e 50%, #55d2fd),\n radial-gradient(circle, #29467b, #8d98ad 70.7%);\n z-index: -1;\n opacity: 0;\n}\n\n.aero-arrow:hover::before {\n opacity: 1;\n}\n\n.aero-arrow:hover {\n border: 1px solid #5d9be0;\n}\n\n.aero-arrow:active:hover {\n border: 1px solid #030d48;\n}\n\n.aero-arrow:active::before {\n transition: 0s all;\n}\n\n.aero-arrow:active:hover::after {\n opacity: 1;\n}\n"}

nasty-badger-27

👁 实时预览

📝 源代码