[{"id":48,"created_at":"2023-09-16T00:41:32.338939+00:00","html":"","css":"body {\r\n width: 100%;\r\n /* height: 100vh; */\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n background-color: #EBE7E7;\r\n}\r\n\r\nsvg {\r\n width: 256px;\r\n height: 256px;\r\n}\r\n\r\n/* SMOKE */\r\n#smoke-1 {\r\n stroke-dasharray: 0, 10;\r\n animation: smoke 6s ease infinite;\r\n}\r\n\r\n#smoke-2 {\r\n stroke-dasharray: 0, 10;\r\n animation: smoke 6s 0.5s ease infinite;\r\n}\r\n\r\n@keyframes smoke {\r\n 0% {\r\n stroke-dasharray: 0, 10;\r\n }\r\n\r\n 50% {\r\n stroke-dasharray: 10, 0;\r\n }\r\n\r\n 100% {\r\n stroke-dasharray: 10, 0;\r\n opacity: 0;\r\n }\r\n}\r\n\r\n/* WRITING */\r\n#line-1 {\r\n opacity: 0;\r\n animation: writing 0.5s linear forwards;\r\n}\r\n\r\n#line-2 {\r\n opacity: 0;\r\n animation: writing 0.5s 1s linear forwards;\r\n}\r\n\r\n#line-3 {\r\n opacity: 0;\r\n animation: writing 0.5s 1.5s linear forwards;\r\n}\r\n\r\n#line-4 {\r\n opacity: 0;\r\n animation: writing 0.5s 2s linear forwards;\r\n}\r\n\r\n@keyframes writing {\r\n 0% {\r\n width: 0px;\r\n opacity: 1;\r\n }\r\n\r\n 100% {\r\n width: 14px;\r\n opacity: 1;\r\n }\r\n}","js":"// code here","user_id":"1c3624cd-ae3b-4b60-946f-65ea8f296ff7","project_key":"HGNRmq","description":"Animated Programmer Desk With HTML And CSS","plugins":[{"css":{"tailwind":false,"bootstrap":false,"fontawesome":false,"materialicons":true,"googlefonts":false,"bulma":false},"js":{"animejs":false,"gsap":false,"framermotion":false,"threejs":false,"velocity":false,"popmotion":false,"scrollreveal":false}}],"public":true,"config":{"tags": [], "cssProcessor": false},"tags":[],"hide_js":false,"hide_css":false,"messages":[],"view":[{"views":380}],"profiles":{"username":"devcanvas"}}]