diff --git a/src/components/StepList.astro b/src/components/StepList.astro index 2d08fb4..3d0a7d7 100644 --- a/src/components/StepList.astro +++ b/src/components/StepList.astro @@ -14,7 +14,9 @@ const { steps, currentStep } = Astro.props as { { steps.map((step, i) => (
  • -
    {i + 1}
    +
    + {i + 1} +

    {step.title}

  • )) @@ -27,7 +29,7 @@ const { steps, currentStep } = Astro.props as { background: #f9fafb; /* light gray */ border: 1px solid #e5e7eb; /* gray border */ border-radius: 0.75rem; /* rounded corners */ - padding: 1.5rem; + padding: 1rem; max-width: 400px; /* optional, keeps it compact */ } @@ -37,7 +39,7 @@ const { steps, currentStep } = Astro.props as { margin: 0; display: flex; flex-direction: column; - gap: 1rem; + gap: 0.5rem; } .step { @@ -69,7 +71,7 @@ const { steps, currentStep } = Astro.props as { background: #3b82f6; /* blue */ border-color: #3b82f6; color: white; - animation: pulse 1.5s infinite; + animation: pulse 2s infinite; } .circle.todo { @@ -84,12 +86,11 @@ const { steps, currentStep } = Astro.props as { } @keyframes pulse { - 0%, - 100% { + 0% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.6); } - 50% { - box-shadow: 0 0 0 6px rgba(59, 130, 246, 0); + 100% { + box-shadow: 0 0 0 8px rgba(59, 130, 246, 0); } } diff --git a/src/components/StepListReceive.astro b/src/components/StepListReceive.astro new file mode 100644 index 0000000..c1ecba0 --- /dev/null +++ b/src/components/StepListReceive.astro @@ -0,0 +1,15 @@ +--- +import StepList from "./StepList.astro"; + +const { currentStep } = Astro.props; +--- + +