Ghost/ghost/admin/app/styles/patterns/throbber.css

/* ------------------------------------------------------------
    Throbber

    Pulsing little circle which indicates a tour is available
  ------------------------------------------------------------ */

/* click-area for triggering the popover */
.throbber-trigger {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
}

.throbber {
    position: relative;
    display: block;
    width: 14px;
    height: 14px;
    background: color(var(--blue) alpha(0.9));
    border-radius: 100%;
    box-shadow: color(var(--blue) alpha(0.9)) 0 0 0 2px;
}

.throbber:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    margin: -13px 0 0 -13px;
    width: 26px;
    height: 26px;
    border: rgba(255,255,255,0.1) 2px solid;
    background: rgba(255,255,255,0.4);
    border-radius: 100%;
    box-shadow: color(var(--blue) alpha(0.7)) 0 0 0 2px;
    animation-name: throbber-pulse, throbber-fade;
    animation-duration: 1.5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-fill-mode: forwards;
    animation-delay: 0.2s;
    pointer-events: none;
}

@keyframes throbber-fade {
    0%,
    100% {
        opacity: 0.5;
    }
    40%,
    60% {
        opacity: 0.8;
    }
}

@keyframes throbber-pulse {
    0% {
        transform: scale3d(0.5, 0.5, 1);
    }
    50% {
        transform: scale3d(1, 1, 1);
    }
    100% {
        transform: scale3d(0.5, 0.5, 1);
    }
}