.tydev-utils-log-console-container { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1000; height: 240px; background: rgba(0, 0, 0, 0.8); } .tydev-utils-log-console-control { position: relative; padding: 0 16px; height: 20px; background: var(--comfy-menu-bg); display: flex; flex-direction: row; justify-content: space-between; cursor: row-resize; button { color: var(--descrip-text); background: transparent; border: none; font-family: inherit; font-size: 22px; } button:hover { cursor: pointer; color: white; .arrow-icon { border-color: white; } } } .expand-button { display: flex; flex-direction: row; justify-content: center; width: 60px; position: absolute; left: calc(50% - 30px); cursor: pointer; } .arrow { width: 40px; height: 100%; display: flex; flex-direction: row; justify-content: center; position: relative; } i.arrow-icon { width: 4px; height: 4px; border: solid var(--descrip-text); border-width: 0 3px 3px 0; display: inline-block; padding: 3px; } .arrow-up { top: 6px; .arrow-icon { transform: rotate(-135deg); -webkit-transform: rotate(-135deg); } } .arrow-down { .arrow-icon { transform: rotate(45deg); -webkit-transform: rotate(45deg); } } #tydev-utils-log-console { position: absolute; top: 20px; bottom: 8px; left: 4px; right: 4px; } .tydev-utils-log-console-menu-container { display: flex; flex-direction: row; } #tydev-utils-log-console-state { font-size: 12px; line-height: 20px; } .xterm-viewport { background: transparent !important; } .xterm-viewport::-webkit-scrollbar { background: transparent; } .xterm-viewport::-webkit-scrollbar * { background: transparent; } .xterm-viewport::-webkit-scrollbar-thumb { background: var(--descrip-text) !important; }