{"loaderData":{"0":null,"0-2":{"total":7067,"projects":[{"created":"2024-01-22T17:00:36.000Z","isPrivate":0,"projectId":"850b8c","snapshot":null,"tags":null,"title":"button by Bodyhc","updated":"2024-01-22T17:00:36.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":44,"cssLen":770,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"","css":"button {\n --color: #560bad;\n background-color: #fff;\n font-family: inherit;\n display: inline-block;\n width: 8em;\n height: 2.6em;\n line-height: 2.5em;\n margin: 20px;\n position: relative;\n overflow: hidden;\n border: 2px solid var(--color);\n transition: color .5s;\n z-index: 1;\n font-size: 17px;\n border-radius: 6px;\n font-weight: 500;\n cursor: pointer;\n color: var(--color);\n}\n\nbutton:before {\n content: \"\";\n position: absolute;\n z-index: -1;\n background: var(--color);\n height: 150px;\n width: 200px;\n border-radius: 50px;\n bottom: 100%;\n right: 100%;\n transition: .8s ease;\n}\n\nbutton:hover {\n color: #fff;\n}\n\nbutton:hover:before {\n bottom: -30px;\n left: -30px;\n}\n\nbutton:active:before {\n background: #3a0ca3;\n transition: background 2s;\n}"},{"created":"2024-01-22T17:00:36.000Z","isPrivate":0,"projectId":"17509d","snapshot":null,"tags":null,"title":"button by John-CFO","updated":"2024-01-22T17:00:36.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":65,"cssLen":949,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"","css":".btn {\n height: 3.5rem;\n width: 13.2rem;\n border-radius: 5px;\n border: 5px solid rgb(255, 255, 255);\n cursor: pointer;\n filter: drop-shadow(0px 0px 10px rgb(255, 255, 255));\n animation: flickering 2s linear infinite both;\n text-transform: uppercase;\n background-color: rgb(83, 82, 82);\n color: rgb(234, 234, 234);\n font-weight: 700;\n transition: 0.6s;\n box-shadow: 0px 0px 60px #1f4c65;\n -webkit-box-reflect: below 10px linear-gradient(to bottom, rgba(0,0,0,0.0), rgba(0,0,0,0.4));\n}\n\n@keyframes flickering {\n 0%,\n 100% {\n opacity: 1;\n }\n\n 41.99% {\n opacity: 1;\n }\n\n 42% {\n opacity: 0;\n }\n\n 43% {\n opacity: 0;\n }\n\n 43.01% {\n opacity: 1;\n }\n\n 47.99% {\n opacity: 1;\n }\n\n 48% {\n opacity: 0;\n }\n\n 49% {\n opacity: 0;\n }\n\n 49.01% {\n opacity: 1;\n }\n}\n\n.text {\n font-size: 1.8rem;\n font-family: Arial, Helvetica, sans-serif;\n}\n\n.btn:hover {\n background-color: black;\n border-radius: 0;\n}\n\n\n\n\n\n"},{"created":"2024-01-22T17:00:36.000Z","isPrivate":0,"projectId":"45dc37","snapshot":null,"tags":null,"title":"button by Kemboi-Dun","updated":"2024-01-22T17:00:36.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":61,"cssLen":724,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":" ","css":".button {\n text-decoration: none;\n padding: 14px 24px;\n color: #121212;\n border: 1px solid #181818;\n overflow: hidden;\n position: relative;\n transition: color .5s .25s;\n border-radius: 2px;\n background: transparent;\n}\n\n.button::before,\n.button::after {\n content: '';\n position: absolute;\n top: 0;\n width: 50%;\n height: 100%;\n background-color: #181818;\n z-index: -1;\n transform: scaleX(0);\n transition: transform .5s cubic-bezier(.785, .135, .15, .86);\n}\n\n.button::before {\n left: 0;\n transform-origin: left;\n}\n\n.button::after {\n right: 0;\n transform-origin: right;\n}\n\n.button:hover::before,\n.button:hover::after {\n transform: scaleX(1);\n}\n\n.button:hover {\n color: #f8f8f8;\n transition-delay: .5s;\n}"},{"created":"2024-01-22T17:00:36.000Z","isPrivate":0,"projectId":"6d82a2","snapshot":null,"tags":null,"title":"button by ArturCodeCraft","updated":"2024-01-22T17:00:36.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":127,"cssLen":2562,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n \n

","css":"/* ============================ */\nbutton {\n border: none;\n background: none;\n padding: 0;\n margin: 0;\n cursor: pointer;\n font-family: inherit;\n}\n/* ============================ */\n/*