Header & TOC styling tweaks (#3967)

.changeset/late-emus-jog.md

@@ -0,0 +1,5 @@
+---
+"gitbook": patch
+---
+
+Header & TOC tweaks

packages/gitbook/src/components/Header/HeaderLink.tsx

@@ -115,13 +115,6 @@ function HeaderItemButton(
             href={href}
             variant={variant}
             size="medium"
-            className={tcls(
-                {
-                    'button-primary':
-                        'theme-bold:bg-header-link theme-bold:text-header-background theme-bold:shadow-none hover:theme-bold:bg-header-link hover:theme-bold:text-header-background hover:theme-bold:shadow-none',
-                    'button-secondary': '',
-                }[linkStyle]
-            )}
             insights={{
                 type: 'link_click',
                 link: {

packages/gitbook/src/components/TableOfContents/PageGroupItem.tsx

@@ -27,7 +27,7 @@ export function PageGroupItem(props: { page: ClientTOCPageGroup; isFirst?: boole
                     '[html.sidebar-filled.theme-bold.tint_&]:bg-tint-base',
                     'lg:[html.sidebar-default.theme-gradient_&]:bg-gradient-primary',
                     'lg:[html.sidebar-default.theme-gradient.tint_&]:bg-gradient-tint',
-                    isFirst ? '-mt-4' : ''
+                    isFirst ? '-mt-2 -top-2 rounded-t-2xl pt-2' : ''
                 )}
             >
                 <TOCPageIcon page={page} />

packages/gitbook/src/components/primitives/Button.tsx

@@ -70,12 +70,12 @@ export const variantClasses = {
         'bg-tint-base text-tint',
         'hover:theme-clean:bg-tint-subtle',
 
-        'theme-bold:bg-header-link/2',
+        'theme-bold:bg-header-link/1',
         'theme-bold:text-header-link',
         'theme-bold:shadow-none!',
         'theme-bold:border-header-link/4',
 
-        'hover:theme-bold:bg-header-link/3',
+        'hover:theme-bold:bg-header-link/2',
         'hover:theme-bold:text-header-link',
         'hover:theme-bold:shadow-none',
         'hover:theme-bold:border-header-link/5',