/** * Terminalizer Web Plugin * https://terminalizer.com * * @author Mohammad Fares */ .terminalizer { display: inline-block; } .terminalizer .xterm-viewport { overflow-y: hidden; } .terminalizer-frame { position: relative; } /*//// [ Reset ] ////*/ .terminalizer div { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } /*//// [ Window ] ////*/ .terminalizer-frame.terminalizer-window { -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; border: 1px solid #B3B3B3; box-shadow: 0px 0px 18px #B3B3B3; margin: 18px; overflow: hidden; } .terminalizer-frame.terminalizer-window .terminalizer-titlebar { -moz-border-top-left-radius: 6px; -moz-border-top-right-radius: 6px; -webkit-border-top-left-radius: 6px; -webkit-border-top-right-radius: 6px; background: #E8E8E8; background: -moz-linear-gradient(top, #EBEBEB, #D6D6D6); background: -ms-linear-gradient(top, #EBEBEB, #D6D6D6); background: -o-linear-gradient(top, #EBEBEB, #D6D6D6); background: -webkit-gradient(linear, left top, left bottom, color-stop(0.0, #EBEBEB, color-stop(1.0, #D6D6D6))); background: -webkit-linear-gradient(top, #EBEBEB, #D6D6D6); background: linear-gradient(top, #EBEBEB, #D6D6D6); border-bottom: 1px solid #B1AEB1; border-top-left-radius: 6px; border-top-right-radius: 6px; border-top: 1px solid #F3F1F3; color: #3B4247; font-family: Arial, sans-serif; font-size: 14px; height: 22px; line-height: 22px; position: relative; text-align: center; width: 100%; } .terminalizer-frame.terminalizer-window .terminalizer-titlebar .buttons { left: 8px; line-height: 0px; position: absolute; top: 3.5px; } .terminalizer-frame.terminalizer-window .terminalizer-titlebar .close { -moz-border-radius: 50%; -webkit-border-radius: 50%; background: #FF5C5C; border-radius: 50%; border: 1px solid #E33E41; display: inline-block; height: 12px; width: 12px; } .terminalizer-frame.terminalizer-window .terminalizer-titlebar .minimize { -moz-border-radius: 50%; -webkit-border-radius: 50%; background: #FFBD4C; border-radius: 50%; border: 1px solid #E09E3E; display: inline-block; height: 12px; margin-left: 4px; width: 12px; } .terminalizer-frame.terminalizer-window .terminalizer-titlebar .maximize { -moz-border-radius: 50%; -webkit-border-radius: 50%; background: #00CA56; border-radius: 50%; border: 1px solid #14AE46; display: inline-block; height: 12px; margin-left: 4px; width: 12px; } .terminalizer-frame.terminalizer-window .terminalizer-body { background-color: #1D1D1D; padding: 10px; } /*//// [ Floating ] ////*/ .terminalizer-frame.terminalizer-floating { -moz-border-radius: 6px; -webkit-border-radius: 6px; background-color: #1D1D1D; border-radius: 6px; box-shadow: 0px 0px 18px #B3B3B3; margin: 18px; overflow: hidden; } .terminalizer-frame.terminalizer-floating .terminalizer-titlebar { color: white; font-family: Arial, sans-serif; font-size: 14px; height: 34px; line-height: 34px; position: relative; text-align: center; width: 100%; } .terminalizer-frame.terminalizer-floating .terminalizer-titlebar .buttons { left: 13px; line-height: 0px; position: absolute; top: 9px; } .terminalizer-frame.terminalizer-floating .terminalizer-titlebar .close { -moz-border-radius: 50%; -webkit-border-radius: 50%; background: #FF5C5C; border-radius: 50%; display: inline-block; height: 15px; width: 15px; } .terminalizer-frame.terminalizer-floating .terminalizer-titlebar .minimize { -moz-border-radius: 50%; -webkit-border-radius: 50%; background: #FFBD4C; border-radius: 50%; display: inline-block; height: 15px; line-height: 10px; margin-left: 4px; width: 15px; } .terminalizer-frame.terminalizer-floating .terminalizer-titlebar .maximize { -moz-border-radius: 50%; -webkit-border-radius: 50%; background: #00CA56; border-radius: 50%; display: inline-block; height: 15px; line-height: 10px; margin-left: 4px; width: 15px; } .terminalizer-frame.terminalizer-floating .terminalizer-body { padding: 20px; } /*//// [ Solid ] ////*/ .terminalizer-frame.terminalizer-solid { -moz-border-radius: 6px; -webkit-border-radius: 6px; background-color: #1D1D1D; border-radius: 6px; box-shadow: 0px 0px 18px #B3B3B3; margin: 18px; overflow: hidden; } .terminalizer-frame.terminalizer-solid .terminalizer-titlebar { color: white; font-family: Arial, sans-serif; font-size: 14px; position: relative; text-align: center; width: 100%; } .terminalizer-frame.terminalizer-solid .terminalizer-titlebar .title { margin: 15px 15px 15px; } .terminalizer-frame.terminalizer-solid .terminalizer-titlebar .title:empty { display: none; } .terminalizer-frame.terminalizer-solid .terminalizer-titlebar .buttons { display: none; } .terminalizer-frame.terminalizer-solid .terminalizer-body { padding: 20px; }