From c6ff7668c5c333bf8dcfc7e320571f5a4706ff75 Mon Sep 17 00:00:00 2001
From: Benno Tielen <Benno@tielen.nl>
Date: Fri, 13 Mar 2026 07:51:56 +0100
Subject: [PATCH] fix: fix button sizes

---
 src/components/Button/styles.module.scss      |  2 ++
 src/components/PopupButton/PopupButton.tsx    |  8 +++-----
 src/components/PopupButton/styles.module.scss | 20 +++++++++----------
 3 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/src/components/Button/styles.module.scss b/src/components/Button/styles.module.scss
index e4f3298..d6350fd 100644
--- a/src/components/Button/styles.module.scss
+++ b/src/components/Button/styles.module.scss
@@ -12,6 +12,8 @@
   text-decoration: none;
   margin: 0;
   display: inline-block;
+  line-height: 147%;
+  //box-sizing: content-box;
   -webkit-tap-highlight-color: transparent;
 }
 
diff --git a/src/components/PopupButton/PopupButton.tsx b/src/components/PopupButton/PopupButton.tsx
index 07f9bec..fb0f1f3 100644
--- a/src/components/PopupButton/PopupButton.tsx
+++ b/src/components/PopupButton/PopupButton.tsx
@@ -38,11 +38,9 @@ export const PopupButton = ({size = "md", schema, text, links, title}: PopupButt
   return (
     <div className={styles.container}>
 
-      <div className={styles.button}>
-        <Button size={size} schema={schema} onClick={() => setIsPopupOpen(true)}>
-          {text}
-        </Button>
-      </div>
+      <Button size={size} schema={schema} onClick={() => setIsPopupOpen(true)}>
+        {text}
+      </Button>
 
       {isPopupOpen && (
         <div className={styles.popup}>
diff --git a/src/components/PopupButton/styles.module.scss b/src/components/PopupButton/styles.module.scss
index 7fcf38c..3333f0d 100644
--- a/src/components/PopupButton/styles.module.scss
+++ b/src/components/PopupButton/styles.module.scss
@@ -1,28 +1,26 @@
 @import 'template.scss';
 
 .container {
-  display: inline-grid;
-  place-items: center;
-  grid-template-areas: "a";
-  grid-template-rows: fit-content(0);
-}
-
-.button {
-  grid-area: a;
+  position: relative;
+  display: inline-block;
 }
 
 .popup {
-  grid-area: a;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 1;
   background-color: $white;
   box-shadow: 0 0 21px 0 rgba(0,0,0,0.4);
   border-radius: 7px;
   min-width: 200px;
-  position: relative;
   overflow: auto;
 }
 
 .popupTitle {
   font-weight: bold;
+  font-size: 16px;
   text-align: center;
   padding: 10px 0;
   border-bottom: 1px solid $border-color-light;
@@ -33,7 +31,7 @@
   text-decoration: none;
   padding: 5px 15px;
   display: block;
-  font-size: 17px;
+  font-size: 16px;
   transition: background-color 0.2s ease-in;
 }