feat: Add KendoReact credit to login screen

src/components/UI/Copyright.jsx

@@ -30,7 +30,7 @@ export default function Copyright({ isLoginPage, isLoggedIn }) {
         marginTop: "1rem",
         transition: "all 0.8s ease-in-out",
         position: isLoginPage ? "fixed" : "relative",
-        top: isLoginPage ? (isCentered ? "65%" : "90%") : "auto",
+        top: isLoginPage ? (isCentered ? "65%" : "calc(90% + 3px)") : "auto",
         left: isLoginPage ? "50%" : "auto",
         transform: isLoginPage ? "translate(-50%, -50%)" : "none"
       }}

src/pages/Login.jsx

@@ -5,6 +5,7 @@ import Logo from '../assets/images/campfire_logs_square_logo_bg_match.png';
 const LoginPage = React.forwardRef(({ onLogin }, ref) => {
     const [showLogin, setShowLogin] = useState(false);
     const [isTransitioning, setIsTransitioning] = useState(true);
+    const [showKendoCredit, setShowKendoCredit] = useState(false);
 
     useEffect(() => {
         // Prevent scrollbar during initial load
@@ -20,6 +21,11 @@ const LoginPage = React.forwardRef(({ onLogin }, ref) => {
             setShowLogin(true);
         }, 1500); // Give copyright more time to transition
 
+        // Third: show KendoReact credit after login appears
+        const kendoTimer = setTimeout(() => {
+            setShowKendoCredit(true);
+        }, 1800); // After login form appears
+
         // Re-enable scrolling after everything is completely done
         const scrollTimer = setTimeout(() => {
             document.body.style.overflow = 'auto';
@@ -28,6 +34,7 @@ const LoginPage = React.forwardRef(({ onLogin }, ref) => {
         return () => {
             clearTimeout(transitionTimer);
             clearTimeout(loginTimer);
+            clearTimeout(kendoTimer);
             clearTimeout(scrollTimer);
             // Cleanup: restore scrolling if component unmounts
             document.body.style.overflow = 'auto';
@@ -74,6 +81,43 @@ const LoginPage = React.forwardRef(({ onLogin }, ref) => {
             }}>
                 <LoginComponent onLogin={onLogin} />
             </div>
+            
+            {/* KendoReact Credit - appears after login form */}
+            <div style={{
+                opacity: showKendoCredit ? 1 : 0,
+                transition: 'opacity 0.6s ease-in-out',
+                visibility: showKendoCredit ? 'visible' : 'hidden',
+                position: 'fixed',
+                bottom: '65px',
+                left: '50%',
+                transform: 'translateX(-50%)',
+                fontSize: '12px',
+                fontStyle: 'italic',
+                zIndex: 1000,
+                padding: '5px 0',
+                lineHeight: '1.2'
+            }}>
+                Powered by{' '}
+                <a 
+                    href="https://www.telerik.com/kendo-react-ui" 
+                    target="_blank" 
+                    rel="noopener noreferrer" 
+                    style={{ 
+                        color: '#d94f27', 
+                        textDecoration: 'none',
+                        transition: 'color 0.2s ease',
+                        cursor: 'pointer',
+                        display: 'inline-block',
+                        padding: '2px 4px',
+                        margin: '-2px -4px',
+                        borderRadius: '2px'
+                    }}
+                    onMouseEnter={(e) => e.target.style.color = '#ff6f48'}
+                    onMouseLeave={(e) => e.target.style.color = '#d94f27'}
+                >
+                    KendoReact UI
+                </a>
+            </div>
         </div>
     );
 });