.xterm{ position: inherit; } .tab-nav { border-bottom: #cacad9 1px solid; } .tab-nav span { background-color: #f0f0f1; height: 32px; line-height: 32px; padding: 0 15px; border: #cacad9 1px solid; color: #444; display: inline-block; margin: 0 -1px -1px 0; cursor: pointer; position: relative; } .tab-nav .on { background: #fff; border-bottom: #fff 1px solid; color: #444 } .tab-con { padding: 10px; position: relative; } .tab-con .tab-block { display: none; height: 100%; width: 100%; } .tab-con .tab-block.on { display: inline-block; } .tab-con ul.cmdlist { list-style-type: decimal } ul.cmdlist { list-style-type: decimal; height: 505px; overflow-y: auto; } .tab-con ul.cmdlist li { position: relative; list-style-type: decimal; list-style-position: inside; line-height: 40px; border-bottom: #dbdbea 1px solid; margin-top: 6px } .tab-con ul.cmdlist li .com-progress, .tab-con ul.cmdlist li .state, .opencmd { float: right; margin-left: 20px; color: #535362 } .tab-con ul.cmdlist li .line-progress { position: absolute; bottom: -1px; left: 0; height: 1px; background-color: #20a53a } .tab-con ul.cmdlist li .cmd { border: 0 none; border-radius: 0; display: block; width: 570px; height: 200px; line-height: 22px; padding: 0 10px; background-color: #333; color: #eee; overflow: auto } .term_item_tab .list { display: inline-block; webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; /* display: flex; */ height: 38px; overflow: hidden; overflow-x: auto; } .term_item_tab .list>span { height: 38px; line-height: 38px; text-align: left; padding: 0 25px 0 22px; display: inline-block; vertical-align: middle; border-right: 1px solid #e2e2e2; cursor: pointer; width: 150px; position: relative; flex-shrink: 0; } .icon-trem-close { height: 18px; width: 18px; position: absolute; top: 50%; margin-top: -8.5px; right: 8px; display: none !important; } .icon-trem-close::after, .icon-trem-close::before { content: ''; height: 14px; width: 2px; display: inline-block; background: #fb0000; z-index: 999; position: absolute; position: absolute; top: 1.5px; left: 8px; transform: rotate(-45deg); } .icon-trem-close::after { transform: rotate(45deg); } .icon-trem-close::before { transform: rotate(-45deg); } /*term_item_tab*/ .term_item_tab .list>span.active .icon-trem-close, .term_item_tab .list>span:hover .icon-trem-close { display: inline-block !important; } .term_item_tab { background: #f1f1f1; font-size: 0; } .term_item_tab .list>span i { transition: all 50ms; } .term_item_tab .list>span .icon { height: 9px; width: 9px; border-radius: 5px; display: inline-block; background: #fff; position: absolute; left: 8px; top: 50%; margin-top: -4.5px; } .term_item_tab .list>span .icon.icon-sucess { background-color: #10952a; } .term_item_tab .list>span .icon.icon-info { background-color: #fc6d26; } .term_item_tab .list>span .icon.icon-warning { background-color: #ff5d2c; } .term_item_tab .list>span:hover { background-color: #dadada; } .term_item_tab .list>span.active { background-color: #424242; } .term_item_tab .list span.active span { color: #fff; } .term_item_tab .list .content { position: relative; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .term_item_tab .item .glyphicon { vertical-align: top; position: absolute; right: 12px; font-size: 15px; height: 38px; line-height: 38px; color: #ff7070 !important; display: none; transition: all 500ms; } .term_item_tab .item .glyphicon:hover { color: red; } .term_item_tab .list span span { vertical-align: middle; font-size: 13px; font-weight: 500; color: #666; display: inline-block; line-height: 37px; } .term_item_tab .glyphicon { font-size: 15px; margin-left: 8px; vertical-align: middle; transition: all 500ms; cursor: pointer; display: inline-block; color: #ea7575; } .term_item_tab span.glyphicon { color: #888; } .term_item_tab .glyphicon:hover { color: red; } .term_item_tab .tab_tootls { padding: 0; float: right; /* padding-right: 15px; */ /* display: inline-block; */ /* display: none; */ } /* .term_item_tab .tab_tootls span{ margin-left: 0; font-size: 12px; display: block; height: 19px; color: #bbb; /* vertical-align: bottom; } */ .term_item_tab .tab_tootls .glyphicon-resize-full, .term_item_tab .tab_tootls .glyphicon-resize-small { height: 38px; line-height: 38px; width: 40px; text-align: center; margin: 0 } .term_item_tab .addServer { display: inline-block; width: 40px; text-align: center; padding: 0; height: 38px; line-height: 38px; vertical-align: top; } .term_item_tab .addServer span { margin: 0; color: #20a53a; } .term_item_tab>span:hover { background-color: #ececec; cursor: pointer; } .term_item_tab .addServer span:hover { color: #4c4c4c; } .term_content_tab { background-color: rgb(51, 51, 51); position: absolute; top: 38px; left: 0; right: 0; bottom: 0; padding: 10px 10px 10px 10px; overflow: hidden; } .term_content_tab .term_item { height: 100%; width: 100%; display: none; } .term_content_tab .term_item.active { display: inline-block; } .term-tool-button { position: absolute; right: -7px; top: 50%; width: 28px; height: 60px; background-color: #565656; border-top-left-radius: 30px; border-bottom-left-radius: 30px; cursor: pointer; z-index: 999; margin-top: -30px; } .term-tool-button span { font-size: 12px; position: relative; left: 15%; top: 35%; font-size: 18px; color: #FFFFFF; cursor: pointer; } .term-tool-button:hover { background-color: #D8D8D8; } .term_box { height: 100%; border-radius: 3px; margin-right: 300px; position: relative; } .term_tootls { width: 290px; position: absolute; right: 15px; top: 15px; /* border: 1px solid #ececec; */ } .term_tootls .tootls_tab { display: inline-block; /* border: 1px solid #20a53a; */ width: 100%; position: relative; } .term_tootls .tootls_tab a { display: inline-block; width: 38px; text-align: center; height: 38px; line-height: 38px; position: absolute; right: 0; color: #ececec; background-color: #c7c7c71a; } .term_tootls .tab-con { /* position: absolute;*/ top: 10px; left: 0; right: 0; bottom: 0; padding: 0; overflow: hidden; } .term_tootls .tootls_tab a:hover { background-color: #8282824d; } .term_tootls .tootls_tab i { font-style: normal; font-size: 12px; color: #ececec; margin-left: 5px; } .main-content .safe { position: relative; } .term_content_tab .xterm .xterm-viewport{ /* On OS X this is required in order for the scroll bar to appear fully opaque */ background-color: #000; overflow-y: auto; cursor: default; position: absolute; right: 0; left: 0; top: 0; bottom: 0; } .term_content_tab .xterm .composition-view.active { display: block; } .term_content_tab .xterm .xterm-viewport::-webkit-scrollbar { width: 8px; height: 5px; border-radius: 4px; } .term_content_tab .xterm .xterm-viewport::-webkit-scrollbar-thumb { border-radius: 0; box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); background: #666; border-radius: 4px; transition: all 1s; } .term_content_tab .xterm .xterm-viewport:hover::-webkit-scrollbar-thumb { background: #aaa; } .term_content_tab .xterm .xterm-viewport::-webkit-scrollbar-track { box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); border-radius: 0; background: #222; border-radius: 4px; transition: all 1s; } .term_content_tab .xterm .xterm-viewport:hover::-webkit-scrollbar-track { background-color: #444; } .tootls_host_list, .tootls_commonly_list { list-style: none; border-top: none; border: 1px solid #ececec; overflow-y: auto; } .tootls_host_list, .tootls_commonly_list { overflow: auto; overflow-x: hidden; font-size: 12px; bottom: 0; right: 0; left: 0; margin-top: 10px; } .tootls_commonly_list li, .tootls_host_list li { display: inline-block; height: 38px; line-height: 38px; color: #444; border-bottom: 1px solid #ececec; font-size: 13px; cursor: pointer; position: relative; width: 100%; } .tootls_commonly_list li { padding-left: 15px; } .tootls_commonly_list li:hover, .tootls_host_list li:hover { background-color: #eee; } .tootls_commonly_list li:hover .tootls, .tootls_host_list li:hover .tootls { display: inline-block; } .tootls_host_list li i { display: inline-block; height: 100%; width: 38px; background-size: 16px; background: url('/plugins/file?name=webssh&f=img/ico-cmd.png') no-repeat center center; } .tootls_commonly_list li>span, .tootls_host_list li>span { vertical-align: top; display: inline-block; } .tootls_commonly_list li:hover>span:nth-child(2), .tootls_host_list li:hover>span:nth-child(2) { width: 120px; } .tootls_commonly_list li>span:nth-child(2), .tootls_host_list li>span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; max-width: 190px; } /* .tootls_host_list li>span:nth-child(2){ margin-left: 35px; } */ .tootls_commonly_list li>span:nth-child(2) { max-width: 190px; } .tootls_commonly_list li span:nth-child(3), .tootls_host_list li span:nth-child(3) { padding-left: 10px; } .tootls_commonly_list li .tootls, .tootls_host_list li .tootls { width: 70px; text-align: right; padding-right: 10px; display: none; position: absolute; right: 5px; } .tootls_commonly_list li .tootls { width: 90px; } .tootls_commonly_list li .tootls span, .tootls_host_list li .tootls span { width: 22px; height: 22px; line-height: 22px; text-align: center; } .tootls_commonly_list li .tootls span:nth-child(1), .tootls_host_list li .tootls span:nth-child(1) { color: #888; font-size: 14px; } .tootls_commonly_list li .tootls span:nth-child(2), .tootls_host_list li .tootls span:nth-child(2) { color: #ea7575; } .tootls_commonly_list li .tootls span:nth-child(2):hover, .tootls_host_list li .tootls span:nth-child(2):hover { color: red; }