From a8be7730a35a5d85164856ff19d11ec0f347447f Mon Sep 17 00:00:00 2001
From: Russell Ballestrini <russell.ballestrini@gmail.com>
Date: Thu, 10 Jul 2025 16:55:33 -0400
Subject: [PATCH] fix: improve settings panel positioning and button centering

- Lower settings panel by 15px more (80px to 95px top offset)
- Use place-content instead of place-items for proper grid centering
- Keep all layouts using CSS Grid as requested
- Fix gear and close button centering in both CSS files
---
 src/uncloseai-modal-builtin.css | 8 ++++----
 src/uncloseai-modal-pico.css    | 6 +++---
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/uncloseai-modal-builtin.css b/src/uncloseai-modal-builtin.css
index 5e1e75e..50cccc9 100644
--- a/src/uncloseai-modal-builtin.css
+++ b/src/uncloseai-modal-builtin.css
@@ -76,7 +76,7 @@ dialog#uncloseai-embedded-modal[data-theme="light"] {
   border-radius: 50%;
   cursor: pointer;
   display: grid;
-  place-items: center;
+  place-content: center;
   transition: background 0.2s;
   margin-right: 8px;
   text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
@@ -100,7 +100,7 @@ dialog#uncloseai-embedded-modal[data-theme="light"] {
   display: none;
   overflow-y: auto;
   position: absolute;
-  top: 80px;
+  top: 95px;
   left: 0;
   right: 0;
   bottom: 0;
@@ -742,7 +742,7 @@ dialog#tts-modal {
   color: white;
   cursor: pointer;
   display: grid;
-  place-items: center;
+  place-content: center;
   font-size: 18px;
   transition: background 0.2s;
 }
@@ -879,7 +879,7 @@ dialog#tts-modal {
   display: none;
   overflow-y: auto;
   position: absolute;
-  top: 80px;
+  top: 95px;
   left: 0;
   right: 0;
   bottom: 0;
diff --git a/src/uncloseai-modal-pico.css b/src/uncloseai-modal-pico.css
index 213c3b4..5f52a61 100644
--- a/src/uncloseai-modal-pico.css
+++ b/src/uncloseai-modal-pico.css
@@ -98,7 +98,7 @@ dialog#uncloseai-embedded-modal[data-theme="light"] {
   border-radius: 50%;
   cursor: pointer;
   display: grid;
-  place-items: center;
+  place-content: center;
   transition: background 0.2s;
   margin-right: 8px;
   text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
@@ -121,7 +121,7 @@ dialog#uncloseai-embedded-modal[data-theme="light"] {
   display: none;
   overflow-y: auto;
   position: absolute;
-  top: 80px;
+  top: 95px;
   left: 0;
   right: 0;
   bottom: 0;
@@ -810,7 +810,7 @@ dialog#tts-modal::backdrop {
   color: white;
   cursor: pointer;
   display: grid;
-  place-items: center;
+  place-content: center;
   font-size: 18px;
   transition: background 0.2s;
 }