From 947e37168db99d9a4713d4ba109c7213b81d68ad Mon Sep 17 00:00:00 2001 From: Usman Baig Date: Sat, 21 Feb 2026 23:45:05 +0100 Subject: [PATCH] style: update background colors and border styles in integration and installation pages for improved visual consistency --- app/installation/page.tsx | 8 ++++---- app/integrations/nextjs/page.tsx | 8 ++++---- app/integrations/react/page.tsx | 8 ++++---- app/integrations/vue/page.tsx | 8 ++++---- app/integrations/wordpress/page.tsx | 4 ++-- docs/DESIGN_SYSTEM.md | 4 ++-- 6 files changed, 20 insertions(+), 20 deletions(-) diff --git a/app/installation/page.tsx b/app/installation/page.tsx index 27ff4d4..a4c1d3c 100644 --- a/app/installation/page.tsx +++ b/app/installation/page.tsx @@ -33,8 +33,8 @@ export default function InstallationPage() {

Add the snippet

Just add this snippet to your <head> tag in your layout or index file.

-
-
+
+
@@ -63,8 +63,8 @@ export default function InstallationPage() {

Track custom events (e.g. signup, purchase) with pulse.track('event_name'). Use letters, numbers, and underscores only. Define goals in your site Settings → Goals & Events to see counts in the dashboard.

-
-
+
+
diff --git a/app/integrations/nextjs/page.tsx b/app/integrations/nextjs/page.tsx index 90100fc..2a26425 100644 --- a/app/integrations/nextjs/page.tsx +++ b/app/integrations/nextjs/page.tsx @@ -48,8 +48,8 @@ export default function NextJsIntegrationPage() { Add the script to your root layout file (usually app/layout.tsx or app/layout.js).

-
-
+
+
app/layout.tsx
@@ -84,8 +84,8 @@ export default function RootLayout({ If you are using the older Pages Router, add the script to your custom _app.tsx or _document.tsx.

-
-
+
+
pages/_app.tsx
diff --git a/app/integrations/react/page.tsx b/app/integrations/react/page.tsx index cecbe77..9c29053 100644 --- a/app/integrations/react/page.tsx +++ b/app/integrations/react/page.tsx @@ -49,8 +49,8 @@ export default function ReactIntegrationPage() { The simplest way is to add the script tag directly to the <head> of your index.html file.

-
-
+
+
public/index.html
@@ -83,8 +83,8 @@ export default function ReactIntegrationPage() { If you need to load the script dynamically (e.g., only in production), you can use a useEffect hook in your main App component.

-
-
+
+
src/App.tsx
diff --git a/app/integrations/vue/page.tsx b/app/integrations/vue/page.tsx index 28af5e0..81434c5 100644 --- a/app/integrations/vue/page.tsx +++ b/app/integrations/vue/page.tsx @@ -49,8 +49,8 @@ export default function VueIntegrationPage() { Add the script tag to the <head> section of your index.html file. This works for both Vue 2 and Vue 3 projects created with Vue CLI or Vite.

-
-
+
+
index.html
@@ -84,8 +84,8 @@ export default function VueIntegrationPage() { For Nuxt.js applications, you should add the script to your nuxt.config.js or nuxt.config.ts file.

-
-
+
+
nuxt.config.ts
diff --git a/app/integrations/wordpress/page.tsx b/app/integrations/wordpress/page.tsx index 93da9df..bd80d9f 100644 --- a/app/integrations/wordpress/page.tsx +++ b/app/integrations/wordpress/page.tsx @@ -50,8 +50,8 @@ export default function WordPressIntegrationPage() {
  • Paste the following code snippet:
  • -
    -
    +
    +
    Header Script
    diff --git a/docs/DESIGN_SYSTEM.md b/docs/DESIGN_SYSTEM.md index 321547b..b6cfa30 100644 --- a/docs/DESIGN_SYSTEM.md +++ b/docs/DESIGN_SYSTEM.md @@ -817,9 +817,9 @@ Always test both light and dark modes: ### VS Code-Style Syntax Highlighting ```tsx -
    +
    {/* Header bar */} -
    +