{"html":"

\n \n \n \n

Mac Terminal

Log entry 1

Log entry 2

Log entry 3

\n","css":".terminalWrapper {\n display: flex;\n flex-direction: column;\n background: #141410;\n box-sizing: border-box;\n border-radius: 4px;\n position: relative;\n width: 300px;\n}\n\n.terminalWindow {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n height: 30px;\n margin-left: 10px;\n border-bottom: 1px solid #141410;\n}\n\n.terminalWindow i {\n width: 1em;\n height: 1em;\n font-size: 10px;\n border-radius: 50%;\n margin-right: 4px;\n justify-content: center;\n display: flex;\n align-items: center;\n color: #fff;\n}\n\n.terminalWindow i svg {\n width: 1em;\n height: 1em;\n}\n\n.terminalWindow p {\n margin-right: auto;\n font:\n normal 500 12px \"-apple-system\",\n system-ui,\n \"Segoe UI\",\n Roboto,\n \"Helvetica Neue\",\n Arial,\n sans-serif;\n color: #d9d9d9;\n}\n\n.close {\n background: #f5222d;\n}\n\n.resize {\n background: #ffc53d;\n}\n\n.minimize {\n background: #52c41a;\n}\n\n.terminalBody {\n display: flex;\n width: 100%;\n background: #262626;\n box-sizing: border-box;\n color: #fff;\n}\n\n.terminal {\n box-sizing: border-box;\n padding: 12px;\n overflow: hidden;\n overflow-y: scroll;\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n width: 100%;\n}\n\n.terminal p {\n width: 100%;\n font:\n normal 600 12px/16px \"-apple-system\",\n system-ui,\n \"Segoe UI\",\n Roboto,\n \"Helvetica Neue\",\n Arial,\n sans-serif;\n animation: new 400ms 2 forwards;\n}\n\n.terminalEnd {\n background: currentColor;\n width: 2px;\n height: 16px;\n margin-top: 6px;\n animation: terminalAnimation 750ms infinite linear;\n}\n\n@keyframes terminalAnimation {\n 0% {\n opacity: 0;\n }\n 50% {\n opacity: 1;\n }\n 100% {\n opacity: 0;\n }\n}\n\n::-webkit-scrollbar {\n width: 4px;\n}\n\n::-webkit-scrollbar-track {\n background: #141410;\n border-radius: 20px;\n}\n\n::-webkit-scrollbar-thumb {\n border-radius: 20px;\n background: #8c8c8c;\n}\n"}

lazy-tiger-33

👁 实时预览

📝 源代码