clone of olivero for island lives
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

112 lines
2.3 KiB

12 months ago
/*
* DO NOT EDIT THIS FILE.
* See the following change record for more information,
* https://www.drupal.org/node/3084859
* @preserve
*/
/**
* @file
* Visual styles for ajax-progress throbber.
*/
.ajax-progress {
display: inline-block;
}
/**
* Throbber.
*/
.ajax-progress-throbber {
position: relative;
display: inline-flex;
align-content: center;
height: 1.125rem;
margin-block-start: -0.1875rem;
margin-block-end: 0;
margin-inline-start: var(--sp0-5);
margin-inline-end: var(--sp0-5);
vertical-align: middle;
white-space: nowrap;
line-height: 1.125rem;
}
.ajax-progress-throbber .throbber {
width: 1.125rem;
height: 1.125rem;
border-width: 2px;
border-color: var(--color--primary-50) transparent var(--color--primary-50) var(--color--primary-50);
}
.ajax-progress-throbber .message {
display: inline-block;
padding-inline-start: var(--sp0-5);
font-size: var(--font-size-s);
font-weight: 400;
}
/**
* Full screen throbber.
*/
.ajax-progress-fullscreen {
position: fixed;
z-index: 1000;
inset-block-start: 50%;
inset-inline-start: 50%;
width: 3.5rem;
height: 3.5rem;
margin: -1.75rem;
border: 1px solid var(--color--gray-70);
border-radius: 3.5rem;
background-color: var(--color--white);
box-shadow: 0 0.25rem 0.625rem rgba(34, 35, 48, 0.1); /* LTR */
}
.ajax-progress-fullscreen::before {
position: absolute;
inset-block-start: 50%;
inset-inline-start: 50%;
width: 1.75rem;
height: 1.75rem;
margin: -0.875rem;
content: "";
border-width: 3px;
}
[dir="rtl"] .ajax-progress-fullscreen {
box-shadow: 0 -0.25rem 0.625rem rgba(34, 35, 48, 0.1);
}
/**
* Common styles for all kinds of throbbers.
*/
.ajax-progress-throbber .throbber,
.ajax-progress-fullscreen::before {
animation: olives-throbber 0.75s linear infinite;
border-style: solid dotted solid solid;
border-color: var(--color--primary-50) transparent var(--color--primary-50) var(--color--primary-50);
border-radius: 50%;
}
/**
* Remove margin from ajax throbbers following buttons because buttons already
* have a large margin set.
*/
html.js .button:not(.js-hide) + .ajax-progress-throbber {
margin-inline-start: 0;
}
@keyframes olives-throbber {
0% {
transform: rotateZ(0);
}
100% {
transform: rotateZ(360deg);
}
}