/** * Primary styles * * Author: IPython Development Team * * We'll try to get something prety, so we * have some strange ccs to have the scroll bar on * the left of the left with fix button on the top right of the tooltip */ @-moz-keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } @-webkit-keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } @-moz-keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @-webkit-keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .tooltip a { float: right; } /*properties of tooltip after "expand"*/ .bigtooltip { overflow: auto; height: 200px; -webkit-transition-property: height; -webkit-transition-duration: 1s; -moz-transition-property: height; -moz-transition-duration: 1s; transition-property: height; transition-duration: 1s; } /*properties of tooltip before "expand"*/ .smalltooltip { -webkit-transition-property: height; -webkit-transition-duration: 1s; -moz-transition-property: height; -moz-transition-duration: 1s; transition-property: height; transition-duration: 1s; text-overflow: ellipsis; overflow: hidden; height: 80px; } .tooltipbuttons { position: absolute; padding-right: 15px; top: 0px; right: 0px; } .tooltiptext { /*avoid the button to overlap on some docstring*/ padding-right: 30px; } .tooltip { max-width: 700px; border-radius: 10px 10px 10px 10px; box-shadow: 3px 3px 5px #999; /*fade-in animation when inserted*/ -webkit-animation: fadeOut 800ms; -moz-animation: fadeOut 800ms; animation: fadeOut 800ms; -webkit-animation: fadeIn 800ms; -moz-animation: fadeIn 800ms; animation: fadeIn 800ms; vertical-align: middle; background-color: #f7f7f7; background-image: -webkit-linear-gradient(center bottom, #d7d7d7 13%, #d2d2d2 39%, #e3e3e3 56%, #f7f7f7 91%); background-image: -webkit-gradient(linear, left bottom, left top, color-stop(13%, #d7d7d7), color-stop(39%, #d2d2d2), color-stop(56%, #e3e3e3), color-stop(91%, #f7f7f7)); background-image: -moz-linear-gradient(center bottom, #d7d7d7 13%, #d2d2d2 39%, #e3e3e3 56%, #f7f7f7 91%); background-image: -ms-linear-gradient(center bottom, #d7d7d7 13%, #d2d2d2 39%, #e3e3e3 56%, #f7f7f7 91%); background-image: -o-linear-gradient(center bottom, #d7d7d7 13%, #d2d2d2 39%, #e3e3e3 56%, #f7f7f7 91%); background-image: linear-gradient(center bottom, #d7d7d7 13%, #d2d2d2 39%, #e3e3e3 56%, #f7f7f7 91%); overflow: visible; color: #000000; border: #bbbbbb 1px solid; outline: none; padding: 3px; margin: 0px; padding-left: 7px; font-family: monospace; min-height: 50px; position: absolute; } .pretooltiparrow { left: 0px; margin: 0px; top: -16px; width: 40px; height: 16px; overflow: hidden; position: absolute; } .pretooltiparrow:before { background-color: #f7f7f7; border: 1px #bbbbbb solid; z-index: 11; content: ""; position: absolute; left: 15px; top: 10px; width: 25px; height: 25px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); } .tooltip.hide { -webkit-animation: fadeOut 800ms; -moz-animation: fadeOut 800ms; animation: fadeOut 800ms; opacity: 0; }