{"loaderData":{"0":null,"0-2":{"total":7178,"projects":[{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"065320","snapshot":null,"tags":null,"title":"card by Saad3092003","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":202,"cssLen":1345,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n \n

","css":".obj {\n position: relative;\n width: 200px;\n height: 200px;\n /* background-color: rgb(96, 96, 232); */\n transform-style: preserve-3d;\n transition: 0.5s all;\n transform: rotateX(-25deg) rotateY(20deg);\n}\n\n.objchild {\n animation: rotate 10s infinite linear;\n transform-style: preserve-3d;\n position: absolute;\n width: 100%;\n height: 100%;\n /* background:linear-gradient( to top,rgb(11, 11, 102),rgb(96, 96, 232) ) ; */\n}\n\n.objchild::after {\n content: \"\";\n position: absolute;\n width: 100%;\n height: 100%;\n /* background: rgb(37, 101, 230); */\n /* background: radial-gradient(center center, farthest-side , #9993, transparent); */\n filter: blur(20px);\n box-shadow: 0 0 200px 15px white;\n transform: rotateX(90deg) scale(1.1) translateZ(-120px);\n}\n\n.inn6 {\n position: absolute;\n width: 100%;\n height: 100%;\n background: rgb(21, 21, 21);\n transform: rotateX(90deg) translateZ(100px);\n animation: updown 4s infinite ease-in-out;\n}\n\n@keyframes rotate {\n 0% {\n transform: rotate3d(0,1,0,0deg);\n }\n\n 100% {\n transform: rotate3d(0,1,0,360deg);\n }\n}\n\n@keyframes updown {\n 0% {\n transform: translateY(100px) rotateX(90deg) translateZ(100px);\n }\n\n 50% {\n transform: translateY(200px) rotateX(90deg) translateZ(100px);\n }\n\n 100% {\n transform: translateY(100px) rotateX(90deg) translateZ(100px);\n }\n}"},{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"430168","snapshot":null,"tags":null,"title":"card by ozgeozkaraa01","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":491,"cssLen":1118,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n \n

\n","css":".mx-auto {\n margin-left: auto;\n margin-right: auto\n}\n\n.inline-block {\n display: inline-block\n}\n\n.flex {\n display: flex\n}\n\n.h-4 {\n height: 1rem\n}\n\n.h-80 {\n height: 20rem\n}\n\n.w-4 {\n width: 1rem\n}\n\n.w-72 {\n width: 18rem\n}\n\n.cursor-pointer {\n cursor: pointer\n}\n\n.items-center {\n align-items: center\n}\n\n.rounded-full {\n border-radius: 9999px\n}\n\n.rounded-xl {\n border-radius: 0.75rem\n}\n\n.bg-gray-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(243 244 246 / var(--tw-bg-opacity))\n}\n\n.bg-green-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(34 197 94 / var(--tw-bg-opacity))\n}\n\n.bg-red-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(239 68 68 / var(--tw-bg-opacity))\n}\n\n.bg-yellow-400 {\n --tw-bg-opacity: 1;\n background-color: rgb(250 204 21 / var(--tw-bg-opacity))\n}\n\n.p-3 {\n padding: 0.75rem\n}\n\n.px-1 {\n padding-left: 0.25rem;\n padding-right: 0.25rem\n}\n\n.shadow-2xl {\n --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n --tw-shadow-colored: 0 25px 50px -12px 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}"},{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"14cd2f","snapshot":null,"tags":null,"title":"card by mRcOol7","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":97,"cssLen":1121,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

Magic Card

\n","css":".card {\n --background: linear-gradient(to right, #74ebd5 0%, #acb6e5 100%);\n width: 190px;\n height: 254px;\n padding: 5px;\n border-radius: 1rem;\n overflow: visible;\n background: #74ebd5;\n background: var(--background);\n position: relative;\n z-index: 1;\n}\n\n.card::before,\n.card::after {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border-radius: 1rem;\n z-index: -1;\n}\n\n.card::before {\n background: linear-gradient(to bottom right, #f6d365 0%, #fda085 100%);\n transform: rotate(2deg);\n}\n\n.card::after {\n background: linear-gradient(to top right, #84fab0 0%, #8fd3f4 100%);\n transform: rotate(-2deg);\n}\n\n.card-info {\n --color: #292b2c;\n background: var(--color);\n color: var(--color);\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n overflow: visible;\n border-radius: 0.7rem;\n position: relative;\n z-index: 2;\n}\n\n.card .title {\n font-weight: bold;\n letter-spacing: 0.1em;\n}\n\n.card:hover::before,\n.card:hover::after {\n opacity: 0;\n}\n\n.card:hover .card-info {\n color: #74ebd5;\n transition: color 1s;\n}\n"},{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"551d1c","snapshot":null,"tags":null,"title":"card by micaelgomestavares","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":1573,"cssLen":1187,"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 Sales\n

\n 20%\n

\n 39,500 \n

\n \n

\n","css":".card {\n padding: 1rem;\n background-color: #fff;\n max-width: 320px;\n border-radius: 20px;\n box-shadow: 10px 10px #323232;\n border: 3px solid #323232;\n}\n\n.title {\n display: flex;\n align-items: center;\n}\n\n.title span {\n position: relative;\n padding: 0.5rem;\n background-color: #10B981;\n width: 1.5rem;\n height: 1.5rem;\n border-radius: 9999px;\n}\n\n.title span svg {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n color: #ffffff;\n height: 1rem;\n}\n\n.title-text {\n margin-left: 0.5rem;\n color: #374151;\n font-size: 18px;\n}\n\n.percent {\n margin-left: 0.5rem;\n color: #02972f;\n font-weight: 600;\n display: flex;\n}\n\n.data {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n}\n\n.data p {\n margin-top: 1rem;\n margin-bottom: 1rem;\n color: #1F2937;\n font-size: 2.25rem;\n line-height: 2.5rem;\n font-weight: 700;\n text-align: left;\n}\n\n.data .range {\n position: relative;\n background-color: #E5E7EB;\n width: 100%;\n height: 0.5rem;\n border-radius: 0.25rem;\n}\n\n.data .range .fill {\n position: absolute;\n top: 0;\n left: 0;\n background-color: #10B981;\n width: 76%;\n height: 100%;\n border-radius: 0.25rem;\n}"},{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"056b74","snapshot":null,"tags":null,"title":"card by Javierrocadev","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":478,"cssLen":897,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n All tags\n

JS
wordpress
uiverse
Css
html
go
java
ux/ui
figma

","css":".card {\n width: 290px;\n height: 300px;\n background: #ecf39e;\n padding: 10px;\n display: flex;\n flex-wrap: wrap;\n color: #31572c;\n border-radius: 15px;\n box-shadow: -20px 20px 0px -5px #31572c;\n}\n\n.title {\n font-weight: 900;\n font-size: 1.7em;\n}\n\n.tag__name {\n display: inline-block;\n color: #fff;\n font-size: 1.1em;\n background-color: #31572c;\n padding: 6px 23px 9px;\n border-radius: 70em;\n margin: 8px 6px 8px 0;\n margin-left: 0px;\n position: relative;\n text-transform: lowercase;\n cursor: pointer;\n transition: all .3s ease-in-out;\n}\n\n.tag__name::before,.tag__name::after {\n content: \"\";\n display: inline-block;\n position: absolute;\n top: 40%;\n width: 7px;\n height: 7px;\n border-radius: 50%;\n background: #90a955;\n}\n\n.tag__name::before {\n left: 7px;\n}\n\n.tag__name::after {\n right: 7px;\n}\n\n.tag__name:hover {\n transform: scale(1.1);\n background-color: #51572c;\n}"},{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"92ae85","snapshot":null,"tags":null,"title":"card by javadpg","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":399,"cssLen":978,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

Hover Me

\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Neque hic soluta amet, ipsum quia numquam excepturi veritatis deleniti similique ipsam obcaecati nulla dolor, sapiente earum blanditiis pariatur minima iure repudiandae. \n

","css":".card {\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n position: relative;\n color: #fff;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 300px;\n height: 350px;\n border-radius: 6px;\n transition: .3s;\n background-color: #000;\n}\n\n.card-p {\n position: absolute;\n text-align: center;\n}\n\n.card::after {\n content: \"\";\n position: absolute;\n z-index: -6;\n border-radius: 6px;\n width: 320px;\n height: 370px;\n background-color: #8EC5FC;\n transition: .7s;\n background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%);\n}\n\n.card-countent {\n padding: 20px;\n text-align: center;\n color: transparent;\n transition: all .7s;\n opacity: 0;\n}\n\n.card:hover {\n transition: .7s;\n transform: rotate(180deg);\n}\n\n.card:hover > .card-p {\n color: transparent;\n}\n\n.card:hover > .card-countent {\n opacity: 1;\n color: #000;\n transform: rotate(-180deg);\n}"},{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"894292","snapshot":null,"tags":null,"title":"card by adamgiebl","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":101,"cssLen":946,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

New Magic Card

\n","css":".card {\n --background: linear-gradient(to left, #8c43f2 0%, #ff5c00 100%);\n width: 220px;\n height: 294px;\n padding: 10px;\n border-radius: 01rem;\n overflow: visible;\n background: #8c43f2;\n background: var(--background);\n position: relative;\n z-index: 1;\n}\n\n.card::after {\n position: absolute;\n content: \"\";\n top: 40px;\n left: 0;\n right: 0;\n z-index: -1;\n height: 100%;\n width: 100%;\n transform: scale(0.9);\n filter: blur(30px);\n background: #8c43f2;\n background: var(--background);\n transition: opacity 0.5s;\n}\n\n.card-info {\n --color: #ffffff;\n background: var(--color);\n color: var(--color);\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n overflow: visible;\n border-radius: 0.6rem;\n}\n\n.card .title {\n font-weight: bold;\n letter-spacing: 0.1em;\n}\n\n/*Hover*/\n.card:hover::after {\n opacity: 0;\n}\n\n.card:hover .card-info {\n color: #8c43f2;\n transition: color 1s;\n}\n"},{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"56013b","snapshot":null,"tags":null,"title":"card by Javierrocadev","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":1228,"cssLen":3225,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n 03\n 40\n

\n 90\n \n

\n","css":".absolute{position:absolute}.relative{position:relative}.z-10{z-index:10}.flex{display:flex}.h-44{height:11rem}.h-48{height:12rem}.h-5{height:1.25rem}.w-24{width:6rem}.w-28{width:7rem}.w-5{width:1.25rem}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-around{justify-content:space-around}.justify-evenly{justify-content:space-evenly}.gap-1{gap:0.25rem}.rounded-2xl{border-radius:1rem}.bg-neutral-900{--tw-bg-opacity:1;background-color:rgb(23 23 23 / var(--tw-bg-opacity))}.bg-sky-700{--tw-bg-opacity:1;background-color:rgb(3 105 161 / var(--tw-bg-opacity))}.fill-red-500{fill:#ef4444}.text-6xl{font-size:3.75rem;line-height:1}.font-extrabold{font-weight:800}.font-thin{font-weight:100}.text-gray-50{--tw-text-opacity:1;color:rgb(249 250 251 / var(--tw-text-opacity))}.shadow-inner{--tw-shadow:inset 0 2px 4px 0 rgb(0 0 0 / 0.05);--tw-shadow-colored:inset 0 2px 4px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-gray-50{--tw-shadow-color:#f9fafb;--tw-shadow:var(--tw-shadow-colored)}.outline-double{outline-style:double}.-outline-offset-4{outline-offset:-4px}.outline-sky-800{outline-color:#075985}.before\\:absolute::before{content:var(--tw-content);position:absolute}.before\\:right-6::before{content:var(--tw-content);right:1.5rem}.before\\:top-16::before{content:var(--tw-content);top:4rem}.before\\:h-12::before{content:var(--tw-content);height:3rem}.before\\:h-8::before{content:var(--tw-content);height:2rem}.before\\:w-12::before{content:var(--tw-content);width:3rem}.before\\:w-8::before{content:var(--tw-content);width:2rem}.before\\:rounded-full::before{content:var(--tw-content);border-radius:9999px}.before\\:bg-sky-400::before{content:var(--tw-content);--tw-bg-opacity:1;background-color:rgb(56 189 248 / var(--tw-bg-opacity))}.before\\:blur-xl::before{content:var(--tw-content);--tw-blur:blur(24px);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)}.after\\:absolute::after{content:var(--tw-content);position:absolute}.after\\:-z-20::after{content:var(--tw-content);z-index:-20}.after\\:h-80::after{content:var(--tw-content);height:20rem}.after\\:w-20::after{content:var(--tw-content);width:5rem}.after\\:rounded-2xl::after{content:var(--tw-content);border-radius:1rem}.after\\:bg-sky-700::after{content:var(--tw-content);--tw-bg-opacity:1;background-color:rgb(3 105 161 / var(--tw-bg-opacity))}.after\\:shadow-inner::after{content:var(--tw-content);--tw-shadow:inset 0 2px 4px 0 rgb(0 0 0 / 0.05);--tw-shadow-colored:inset 0 2px 4px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.after\\:shadow-slate-900::after{content:var(--tw-content);--tw-shadow-color:#0f172a;--tw-shadow:var(--tw-shadow-colored)}.after\\:outline-double::after{content:var(--tw-content);outline-style:double}.after\\:-outline-offset-8::after{content:var(--tw-content);outline-offset:-8px}.after\\:outline-sky-800::after{content:var(--tw-content);outline-color:#075985}"},{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"d15efc","snapshot":null,"tags":null,"title":"card by Shoh2008","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":298,"cssLen":1080,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

🏆

※

Ut aliquip ex ea commodo consequat. Duis aute irure dolor

\n Apply Now \n

","css":".card {\n margin: 20px;\n padding: 20px;\n width: 300px;\n min-height: 200px;\n display: grid;\n grid-template-rows: 20px 50px 1fr 50px;\n border-radius: 10px;\n box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.25);\n transition: all 0.2s;\n}\n\n.card:hover {\n box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.4);\n transform: scale(1.01);\n}\n\n.card__link,\n.card__exit,\n.card__icon {\n position: relative;\n text-decoration: none;\n color: rgba(255, 255, 255, 0.9);\n}\n\n.card__link::after {\n position: absolute;\n top: 25px;\n left: 0;\n content: \"\";\n width: 0%;\n height: 3px;\n background-color: rgba(255, 255, 255, 0.6);\n transition: all 0.5s;\n}\n\n.card__link:hover::after {\n width: 100%;\n}\n\n.text {\n color: white;\n}\n\n.card__exit {\n grid-row: 1/2;\n justify-self: end;\n}\n\n.card__icon {\n grid-row: 2/3;\n font-size: 30px;\n}\n\n.card__title {\n grid-row: 3/4;\n font-weight: 400;\n color: #ffffff;\n}\n\n.card__apply {\n grid-row: 4/5;\n align-self: center;\n}\n\n.card-5 {\n background: radial-gradient(#f588d8, #c0a3e5);\n}\n\n@media (max-width: 1600px) {\n .cards {\n justify-content: center;\n }\n}\n"},{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"a3401a","snapshot":null,"tags":null,"title":"card by mobinkakei","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":1600,"cssLen":4100,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"\n

\n \n \n \n

Are you sure?

\n Do you really want to delete your account? This process cannot be undone\n

\n \n Cancel\n \n \n Confirm\n \n

\n\n","css":".relative{position:relative}.mx-auto{margin-left:auto;margin-right:auto}.mb-2{margin-bottom:0.5rem}.ml-4{margin-left:1rem}.mt-2{margin-top:0.5rem}.flex{display:flex}.h-12{height:3rem}.w-12{width:3rem}.w-\\[250px\\]{width:250px}.flex-auto{flex:1 1 auto}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.space-x-1 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.25rem * var(--tw-space-x-reverse));margin-left:calc(0.25rem * calc(1 - var(--tw-space-x-reverse)))}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.border{border-width:1px}.border-2{border-width:2px}.border-gray-600{--tw-border-opacity:1;border-color:rgb(75 85 99 / var(--tw-border-opacity))}.border-gray-800{--tw-border-opacity:1;border-color:rgb(31 41 55 / var(--tw-border-opacity))}.border-green-300{--tw-border-opacity:1;border-color:rgb(134 239 172 / var(--tw-border-opacity))}.bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81 / var(--tw-bg-opacity))}.bg-gray-800{--tw-bg-opacity:1;background-color:rgb(31 41 55 / var(--tw-bg-opacity))}.bg-green-400{--tw-bg-opacity:1;background-color:rgb(74 222 128 / var(--tw-bg-opacity))}.p-2{padding:0.5rem}.p-3{padding:0.75rem}.p-4{padding:1rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.text-center{text-align:center}.text-sm{font-size:0.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.tracking-wider{letter-spacing:0.05em}.text-gray-200{--tw-text-opacity:1;color:rgb(229 231 235 / var(--tw-text-opacity))}.text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219 / var(--tw-text-opacity))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}.shadow-lg{--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)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgb(0 0 0 / 0.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.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}.duration-300{transition-duration:300ms}.ease-in{transition-timing-function:cubic-bezier(0.4, 0, 1, 1)}.hover\\:border-gray-700:hover{--tw-border-opacity:1;border-color:rgb(55 65 81 / var(--tw-border-opacity))}.hover\\:border-green-500:hover{--tw-border-opacity:1;border-color:rgb(34 197 94 / var(--tw-border-opacity))}.hover\\:bg-gray-800:hover{--tw-bg-opacity:1;background-color:rgb(31 41 55 / var(--tw-bg-opacity))}.hover\\:bg-green-500:hover{--tw-bg-opacity:1;background-color:rgb(34 197 94 / var(--tw-bg-opacity))}.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)}@media (min-width: 768px){.md\\:mb-0{margin-bottom:0px}.md\\:block{display:block}}"},{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"1ddbf2","snapshot":null,"tags":null,"title":"card by Yaya12085","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":2848,"cssLen":637,"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\n \n\n \n

\n\n

\n 2 day ago\n

\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Maxime mollitia,\nmolestiae quas vel sint commodi repudiandae consequuntur.\n

\n\n

\n — John Doe\n

\n","css":".card {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n background-color: rgba(255, 255, 255, 1);\n padding: 20px;\n max-width: 320px;\n}\n\n.stars {\n display: flex;\n grid-gap: 0.125rem;\n gap: 0.125rem;\n color: rgb(238, 203, 8);\n}\n\n.star {\n height: 1.25rem;\n width: 1.25rem;\n}\n\n.infos {\n margin-top: 1rem;\n}\n\n.date-time {\n color: rgba(7, 63, 216, 1);\n font-size: 12px;\n font-weight: 600;\n}\n\n.description {\n margin-top: 0.4rem;\n line-height: 1.625;\n color: rgba(107, 114, 128, 1);\n}\n\n.author {\n margin-top: 1.3rem;\n font-size: 0.875rem;\n line-height: 1.25rem;\n color: rgba(107, 114, 128, 1);\n}"},{"created":"2024-01-22T17:11:29.000Z","isPrivate":0,"projectId":"7e65ff","snapshot":null,"tags":null,"title":"card by andrew-demchenk0","updated":"2024-01-22T17:11:29.000Z","isTemplate":1,"htmlType":"html","pureCSS":1,"htmlLen":659,"cssLen":725,"jsLen":0,"nickname":"runjs-editor","avatar":"https://s1.qingting.work/runjs/e93c7c9da5ae4808/0d246acb15da.png","username":"doodle","editors":"1100","html":"

\n \n

lorem ipsum dolor sit amet

","css":".warning {\n font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n width: 320px;\n padding: 12px;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: start;\n background: #F7C752;\n border-radius: 8px;\n box-shadow: 0px 0px 5px -3px #111;\n}\n\n.warning__icon {\n width: 20px;\n height: 20px;\n transform: translateY(-2px);\n margin-right: 8px;\n}\n\n.warning__icon path {\n fill: #393A37;\n}\n\n.warning__title {\n font-weight: 500;\n font-size: 14px;\n color: #393A37;\n}\n\n.warning__close {\n width: 20px;\n height: 20px;\n margin-left: auto;\n cursor: pointer;\n}\n\n.warning__close path {\n fill: #393A37;\n}"}]}},"actionData":null,"errors":null}