mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-07-09 15:58:30 +00:00
feat(playground): update header styles for improved visual consistency
- Enhanced header styles across Playground components to include text-foreground and responsive sizing. - Updated API Playground, API Keys, Runs Table, and other sections for a unified look and feel. - Improved accessibility and readability with consistent font sizes and colors.
This commit is contained in:
parent
f2b326b63b
commit
58b26af1e0
7 changed files with 13 additions and 7 deletions
|
|
@ -50,7 +50,7 @@ export function ApiKeysSection({ workspaceId }: { workspaceId: number }) {
|
|||
return (
|
||||
<div className="space-y-6">
|
||||
<div>
|
||||
<h1 className="text-xl font-semibold">API Keys</h1>
|
||||
<h1 className="text-xl font-semibold text-foreground md:text-2xl">API Keys</h1>
|
||||
<p className="mt-1 text-sm text-muted-foreground">
|
||||
Enable API access for this workspace and manage the keys that use it.
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@ export function PlaygroundIndex({ workspaceId }: { workspaceId: number }) {
|
|||
return (
|
||||
<div className="space-y-8">
|
||||
<div>
|
||||
<h1 className="text-xl font-semibold">API Playground</h1>
|
||||
<h1 className="text-xl font-semibold text-foreground md:text-2xl">API Playground</h1>
|
||||
<p className="mt-1 text-sm text-muted-foreground">
|
||||
Manually run SurfSense's platform-native APIs and inspect their output. Every run is
|
||||
captured under Runs.
|
||||
|
|
|
|||
|
|
@ -189,7 +189,7 @@ export function PlaygroundRunner({ workspaceId, platform, verb }: PlaygroundRunn
|
|||
<div className="grid gap-6 lg:grid-cols-2">
|
||||
<div className="space-y-5">
|
||||
<div>
|
||||
<h1 className="text-lg font-semibold">
|
||||
<h1 className="text-xl font-semibold text-foreground md:text-2xl">
|
||||
{catalogVerb.label} <span className="text-muted-foreground">· {platform}</span>
|
||||
</h1>
|
||||
{capability.description && (
|
||||
|
|
|
|||
|
|
@ -68,7 +68,7 @@ export function RunsTable({ workspaceId }: { workspaceId: number }) {
|
|||
return (
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<h1 className="text-xl font-semibold">Runs</h1>
|
||||
<h1 className="text-xl font-semibold text-foreground md:text-2xl">Runs</h1>
|
||||
<p className="mt-1 text-sm text-muted-foreground">
|
||||
Every platform-native API run in this workspace — from the playground, API keys, and
|
||||
agents. Newest first.
|
||||
|
|
|
|||
|
|
@ -130,7 +130,9 @@ export function PlaygroundLayoutShell({ workspaceId, children }: PlaygroundLayou
|
|||
return (
|
||||
<section className="flex h-full min-h-[min(680px,calc(100vh-5rem))] w-full select-none flex-col gap-6 md:flex-row">
|
||||
<div className="md:w-[220px] md:shrink-0">
|
||||
<h1 className="mb-4 px-1 text-2xl font-semibold tracking-tight">API Playground</h1>
|
||||
<h1 className="mb-4 px-1 text-xl font-semibold tracking-tight text-foreground md:text-2xl">
|
||||
API Playground
|
||||
</h1>
|
||||
<nav className="hidden flex-col gap-0.5 md:flex">
|
||||
{navItems.map((item) => {
|
||||
if (item.type === "section") {
|
||||
|
|
|
|||
|
|
@ -117,7 +117,9 @@ export function UserSettingsLayoutShell({ workspaceId, children }: UserSettingsL
|
|||
return (
|
||||
<section className="flex h-full min-h-[min(680px,calc(100vh-5rem))] w-full select-none flex-col gap-6 md:flex-row">
|
||||
<div className="md:w-[220px] md:shrink-0">
|
||||
<h1 className="mb-4 px-1 text-2xl font-semibold tracking-tight">{t("title")}</h1>
|
||||
<h1 className="mb-4 px-1 text-xl font-semibold tracking-tight text-foreground md:text-2xl">
|
||||
{t("title")}
|
||||
</h1>
|
||||
<nav className="hidden flex-col gap-0.5 md:flex">
|
||||
{navItems.map((item) => (
|
||||
<Link
|
||||
|
|
|
|||
|
|
@ -76,7 +76,9 @@ export function WorkspaceSettingsLayoutShell({
|
|||
return (
|
||||
<section className="flex h-full min-h-[min(680px,calc(100vh-5rem))] w-full select-none flex-col gap-6 md:flex-row">
|
||||
<div className="md:w-[220px] md:shrink-0">
|
||||
<h1 className="mb-4 px-1 text-2xl font-semibold tracking-tight">{t("title")}</h1>
|
||||
<h1 className="mb-4 px-1 text-xl font-semibold tracking-tight text-foreground md:text-2xl">
|
||||
{t("title")}
|
||||
</h1>
|
||||
<nav className="hidden flex-col gap-0.5 md:flex">
|
||||
{navItems.map((item) => (
|
||||
<Link
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue