{"html":"

\n \n \n

\n Try\n \n

\n \n \n

\n This\n \n

\n \n \n

\n One\n \n

\n","css":".radio-container {\n background-color: white;\n display: flex;\n align-items: center;\n gap: 20px;\n padding: 20px;\n border-radius: 12px;\n}\n\n.radio-container input[type=\"radio\"] {\n display: none;\n}\n\n.radio-container label {\n display: flex;\n align-items: center;\n cursor: pointer;\n font-size: 1rem /* 20px */;\n}\n\n.radio-container .custom-radio {\n width: 25px; /* Increased size */\n height: 25px; /* Increased size */\n border: 2px solid #b0b0b0; /* Adjusted thickness */\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n transition:\n border-color 0.3s,\n background-color 0.3s;\n}\n\n.radio-container .custom-radio::after {\n content: \"\";\n width: 15px;\n height: 15px;\n background-color: #b0b0b0;\n border-radius: 50%;\n display: none;\n transition: background-color 0.3s;\n}\n\n.radio-container input[type=\"radio\"]:checked + label .custom-radio {\n border-color: #64d2b3;\n}\n\n.radio-container input[type=\"radio\"]:checked + label .custom-radio::after {\n display: block;\n background-color: #64d2b3;\n}\n\n.radio-container label span {\n margin-left: 5px;\n color: #b0b0b0;\n transition: color 0.3s;\n}\n\n.radio-container input[type=\"radio\"]:checked + label span {\n color: #64d2b3;\n}\n"}

shaggy-mole-76

👁 实时预览

📝 源代码