🎨 small tweaks to documentation (#3857)

Author: BorghildSelle

studio/schemas/editors/blockContentType.tsx

@@ -186,9 +186,9 @@ export const BlockTypography = {
     h2_xl: 'text-5xl tracking-display font-normal m-0',
   },
   normal: {
-    h2: 'text-2xl pb-8 m-0',
-    h3: 'text-xl m-0',
-    h4: 'text-lg font-md m-0',
+    h2: 'text-xl leading-lofty mb-8',
+    h3: 'text-lg leading-lofty mt-10 mb-4',
+    h4: 'text-md mt-4 mb-2',
     sm: 'text-sm',
   },
 }

studio/styles/fonts.css

@@ -32,6 +32,7 @@
   --spacing-2: 0.5rem;
   --spacing-4: 0.5rem;
   --spacing-8: 2rem;
+  --spacing-10: 2.5rem;
 
   --leading-md: 1.4; /*68.3071px h1 larger screen */
   --leading-lg: 1.5;
@@ -142,3 +143,20 @@
 .pt-editable .font-semibold *:where([data-slate-leaf='true']) {
   font-weight: var(--font-weight-semibold);
 }
+/* margin doesnt seem to work, so using padding */
+.pt-editable .mb-8 {
+  padding-bottom: var(--spacing-8);
+}
+.pt-editable .mt-10 {
+  padding-top: var(--spacing-10);
+}
+.pt-editable .mb-4 {
+  padding-bottom: var(--spacing-4);
+}
+
+.pt-editable .mt-4 {
+  padding-top: var(--spacing-4);
+}
+.pt-editable .mb-2 {
+  padding-bottom: var(--spacing-2);
+}

web/app/[locale]/(pages)/[...slug]/page.tsx

@@ -2,7 +2,7 @@ import { magazineSlug, newsSlug } from '@energyvision/shared/satelliteConfig'
 import { stegaClean } from '@sanity/client/stega'
 import type { Metadata } from 'next'
 import dynamic from 'next/dynamic'
-import { cookies, draftMode } from 'next/headers'
+import { draftMode } from 'next/headers'
 import { notFound } from 'next/navigation'
 import { setRequestLocale } from 'next-intl/server'
 import { getValidLanguagesLocales } from '@/languageConfig'

web/core/Typography/variants.ts

@@ -22,8 +22,8 @@ const variants = {
     unstyled: '',
     h1: 'text-3xl leading-earthy lg:leading-misty pt-4 mb-6 lg:mb-12 text-balance',
     h2: `text-xl leading-earthy lg:leading-misty mb-4 lg:mb-8 text-balance`,
-    h3: `text-lg leading-lofty mt-4 mb-8 text-balance`,
-    h4: 'text-md mt-2 mb-4 text-balance',
+    h3: `text-lg leading-lofty mt-10 mb-4 text-balance`,
+    h4: 'text-md mt-4 mb-2 text-balance',
     h5: 'text-md text-balance',
     h6: 'text-base text-balance',
     h7: 'text-xs leading-earthy text-balance',
@@ -59,7 +59,7 @@ const variants = {
     overline: 'text-md mb-2 text-pretty',
     ingress: 'text-md mt-5 mb-5 first:mt-0 last:mb-6 text-pretty', //last:mb-10
     eyebrow: 'text-xs font-medium uppercase text-pretty',
-    body: 'my-5 first:mt-0 last:mb-0 [:where(h2+*,h3+*)]:mt-0 text-base text-pretty',
+    body: 'my-6 first:mt-0 last:mb-0 [:where(h2+*,h3+*)]:mt-0 text-base text-pretty',
     small:
       'text-sm my-5 first:mt-0 last:mb-0 [:where(h2+*,h3+*)]:mt-0 text-pretty',
     simple: 'text-base text-pretty',
@@ -83,7 +83,7 @@ const variants = {
     lg:ms-layout-lg`,
     body: `
     text-pretty
-    my-5 
+    my-6 
      :not-only-child:first:mt-0 
      :not-only-child:last:mb-0 
     me-layout-sm

web/sanity/lib/client.ts

@@ -1,16 +1,10 @@
-/*import { ClientConfig, createClient } from '@sanity/client'*/
 import { type ClientConfig, createClient } from 'next-sanity'
 import { apiVersion, dataset, projectId, studioUrl } from '../lib/api'
 
-//import { token } from './token'
-
-//useCdn: true, // Set to false if statically generating pages, using ISR or tag-based revalidation
-
 const sanityConfig: ClientConfig = {
   projectId,
   dataset,
   apiVersion,
-  //handled by definelive?
   //perspective: dataset === 'global-development' ? 'drafts' : 'published',
   useCdn: true,
   ignoreBrowserTokenWarning: dataset === 'global-development',

web/templates/shared/SharedPageContent.tsx

@@ -232,6 +232,15 @@ const applyPaddingTopIfApplicable = (
   if (currentComponent?.type === 'anchorLink') {
     return ''
   }
+
+  //If no hero and the first section after is textblock add pt-20
+  if (
+    index === 0 &&
+    heroProps?.heroType === 'noHero' &&
+    currentComponent?.type === 'textBlock'
+  ) {
+    return 'pt-20'
+  }
   //the first section after hero does not need pt-20, as heroBlock types adds this
   //unless its background image hero
   if (index === 0 && heroProps?.heroType !== 'backgroundImage') {