{"html":"

\n Draggable\n \n

Lorem ipsum, or lipsum as it is sometimes known, is dummy text used in laying out print, graphic or web designs. The passage is attributed to an unknown

Feb 24

\n \n \n \n +20\n

\n \n

","css":".task {\n position: relative;\n color: #2e2e2f;\n cursor: move;\n background-color: #fff;\n padding: 1rem;\n border-radius: 8px;\n box-shadow: rgba(99, 99, 99, 0.1) 0px 2px 8px 0px;\n margin-bottom: 1rem;\n border: 3px dashed transparent;\n max-width: 350px;\n}\n\n.task:hover {\n box-shadow: rgba(99, 99, 99, 0.3) 0px 2px 8px 0px;\n border-color: rgba(162, 179, 207, 0.2) !important;\n}\n\n.task p {\n font-size: 15px;\n margin: 1.2rem 0;\n}\n\n.tag {\n border-radius: 100px;\n padding: 4px 13px;\n font-size: 12px;\n color: #ffffff;\n background-color: #1389eb;\n}\n\n.tags {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.options {\n background: transparent;\n border: 0;\n color: #c4cad3;\n font-size: 17px;\n}\n\n.options svg {\n fill: #9fa4aa;\n width: 20px;\n}\n\n.stats {\n position: relative;\n width: 100%;\n color: #9fa4aa;\n font-size: 12px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.stats div {\n margin-right: 1rem;\n height: 20px;\n display: flex;\n align-items: center;\n cursor: pointer;\n}\n\n.stats svg {\n margin-right: 5px;\n height: 100%;\n stroke: #9fa4aa;\n}\n\n.viewer span {\n height: 30px;\n width: 30px;\n background-color: rgb(28, 117, 219);\n margin-right: -10px;\n border-radius: 50%;\n border: 1px solid #fff;\n display: grid;\n align-items: center;\n text-align: center;\n font-weight: bold;\n color: #fff;\n padding: 2px;\n}\n\n.viewer span svg {\n stroke: #fff;\n}\n\n\n"}

breezy-eagle-39

👁 实时预览

📝 源代码