import fix

settings/index.css

@@ -248,8 +248,6 @@ h2 {
 
 .custom-themes-section {
   margin-top: 16px;
-  padding-top: 16px;
-  border-top: 1px solid var(--border-border, var(--text-teritary));
 }
 
 .custom-themes-header {
@@ -262,7 +260,13 @@ h2 {
   color: var(--text-primary);
 }
 
-.add-theme-btn {
+.custom-themes-buttons {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+.theme-btn {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -276,7 +280,7 @@ h2 {
   transition: all 0.2s ease;
 }
 
-.add-theme-btn:hover {
+.theme-btn:hover {
   background: var(--accent-accent);
   color: var(--button-secondaryFill);
 }

settings/index.html

@@ -55,9 +55,14 @@
           <div class="custom-themes-section">
             <div class="custom-themes-header">
               <span data-i18n="settings.custom_themes.title">Egyéni témák</span>
-              <button class="add-theme-btn" id="addCustomTheme">
-                <span class="material-icons-round">add</span>
-              </button>
+              <div class="custom-themes-buttons">
+                <button class="theme-btn" id="addCustomTheme" title="Új téma">
+                  <span class="material-icons-round">add</span>
+                </button>
+                <button class="theme-btn" id="importCustomTheme" title="Téma importálása">
+                  <span class="material-icons-round">download</span>
+                </button>
+              </div>
             </div>
             <div class="theme-grid custom-themes-grid" id="customThemesGrid">
             </div>
@@ -225,7 +230,7 @@
       </div>
       <div class="modal-body">
         <p data-i18n="settings.custom_themes.import_description">Illeszd be a téma kódot:</p>
-        <textarea id="importCode" placeholder="Illessze be a téma kódot ide..."></textarea>
+        <textarea id="importCode" placeholder="Illeszd be a téma kódját ide..."></textarea>
         <p class="error-message" id="importError"></p>
       </div>
       <div class="modal-footer">

settings/index.js

@@ -503,6 +503,10 @@ document.addEventListener("DOMContentLoaded", async () => {
   document.getElementById("cancelThemeEditor")?.addEventListener("click", closeThemeEditor);
   document.getElementById("saveTheme")?.addEventListener("click", saveThemeFromEditor);
   
+  document.getElementById("importCustomTheme")?.addEventListener("click", () => {
+    document.getElementById("importThemeModal").classList.add("active");
+  });
+  
   document.querySelectorAll(".mode-option").forEach(btn => {
     btn.addEventListener("click", () => {
       document.querySelectorAll(".mode-option").forEach(b => b.classList.remove("active"));
@@ -550,16 +554,6 @@ document.addEventListener("DOMContentLoaded", async () => {
   document.getElementById("closeShareModalBtn")?.addEventListener("click", closeShareModal);
   document.getElementById("copyShareCode")?.addEventListener("click", copyShareCode);
 
-  let pressTimer;
-  const addBtn = document.getElementById("addCustomTheme");
-  addBtn?.addEventListener("mousedown", () => {
-    pressTimer = setTimeout(() => {
-      document.getElementById("importThemeModal").classList.add("active");
-    }, 500);
-  });
-  addBtn?.addEventListener("mouseup", () => clearTimeout(pressTimer));
-  addBtn?.addEventListener("mouseleave", () => clearTimeout(pressTimer));
-
   document.getElementById("closeImportModal")?.addEventListener("click", closeImportModal);
   document.getElementById("cancelImport")?.addEventListener("click", closeImportModal);
   document.getElementById("confirmImport")?.addEventListener("click", importTheme);