UNPKG

private-bower

Version:
92 lines (91 loc) 2.17 kB
grid-panel, .grid-panel { display: block; } grid-panel grid-panel-item, .grid-panel grid-panel-item, grid-panel .grid-panel-item, .grid-panel .grid-panel-item { display: inline-block; vertical-align: top; cursor: pointer; } grid-panel grid-panel-content, .grid-panel grid-panel-content, grid-panel .grid-panel-content, .grid-panel .grid-panel-content { display: block; color: #fff; background-color: #444444; padding: 10px; margin-top: 10px; min-height: 50px; } grid-panel grid-panel-content .triangle, .grid-panel grid-panel-content .triangle, grid-panel .grid-panel-content .triangle, .grid-panel .grid-panel-content .triangle { width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 15px solid #444444; position: relative; margin-top: -15px; top: -8px; -webkit-transition: left ease-out 0.2s; transition: left ease-out 0.2s; } grid-panel grid-panel-content .close-x, .grid-panel grid-panel-content .close-x, grid-panel .grid-panel-content .close-x, .grid-panel .grid-panel-content .close-x { float: right; margin: 2px 5px; cursor: pointer; font-size: 20px; } grid-panel grid-panel-content .close-x:before, .grid-panel grid-panel-content .close-x:before, grid-panel .grid-panel-content .close-x:before, .grid-panel .grid-panel-content .close-x:before { content: "\00D7"; } grid-panel grid-panel-content.ng-enter, .grid-panel grid-panel-content.ng-enter, grid-panel .grid-panel-content.ng-enter, .grid-panel .grid-panel-content.ng-enter { -webkit-animation: slideOpen linear .3s; animation: slideOpen linear .3s; } grid-panel grid-panel-content.ng-leave, .grid-panel grid-panel-content.ng-leave, grid-panel .grid-panel-content.ng-leave, .grid-panel .grid-panel-content.ng-leave { -webkit-animation: slideClose linear .3s; animation: slideClose linear .3s; } @-webkit-keyframes slideOpen { 0% { min-height: 0; height: 0; } 30% { height: 70%; } 100% { height: 100%; } } @-webkit-keyframes slideClose { 0% { height: 100%; } 40% { height: 50%; } 100% { min-height: 0; height: 0; } }