// core .p-confirm-popup { position: absolute; margin-top: 10px; top: 0; left: 0; } .p-confirm-popup-flipped { margin-top: -10px; margin-bottom: 10px; } /* Animation */ .p-confirm-popup-enter-from { opacity: 0; transform: scaleY(0.8); } .p-confirm-popup-leave-to { opacity: 0; } .p-confirm-popup-enter-active { transition: transform 0.12s cubic-bezier(0, 0, 0.2, 1), opacity 0.12s cubic-bezier(0, 0, 0.2, 1); } .p-confirm-popup-leave-active { transition: opacity 0.1s linear; } .p-confirm-popup:after, .p-confirm-popup:before { bottom: 100%; left: calc(var(--overlayArrowLeft, 0) + 1.25rem); content: " "; height: 0; width: 0; position: absolute; pointer-events: none; } .p-confirm-popup:after { border-width: 8px; margin-left: -8px; } .p-confirm-popup:before { border-width: 10px; margin-left: -10px; } .p-confirm-popup-flipped:after, .p-confirm-popup-flipped:before { bottom: auto; top: 100%; } .p-confirm-popup.p-confirm-popup-flipped:after { border-bottom-color: transparent; } .p-confirm-popup.p-confirm-popup-flipped:before { border-bottom-color: transparent; } .p-confirm-popup .p-confirm-popup-content { display: flex; align-items: center; } // theme .p-confirm-popup { background: $overlayContentBg; color: $panelContentTextColor; border: $overlayContentBorder; border-radius: $borderRadius; box-shadow: $overlayContainerShadow; .p-confirm-popup-content { padding: $confirmPopupContentPadding; } .p-confirm-popup-footer { text-align: right; padding: $confirmPopupFooterPadding; button { margin: 0 $inlineSpacing 0 0; width: auto; &:last-child { margin: 0; } } } &:after { border-style: solid; border-color: rgba($overlayContentBg, 0); border-bottom-color: $overlayContentBg; } &:before { border-style: solid; @if (nth($overlayContentBorder, 2) == "none") { border-color: rgba($overlayContentBg, 0); border-bottom-color: scale-color($overlayContentBg, $lightness: -5%); } @else { border-color: rgba(nth($overlayContentBorder, 3), 0); border-bottom-color: scale-color( nth($overlayContentBorder, 3), $lightness: -5% ); } } &.p-confirm-popup-flipped { &:after { border-top-color: $overlayContentBg; } &:before { @if (nth($overlayContentBorder, 2) == "none") { border-top-color: $overlayContentBg; } @else { border-top-color: nth($overlayContentBorder, 3); } } } .p-confirm-popup-icon { font-size: $primeIconFontSize * 1.5; &.p-icon { width: $primeIconFontSize * 1.5; height: $primeIconFontSize * 1.5; } } .p-confirm-popup-message { margin-left: $inlineSpacing * 2; } }