react-spotlight-tour-cct/src/components/Highlight.css

A lightweight and customizable React component for creating guided tours in your web applications. Highlight elements and display step-by-step instructions to guide users through your app's features.

.highlighted {
    position: relative;
    z-index: 1001; /* Ensure it's above the popup */
    border: 4px solid #e6c74c; /* Yellow border for the highlight */
    border-radius: 8px;
    box-shadow: 0 0 10px 3px rgba(255, 204, 0, 0.7);
    animation: pulse 1.5s infinite;
  }
  
  @keyframes pulse {
    0% {
      box-shadow: 0 0 10px 3px rgba(255, 255, 255, 0.7);
    }
    50% {
      box-shadow: 0 0 20px 6px rgb(255, 255, 255);
    }
    100% {
      box-shadow: 0 0 10px 3px rgba(255, 255, 255, 0.7);
    }
  }