.popover{ // on top of modals even if they are attached to z-index: $zindex-modal + 10; // give large popups more space.. max-width: 600px; .arrow{ pointer-events: none; // no pointer events (important on system popovers shout not 'detect' hover) } .popover-title{ text-transform: capitalize; font-family: $font-family-readable; font-weight: bold; kbd{ line-height: 90%; vertical-align: middle; box-shadow: none; } } .popover-content { font-family: $font-family-readable; > .hidden + .popover-footer, // first content child is .hidden -> border radius to footer > .popover-footer:first-child { // no content -> border radius to footer border-top-left-radius: ($border-radius-large - 1); border-top-right-radius: ($border-radius-large - 1); } } .popover-footer{ margin: 0; // reset heading margin padding: 8px 14px; // same as popover-title background-color: $popover-title-bg; border-top: 1px solid darken($popover-bg, 5%); border-bottom-left-radius: ($border-radius-large - 1); border-bottom-right-radius: ($border-radius-large - 1); } // image in popover img{ border-radius: 3px; } h4{ color: $gray-lighter; } // table in pop popover table{ color: $gray-lighter; line-height: 16px; font-size: 11px; td{ padding: 0 4px; // 10px popover padding + 4px table cell padding == 14px -> same as popover title vertical-align: middle !important; } } .select2-container{ // Select2 within popover (xEditable field) margin-top: -1px; // strange UI bug 1px off margin-left: -1px; // strange UI bug 1px off } } // smaller variant ---------------------------------------------------------------------------------------------------- .popover-small{ .popover-title { padding: 4px 6px; } .popover-content { padding: 4px 2px 4px; } // "special" content wrapper for popups with "footer" (.popover-footer) element .popover-content-inner{ padding: 7px 6px 0; } .popover-footer{ padding: 6px 6px; } } // specific "Pathfinder" Popover settings ----------------------------------------------------------------------------- .pf-popover{ display: initial; .popover-content{ padding: 0; // overwrite default popover padding } h6{ white-space: nowrap; margin-right: 50px; @include clearfix(); } .well{ margin-top: 7px; margin-bottom: 10px; } .list-group{ margin: 0; .list-group-item{ color: $gray-dark; &:hover{ color: $gray-darkest; } &.disabled{ background-color: $gray; color: $gray-light; cursor: not-allowed; } img{ width: 30px; margin: -8px 10px -6px -8px; border-radius: 0; // overwrite "global" } i{ margin-right: 20px; } } } .pf-popover-list-icon{ width: 28px; margin: 5px 0; &:first-child{ margin-left: 8px; } &:last-child{ margin-right: 8px; } } } // character popover -------------------------------------------------------------------------------------------------- .pf-popover-character{ .table>tbody>tr>td{ border: none; white-space: nowrap; &:first-child + td{ // 2nd column padding: 0 5px; } } .well{ margin-bottom: 0; // overwrite default line-height: 13px; } }