info/developer-roadmap
1
0
Fork 0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-07-31 06:20:14 +02:00
Code Issues Releases Wiki Activity

Fix page progress

Browse Source
This commit is contained in:
Arik Chakma
2023-11-10 03:02:12 +06:00
parent 27cb89494f
commit 9f4967929f
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/PageProgress.tsx
View File

@@ -1,7 +1,7 @@
import { useStore } from '@nanostores/react'; import { useStore } from '@nanostores/react';
import SpinnerIcon from '../icons/spinner.svg';
import { pageProgressMessage } from '../stores/page'; import { pageProgressMessage } from '../stores/page';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { Spinner } from './ReactIcons/Spinner';
export interface Props { export interface Props {
initialMessage: string; initialMessage: string;
@@ -30,10 +30,10 @@ export function PageProgress(props: Props) {
{/* Tailwind based spinner for full page */} {/* Tailwind based spinner for full page */}
<div className="fixed left-0 top-0 z-50 flex h-full w-full items-center justify-center bg-white bg-opacity-75"> <div className="fixed left-0 top-0 z-50 flex h-full w-full items-center justify-center bg-white bg-opacity-75">
<div className="flex items-center justify-center rounded-md border bg-white px-4 py-2 "> <div className="flex items-center justify-center rounded-md border bg-white px-4 py-2 ">
<img <Spinner
src={SpinnerIcon.src} className="h-4 w-4 sm:h-4 sm:w-4"
alt="Loading" outerFill="#e5e7eb"
className="h-4 w-4 animate-spin fill-blue-600 text-gray-200 sm:h-4 sm:w-4" innerFill="#2563eb"
/> />
<h1 className="ml-2"> <h1 className="ml-2">
{message} {message}