modelcontextprotocol/use-mcp
Watch
1
0
Fork
You've already forked use-mcp
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

I am dum. CSS is smrt

Browse source
This commit is contained in:
Glen Maddern 2025-06-24 14:04:27 +10:00
commit 8049c6bebe
3 changed files with 7 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

1
examples/chat-ui/src/components/ChatApp.tsx
View file

@ -107,7 +107,6 @@ const ChatApp: React.FC<ChatAppProps> = () => {
className="flex min-h-screen w-screen animated-bg-container" className="flex min-h-screen w-screen animated-bg-container"
style={{ '--random-delay': `${animationDelay}s` } as React.CSSProperties} style={{ '--random-delay': `${animationDelay}s` } as React.CSSProperties}
> >
<div className="animated-bg"></div>
<div className="flex flex-row flex-grow flex-1 min-h-screen relative"> <div className="flex flex-row flex-grow flex-1 min-h-screen relative">
{/* Sidebar and Navbar components hidden but kept in codebase */} {/* Sidebar and Navbar components hidden but kept in codebase */}
{false && ( {false && (

1
examples/chat-ui/src/components/OAuthCallback.tsx
View file

@ -8,7 +8,6 @@ export function OAuthCallback() {
return ( return (
<div className="min-h-screen animated-bg-container flex items-center justify-center p-4"> <div className="min-h-screen animated-bg-container flex items-center justify-center p-4">
<div className="animated-bg"></div>
<div className="bg-white rounded-lg shadow-xl p-8 text-center max-w-md w-full"> <div className="bg-white rounded-lg shadow-xl p-8 text-center max-w-md w-full">
<h1 className="text-2xl font-bold text-zinc-900 mb-4">Authenticating...</h1> <h1 className="text-2xl font-bold text-zinc-900 mb-4">Authenticating...</h1>
<p className="text-zinc-600 mb-2">Please wait while we complete your authentication.</p> <p className="text-zinc-600 mb-2">Please wait while we complete your authentication.</p>

28
examples/chat-ui/src/index.css
View file

@ -14,32 +14,18 @@
.animated-bg-container { .animated-bg-container {
position: relative; position: relative;
/*overflow: hidden;*/ /*overflow: hidden;*/
/*height: 500vh;*/ height: 500vh;
} }
.animated-bg { .animated-bg-container::before {
content: ''; content: '';
position: absolute; position: absolute;
top: 0vh; top: 0;
left: 0vw; left: 0;
right: 0vw; right: 0;
bottom: 0vh; bottom: 0;
overflow: hidden; background: repeating-linear-gradient(150deg, #fdf2f8, #faf5ff, #eef2ff, #faf5ff, #fdf2f8 100vmax);
}
.animated-bg::before {
content: '';
position: absolute;
top: -100vh;
left: -1000vw;
right: -1000vw;
bottom: -100vh;
background: linear-gradient(180deg, #fdf2f8, #faf5ff, #eef2ff, #faf5ff, #fdf2f8);
/*background: linear-gradient(180deg, red, black, blue, black, red);*/
background-size: 100% 200vh;
background-repeat: repeat-y;
animation: hue-rotate 60s linear infinite; animation: hue-rotate 60s linear infinite;
animation-delay: var(--random-delay, 0s); animation-delay: var(--random-delay, 0s);
z-index: -1; z-index: -1;
transform: rotate(-20deg);
} }