From 348a51f2ea3d18e6c3f109e4fb0b6217199ee28f Mon Sep 17 00:00:00 2001
From: elise <hei@elisejakob.no>
Date: Thu, 2 Jul 2026 16:55:53 +0200
Subject: [PATCH] adjust studio icon size and placement

---
 web/src/components/blocks/pageSection.module.scss     | 11 +++++++----
 web/src/components/general/PageContent.tsx            |  4 ++--
 web/src/components/studio/StudioPageView.tsx          |  3 ++-
 .../components/studio/studioPageContent.module.scss   |  3 +++
 4 files changed, 14 insertions(+), 7 deletions(-)
 create mode 100644 web/src/components/studio/studioPageContent.module.scss

diff --git a/web/src/components/blocks/pageSection.module.scss b/web/src/components/blocks/pageSection.module.scss
index 624a552..3fe4e8b 100644
--- a/web/src/components/blocks/pageSection.module.scss
+++ b/web/src/components/blocks/pageSection.module.scss
@@ -51,11 +51,14 @@
   height: var(--size-icon-large);
   background: var(--color-goldenBeige);
   border-radius: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
+  position: relative;
 
   img, svg {
-    width: 100%;
+    width: var(--page-section-icon-scale, 100%);
+    height: var(--page-section-icon-scale, 100%);
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
   }
 }
\ No newline at end of file
diff --git a/web/src/components/general/PageContent.tsx b/web/src/components/general/PageContent.tsx
index bf19ba8..a62cef9 100644
--- a/web/src/components/general/PageContent.tsx
+++ b/web/src/components/general/PageContent.tsx
@@ -1,9 +1,9 @@
 import { Blocks } from "@/components/blocks/Blocks";
 import styles from './pageContent.module.scss';
 
-export const PageContent = ({ blocks }: any) => {
+export const PageContent = ({ blocks, className }: { blocks: any; className?: string }) => {
   return (
-    <div className={styles.pageContent}>
+    <div className={`${styles.pageContent}${className ? ` ${className}` : ''}`}>
       <Blocks blocks={blocks} pageContent />
     </div>
   )
diff --git a/web/src/components/studio/StudioPageView.tsx b/web/src/components/studio/StudioPageView.tsx
index 7b33b6a..1eac85e 100644
--- a/web/src/components/studio/StudioPageView.tsx
+++ b/web/src/components/studio/StudioPageView.tsx
@@ -4,6 +4,7 @@ import { getClient } from "@/app/client";
 import { PageContent } from "@/components/general/PageContent";
 import { BgPig } from "@/components/general/BgPig";
 import { StudioHeader } from "@/components/studio/StudioHeader";
+import styles from "@/components/studio/studioPageContent.module.scss";
 
 const StudioFragmentDefinition = graphql(`
   fragment Studio on StudioPage {
@@ -56,7 +57,7 @@ export function StudioPageView({ page }: StudioPageViewProps) {
     <>
       <main className="site-main" id="main">
         <StudioHeader title={page.title} lead={page.lead} />
-        {page.body && <PageContent blocks={page.body} />}
+        {page.body && <PageContent blocks={page.body} className={styles.studioBody} />}
       </main>
       {page.pig && <BgPig type={page.pig} color="white" />}
     </>
diff --git a/web/src/components/studio/studioPageContent.module.scss b/web/src/components/studio/studioPageContent.module.scss
new file mode 100644
index 0000000..db79687
--- /dev/null
+++ b/web/src/components/studio/studioPageContent.module.scss
@@ -0,0 +1,3 @@
+.studioBody {
+  --page-section-icon-scale: 120%;
+}