{"html":"

\n \n

1
2
3

\n \n

\n","css":".editor-container {\n width: 600px;\n height: 360px;\n background-color: #fff;\n border-radius: 8px;\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n overflow: hidden;\n display: flex;\n flex-direction: column;\n}\n\n.header {\n background-color: #333;\n padding: 8px 16px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.window-controls {\n display: flex;\n align-items: center;\n margin-right: 16px;\n}\n\n.circle {\n width: 12px;\n height: 12px;\n border-radius: 50%;\n margin-right: 8px;\n}\n\n.red {\n background-color: #ff5f56;\n}\n\n.yellow {\n background-color: #ffbd2e;\n}\n\n.green {\n background-color: #27c93f;\n}\n\n.tab {\n background-color: #4b4b4b;\n padding: 8px 16px;\n border-radius: 4px;\n color: #ddd;\n flex-grow: 1;\n}\n\n.editor-wrapper {\n display: flex;\n flex-grow: 1;\n}\n\n.line-numbers {\n background-color: #2d2d2d;\n color: #ddd;\n padding: 16px;\n text-align: right;\n user-select: none;\n overflow: hidden;\n line-height: 1.5;\n}\n\n.editor {\n width: 100%;\n border: none;\n padding: 16px;\n font-size: 16px;\n color: #333;\n background-color: #fff;\n resize: none;\n outline: none;\n line-height: 1.5;\n overflow: auto;\n}\n\n.theme-button {\n background-color: #555;\n color: #fff;\n border: none;\n margin-left: 20px;\n padding: 4px 10px;\n border-radius: 4px;\n cursor: pointer;\n}\n\n.dark-mode .header {\n background-color: #222;\n}\n\n.dark-mode .tab {\n background-color: #333;\n}\n\n.dark-mode .line-numbers {\n background-color: #1a1a1a;\n}\n\n.dark-mode .editor {\n background-color: #2a2a2a;\n color: #ddd;\n}\n\n.editor::-webkit-scrollbar,\n.line-numbers::-webkit-scrollbar {\n display: none;\n}\n\n.editor {\n -ms-overflow-style: none;\n scrollbar-width: none;\n line-height: 1.5;\n background: rgb(223, 225, 235);\n box-shadow:\n 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,\n rgba(0, 0, 0, 0.06) 0px 2px 1px,\n rgba(0, 0, 0, 0.09) 0px 4px 2px,\n rgba(0, 0, 0, 0.09) 0px 8px 4px,\n rgba(0, 0, 0, 0.09) 0px 16px 8px,\n rgba(0, 0, 0, 0.09) 0px 32px 16px;\n}\n\n.line-numbers {\n -ms-overflow-style: none;\n scrollbar-width: none;\n}\n"}

helpless-wasp-83

👁 实时预览

📝 源代码