{"loaderData":{"0":null,"0-2":{"total":7091,"projects":[{"created":"2024-01-22T17:00:01.000Z","isPrivate":0,"projectId":"814d93","snapshot":null,"tags":null,"title":"button by adamgiebl","updated":"2024-01-22T17:00:01.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":368,"cssLen":871,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"\n","css":".contactButton {\n background: #3cb371;\n color: white;\n font-family: inherit;\n padding: 0.5em;\n padding-left: 1.2em;\n font-size: 18px;\n font-weight: 600;\n border-radius: 1em;\n border: none;\n letter-spacing: 0.05em;\n display: flex;\n align-items: center;\n box-shadow: inset 0 0 1.8em -0.7em #2e8b57;\n overflow: hidden;\n position: relative;\n height: 3em;\n padding-right: 3.5em;\n}\n\n.iconButton {\n margin-left: 1.2em;\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 2.4em;\n width: 2.4em;\n border-radius: 1.2em;\n box-shadow: 0.15em 0.15em 0.8em 0.3em #32cd32;\n right: 0.4em;\n transition: all 0.3s;\n}\n\n.contactButton:hover {\n transform: translate(-0.05em, -0.05em);\n box-shadow: 0.2em 0.2em #228b22;\n}\n\n.contactButton:active {\n transform: translate(0.05em, 0.05em);\n box-shadow: 0.1em 0.1em #228b22;\n}"},{"created":"2024-01-22T17:00:01.000Z","isPrivate":0,"projectId":"2097d5","snapshot":null,"tags":null,"title":"button by catraco","updated":"2024-01-22T17:00:01.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":470,"cssLen":1981,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"","css":".absolute {\n position: absolute\n}\n\n.relative {\n position: relative\n}\n\n.-top-\\[150\\%\\] {\n top: -150%\n}\n\n.left-0 {\n left: 0px\n}\n\n.inline-flex {\n display: inline-flex\n}\n\n.h-\\[5px\\] {\n height: 5px\n}\n\n.w-80 {\n width: 20rem\n}\n\n.overflow-hidden {\n overflow: hidden\n}\n\n.rounded-md {\n border-radius: 0.375rem\n}\n\n.border {\n border-width: 1px\n}\n\n.border-b-4 {\n border-bottom-width: 4px\n}\n\n.border-violet-400 {\n --tw-border-opacity: 1;\n border-color: rgb(167 139 250 / var(--tw-border-opacity))\n}\n\n.bg-violet-400 {\n --tw-bg-opacity: 1;\n background-color: rgb(167 139 250 / var(--tw-bg-opacity))\n}\n\n.bg-violet-950 {\n --tw-bg-opacity: 1;\n background-color: rgb(46 16 101 / var(--tw-bg-opacity))\n}\n\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem\n}\n\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem\n}\n\n.font-medium {\n font-weight: 500\n}\n\n.text-violet-400 {\n --tw-text-opacity: 1;\n color: rgb(167 139 250 / var(--tw-text-opacity))\n}\n\n.opacity-50 {\n opacity: 0.5\n}\n\n.shadow-\\[0_0_10px_10px_rgba\\(0\\2c 0\\2c 0\\2c 0\\.3\\)\\] {\n --tw-shadow: 0 0 10px 10px rgba(0,0,0,0.3);\n --tw-shadow-colored: 0 0 10px 10px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)\n}\n\n.shadow-violet-400 {\n --tw-shadow-color: #a78bfa;\n --tw-shadow: var(--tw-shadow-colored)\n}\n\n.outline-none {\n outline: 2px solid transparent;\n outline-offset: 2px\n}\n\n.duration-300 {\n transition-duration: 300ms\n}\n\n.duration-500 {\n transition-duration: 500ms\n}\n\n.hover\\:border-b:hover {\n border-bottom-width: 1px\n}\n\n.hover\\:border-t-4:hover {\n border-top-width: 4px\n}\n\n.hover\\:brightness-150:hover {\n --tw-brightness: brightness(1.5);\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)\n}\n\n.active\\:opacity-75:active {\n opacity: 0.75\n}\n\n.group:hover .group-hover\\:top-\\[150\\%\\] {\n top: 150%\n}"},{"created":"2024-01-22T17:00:01.000Z","isPrivate":0,"projectId":"4d688c","snapshot":null,"tags":null,"title":"button by hamoode-taha-04","updated":"2024-01-22T17:00:01.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":40,"cssLen":806,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"\n","css":".ui-btn {\n cursor: pointer;\n border-radius: 5px;\n color: rgb(219, 218, 218);\n border-style: solid;\n background-color: transparent;\n border-color: rgb(219, 218, 218);\n width: 120px;\n height: 40px;\n transition: 0.2s ease;\n text-transform: uppercase;\n border-width: 2px;\n font-weight: 500;\n font-size: 18px;\n letter-spacing: 2px;\n}\n.ui-btn:hover {\n color: rgb(247, 247, 247);\n background-color: rgb(201, 147, 31);\n border-color: rgb(201, 147, 31);\n text-shadow: 0 0 50px white, 0 0 20px white, 0 0 15px white;\n box-shadow: 0 0 50px rgb(201, 147, 31), 0 0 30px rgb(201, 147, 31),\n 0 0 60px rgb(201, 147, 31), 0 0 120px rgb(201, 147, 31);\n font-size: 20px;\n width: 130px;\n height: 50px;\n letter-spacing: 3px;\n}\n.ui-btn:active {\n width: 115px;\n height: 38px;\n letter-spacing: 0px;\n}\n"},{"created":"2024-01-22T17:00:01.000Z","isPrivate":0,"projectId":"0f871b","snapshot":null,"tags":null,"title":"button by ArnavK-09","updated":"2024-01-22T17:00:01.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":1532,"cssLen":4858,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"\n \n \n \n \n \n Premium\n \n \n\n","css":".inline{display:inline}.flex{display:flex}.h-6{height:1.5rem}.h-full{height:100%}.w-6{width:1.5rem}.w-full{width:100%}.gap-1{gap:0.25rem}.rounded-xl{border-radius:0.75rem}.bg-black\\/80{background-color:rgb(0 0 0 / 0.8)}.bg-gradient-to-br{background-image:linear-gradient(to bottom right, var(--tw-gradient-stops))}.from-yellow-800{--tw-gradient-from:#854d0e var(--tw-gradient-from-position);--tw-gradient-to:rgb(133 77 14 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.via-yellow-600{--tw-gradient-to:rgb(202 138 4 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), #ca8a04 var(--tw-gradient-via-position), var(--tw-gradient-to)}.to-yellow-800{--tw-gradient-to:#854d0e var(--tw-gradient-to-position)}.stroke-yellow-600{stroke:#ca8a04}.p-1{padding:0.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.font-bold{font-weight:700}.text-yellow-600{--tw-text-opacity:1;color:rgb(202 138 4 / var(--tw-text-opacity))}.brightness-150{--tw-brightness:brightness(1.5);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.invert{--tw-invert:invert(100%);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-xl{--tw-backdrop-blur:blur(24px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.ease-in-out{transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.hover\\:rotate-2:hover{--tw-rotate:2deg;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\\:scale-105:hover{--tw-scale-x:1.05;--tw-scale-y:1.05;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\\:from-yellow-700:hover{--tw-gradient-from:#a16207 var(--tw-gradient-from-position);--tw-gradient-to:rgb(161 98 7 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.hover\\:via-yellow-800:hover{--tw-gradient-to:rgb(133 77 14 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), #854d0e var(--tw-gradient-via-position), var(--tw-gradient-to)}.hover\\:to-yellow-600:hover{--tw-gradient-to:#ca8a04 var(--tw-gradient-to-position)}.hover\\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.hover\\:shadow-yellow-700\\/60:hover{--tw-shadow-color:rgb(161 98 7 / 0.6);--tw-shadow:var(--tw-shadow-colored)}.group:hover .group-hover\\:scale-100{--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\\:stroke-yellow-500{stroke:#eab308}.group:hover .group-hover\\:text-yellow-500{--tw-text-opacity:1;color:rgb(234 179 8 / var(--tw-text-opacity))}@media (prefers-color-scheme: dark){.dark\\:brightness-100{--tw-brightness:brightness(1);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}}"},{"created":"2024-01-22T17:00:01.000Z","isPrivate":0,"projectId":"7807ad","snapshot":null,"tags":null,"title":"button by Wlidha09","updated":"2024-01-22T17:00:01.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":92,"cssLen":1105,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n \n

","css":".box {\n height: 66.66%;\n width: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.btn {\n line-height: 50px;\n height: 50px;\n text-align: center;\n width: 150px;\n cursor: pointer;\n color: #FFF;\n transition: all 0.3s;\n position: relative;\n}\n\n.btn button {\n z-index: 2;\n display: block;\n position: absolute;\n width: 100%;\n height: 100%;\n color: #fff;\n font-size: 17px;\n border: none;\n background-color: transparent;\n}\n\n.btn::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1;\n transition: all 0.5s;\n border: 1px solid rgba(255,255,255,0.2);\n background-color: rgba(255,255,255,0.1);\n}\n\n.btn::after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1;\n transition: all 0.5s;\n border: 1px solid rgba(255,255,255,0.2);\n background-color: rgba(255,255,255,0.1);\n}\n\n.btn:hover::before {\n transform: rotate(-45deg);\n background-color: rgba(255,255,255,0);\n}\n\n.btn:hover::after {\n transform: rotate(45deg);\n background-color: rgba(255,255,255,0);\n}"},{"created":"2024-01-22T17:00:01.000Z","isPrivate":0,"projectId":"b6b524","snapshot":null,"tags":null,"title":"button by vinodjangid07","updated":"2024-01-22T17:00:01.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":2693,"cssLen":939,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"\n","css":".Btn {\n width: 45px;\n height: 45px;\n display: flex;\n align-items: center;\n justify-content: center;\n border: none;\n background-color: transparent;\n position: relative;\n /* overflow: hidden; */\n border-radius: 7px;\n cursor: pointer;\n transition: all 0.3s;\n}\n\n.svgContainer {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: transparent;\n backdrop-filter: blur(0px);\n letter-spacing: 0.8px;\n border-radius: 10px;\n transition: all 0.3s;\n border: 1px solid rgba(156, 156, 156, 0.466);\n}\n\n.BG {\n position: absolute;\n content: \"\";\n width: 100%;\n height: 100%;\n background: #181818;\n z-index: -1;\n border-radius: 10px;\n pointer-events: none;\n transition: all 0.3s;\n}\n\n.Btn:hover .BG {\n transform: rotate(35deg);\n transform-origin: bottom;\n}\n\n.Btn:hover .svgContainer {\n background-color: rgba(156, 156, 156, 0.466);\n backdrop-filter: blur(4px);\n}\n"},{"created":"2024-01-22T17:00:01.000Z","isPrivate":0,"projectId":"791738","snapshot":null,"tags":null,"title":"button by Pradeepsaranbishnoi","updated":"2024-01-22T17:00:01.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":2074,"cssLen":763,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"","css":".social-links,.flex-center {\n display: flex;\n justify-content: center;\n align-items: center;\n}\n\n.social-btn {\n cursor: pointer;\n height: 50px;\n width: 50px;\n font-family: 'Titillium Web', sans-serif;\n color: #333;\n border-radius: 10px;\n box-shadow: 0px 10px 10px rgba(0,0,0,0.1);\n background: white;\n margin: 5px;\n transition: 0.3s;\n justify-content: center;\n}\n\n.social-btn svg {\n height: 24px;\n width: 24px;\n}\n\n.social-btn span {\n width: 0px;\n overflow: hidden;\n transition: 0.3s;\n text-align: center;\n margin-left: 5px;\n}\n\n.social-btn:hover {\n width: 150px;\n border-radius: 5px;\n}\n\n.social-btn:hover span {\n padding: 2px;\n width: 80px;\n}\n\n#twitter svg {\n fill: #1da1f2;\n}\n\n#linkedin svg {\n fill: #0e76a8;\n}\n\n#github {\n fill: #333;\n}\n"},{"created":"2024-01-22T17:00:01.000Z","isPrivate":0,"projectId":"cec2c8","snapshot":null,"tags":null,"title":"button by ahmed150up2","updated":"2024-01-22T17:00:01.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":939,"cssLen":845,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"\n\n","css":"button {\n background: transparent;\n position: relative;\n padding: 5px 15px;\n display: flex;\n align-items: center;\n font-size: 17px;\n font-weight: 600;\n text-decoration: none;\n cursor: pointer;\n border: 1px solid #00ace8;\n border-radius: 25px;\n outline: none;\n overflow: hidden;\n color: #00ace8;\n transition: color 0.3s 0.1s ease-out;\n text-align: center;\n fill: #00ace8;\n}\n\nbutton span {\n margin: 10px;\n}\n\nbutton::before {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n content: '';\n border-radius: 50%;\n display: block;\n width: 20em;\n height: 20em;\n left: -5em;\n text-align: center;\n transition: box-shadow 0.5s ease-out;\n z-index: -1;\n}\n\nbutton:hover {\n fill: #fff;\n color: #fff;\n border: 1px solid #00ace8;\n}\n\nbutton:hover::before {\n box-shadow: inset 0 0 0 10em #00ace8;\n}"},{"created":"2024-01-22T17:00:01.000Z","isPrivate":0,"projectId":"04f070","snapshot":null,"tags":null,"title":"button by faxriddin20","updated":"2024-01-22T17:00:01.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":39,"cssLen":648,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"\n","css":".button {\n cursor: pointer;\n box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset,\n rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset,\n rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px,\n rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px,\n rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;\n border: none;\n width: 160px;\n height: 50px;\n color: white;\n background-color: transparent;\n border-radius: 20px;\n transition: all 0.3s ease;\n}\n.button:active {\n box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset,\n rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;\n}\n"},{"created":"2024-01-22T17:00:01.000Z","isPrivate":0,"projectId":"3ef13b","snapshot":null,"tags":null,"title":"button by JaydipPrajapati1910","updated":"2024-01-22T17:00:01.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":1329,"cssLen":870,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"\n\n\n","css":"button {\n background: transparent;\n position: relative;\n padding: 5px 15px;\n display: flex;\n align-items: center;\n font-size: 17px;\n font-weight: 600;\n text-decoration: none;\n cursor: pointer;\n border: 1px solid rgba(88, 101, 242, 1);\n border-radius: 25px;\n outline: none;\n overflow: hidden;\n color: rgba(88, 101, 242, 1);\n transition: color 0.3s 0.1s ease-out;\n text-align: center;\n}\n\nbutton span {\n margin: 10px;\n}\n\nbutton::before {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n margin: auto;\n content: '';\n border-radius: 50%;\n display: block;\n width: 20em;\n height: 20em;\n left: -5em;\n text-align: center;\n transition: box-shadow 0.5s ease-out;\n z-index: -1;\n}\n\nbutton:hover {\n color: #fff;\n border: 1px solid rgba(88, 101, 242, 1);\n}\n\nbutton:hover::before {\n box-shadow: inset 0 0 0 10em rgba(88, 101, 242, 1);\n}"},{"created":"2024-01-22T17:00:01.000Z","isPrivate":0,"projectId":"dadace","snapshot":null,"tags":null,"title":"button by CPC23","updated":"2024-01-22T17:00:01.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":2001,"cssLen":552,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n \n\n

","css":".icons-social-media {\n align-items: center;\n margin-top: 10px;\n padding: 5px;\n width: 32px;\n cursor: pointer !important;\n transition: 300ms all ease-in-out;\n position: relative;\n}\n\n.icons-social-media:hover {\n translate: -0px -10px;\n}\n\n#instagram,\n #youtube,#twitch {\n transition: 300ms all ease-in-out;\n clip-path: circle(65%);\n}\n\n#instagram:hover {\n background-color: rgb(221, 157, 189);\n}\n\n#youtube {\n height: 35px;\n}\n\n#youtube:hover {\n background-color: rgb(241, 96, 96);\n}\n\n#twitch:hover {\n background-color: rgb(196, 143, 245);\n}"},{"created":"2024-01-22T17:00:00.000Z","isPrivate":0,"projectId":"dece22","snapshot":null,"tags":null,"title":"button by vinodjangid07","updated":"2024-01-22T17:00:00.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":360,"cssLen":675,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"","css":".submitBtn {\n width: 120px;\n height: 40px;\n border-radius: 30px;\n border: none;\n box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.13);\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n font-weight: 600;\n cursor: pointer;\n color: white;\n background: linear-gradient(to left,rgb(230, 35, 0),rgb(255, 174, 0));\n letter-spacing: 0.7px;\n}\n\n.submitBtn:hover .arrow {\n animation: slide-in-left 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;\n}\n\n@keyframes slide-in-left {\n 0% {\n transform: translateX(-10px);\n opacity: 0;\n }\n\n 100% {\n transform: translateX(0px);\n opacity: 1;\n }\n}\n\n.submitBtn:active {\n transform: scale(0.97);\n}"}]}},"actionData":null,"errors":null}