diff --git a/src/components/Icon.tsx b/src/components/Icon.tsx index f5e6d4b..e37facd 100644 --- a/src/components/Icon.tsx +++ b/src/components/Icon.tsx @@ -8,6 +8,7 @@ import { FileZipIcon as FileZip, GearIcon as Gear, GrabberIcon as Grabber, + HourglassIcon as Hourglass, Icon as OcticonIcon, IconProps, MarkdownIcon as Markdown, @@ -25,6 +26,11 @@ function getSVGIconComponent( name: string } { switch (type) { + case 'hourglass': + return { + IconComponent: Hourglass, + name: 'Hourglass', + } case 'submodule': return { IconComponent: Submodule, diff --git a/src/components/LoadingIndicator.tsx b/src/components/LoadingIndicator.tsx index 86bc16f..c0d0dad 100644 --- a/src/components/LoadingIndicator.tsx +++ b/src/components/LoadingIndicator.tsx @@ -8,7 +8,7 @@ export function LoadingIndicator({ text }: Props) { return (
- + {text}
diff --git a/src/content.scss b/src/content.scss index 3dceeb7..2401bc0 100644 --- a/src/content.scss +++ b/src/content.scss @@ -295,7 +295,7 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header- .octicon { width: 20px; height: 20px; - animation: rotate 2s infinite linear; + animation: pulse-rotate 1.8s infinite ease; } } } @@ -558,3 +558,27 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header- transform: rotateZ(360deg); } } + +@keyframes pulse-rotate { + 0% { + transform: rotateZ(0); + } + 20% { + transform: rotateZ(190deg); + } + 30% { + transform: rotateZ(175deg); + } + 50% { + transform: rotateZ(180deg); + } + 70% { + transform: rotateZ(370deg); + } + 80% { + transform: rotateZ(355deg); + } + 100% { + transform: rotateZ(360deg); + } +}