1<!DOCTYPE html> 2<html lang="tr"> 3<head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta name="description" content="AKA Labs Destek Merkezi - GAZELIST, Dava Belgelerim ve diÄer uygulamalarımızla ilgili sorunlarınızı bildirin ve destek alın."> 7 <title>Destek & Yardım | AKA Labs Support</title> 8 9 <!-- Google Fonts --> 10 <link rel="preconnect" href="https://fonts.googleapis.com"> 11 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> 12 <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Inter:wght@300;400;500;600&family=JetBrains+Mono:wght@300;400;500;600&family=Outfit:wght@800&display=swap" rel="stylesheet"> 13 14 <!-- FontAwesome for Icons --> 15 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> 16 <link rel="stylesheet" href="css/styles.css"> 17 18 <style> 19 .support-hero { 20 padding: 140px 0 50px; 21 position: relative; 22 } 23 .support-container { 24 max-width: 680px; 25 margin: 0 auto; 26 } 27 .back-link { 28 display: inline-flex; 29 align-items: center; 30 gap: 8px; 31 color: var(--color-accent); 32 text-decoration: none; 33 font-family: var(--font-mono); 34 font-size: 0.8rem; 35 text-transform: uppercase; 36 letter-spacing: 0.05em; 37 margin-bottom: 2rem; 38 transition: var(--transition); 39 } 40 .back-link:hover { 41 color: var(--text-primary); 42 transform: translateX(-5px); 43 } 44 45 .lang-header-wrapper { 46 display: flex; 47 justify-content: space-between; 48 align-items: flex-start; 49 margin-bottom: 2.5rem; 50 gap: 2rem; 51 } 52 .support-header { 53 flex-grow: 1; 54 } 55 .support-header h1 { 56 font-family: var(--font-serif); 57 font-size: clamp(2.5rem, 5vw, 3.8rem); 58 font-weight: 300; 59 line-height: 1.1; 60 margin-bottom: 1rem; 61 color: var(--text-primary); 62 } 63 .support-header h1 span { 64 font-style: italic; 65 color: var(--color-accent); 66 } 67 .support-header p { 68 font-size: 1.1rem; 69 color: var(--text-secondary); 70 line-height: 1.6; 71 } 72 73 /* Language Toggle Button styling */ 74 .lang-toggle { 75 display: flex; 76 gap: 0.35rem; 77 background: rgba(0, 0, 0, 0.4); 78 border: 1px solid var(--card-border); 79 padding: 4px; 80 border-radius: 6px; 81 flex-shrink: 0; 82 margin-top: 10px; 83 } 84 .lang-btn { 85 background: none; 86 border: none; 87 color: var(--text-secondary); 88 font-family: var(--font-mono); 89 font-size: 0.75rem; 90 font-weight: 500; 91 padding: 6px 12px; 92 border-radius: 4px; 93 cursor: pointer; 94 transition: var(--transition); 95 } 96 .lang-btn:hover { 97 color: var(--text-primary); 98 } 99 .lang-btn.active { 100 background: var(--color-accent); 101 color: #000; 102 font-weight: 600; 103 } 104 105 .support-card { 106 background: var(--card-bg); 107 border: 1px solid var(--card-border); 108 border-radius: 6px; 109 padding: 3rem; 110 position: relative; 111 overflow: hidden; 112 box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4); 113 } 114 115 .form-group { 116 margin-bottom: 2rem; 117 } 118 .form-group label { 119 display: block; 120 font-family: var(--font-mono); 121 font-size: 0.75rem; 122 color: var(--color-accent); 123 text-transform: uppercase; 124 letter-spacing: 0.08em; 125 margin-bottom: 0.75rem; 126 } 127 .form-control { 128 width: 100%; 129 background: rgba(0, 0, 0, 0.3); 130 border: 1px solid var(--card-border); 131 border-radius: 4px; 132 padding: 1rem; 133 color: var(--text-primary); 134 font-family: var(--font-sans); 135 font-size: 0.95rem; 136 transition: var(--transition); 137 } 138 .form-control:focus { 139 outline: none; 140 border-color: var(--color-accent); 141 background: rgba(0, 0, 0, 0.5); 142 box-shadow: 0 0 10px rgba(229, 169, 117, 0.1); 143 } 144 select.form-control { 145 appearance: none; 146 background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23e5a975' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); 147 background-repeat: no-repeat; 148 background-position: right 1rem center; 149 background-size: 1.2em; 150 padding-right: 2.5rem; 151 } 152 textarea.form-control { 153 min-height: 150px; 154 resize: vertical; 155 } 156 157 /* Drag & Drop Upload Zone */ 158 .upload-zone { 159 border: 2px dashed var(--card-border); 160 border-radius: 4px; 161 padding: 2rem; 162 text-align: center; 163 background: rgba(0, 0, 0, 0.15); 164 cursor: pointer; 165 transition: var(--transition); 166 position: relative; 167 } 168 .upload-zone:hover { 169 border-color: var(--color-accent); 170 background: rgba(229, 169, 117, 0.02); 171 } 172 .upload-zone i { 173 font-size: 2.2rem; 174 color: var(--color-accent); 175 margin-bottom: 0.75rem; 176 display: block; 177 } 178 .upload-zone p { 179 font-size: 0.9rem; 180 color: var(--text-secondary); 181 margin-bottom: 0.25rem; 182 } 183 .upload-zone span { 184 font-size: 0.75rem; 185 color: var(--text-secondary); 186 opacity: 0.6; 187 } 188 .upload-zone input[type="file"] { 189 position: absolute; 190 top: 0; 191 left: 0; 192 width: 100%; 193 height: 100%; 194 opacity: 0; 195 cursor: pointer; 196 } 197 .file-selected-name { 198 display: none; 199 margin-top: 1rem; 200 font-family: var(--font-mono); 201 font-size: 0.8rem; 202 color: #8ca68c; /* Mat green */ 203 background: rgba(140, 166, 140, 0.1); 204 padding: 6px 12px; 205 border-radius: 3px; 206 border: 1px solid rgba(140, 166, 140, 0.2); 207 align-items: center; 208 justify-content: center; 209 gap: 8px; 210 } 211 212 .btn-submit { 213 width: 100%; 214 padding: 1.1rem; 215 font-size: 1rem; 216 font-weight: 500; 217 display: flex; 218 align-items: center; 219 justify-content: center; 220 gap: 10px; 221 cursor: pointer; 222 border: none; 223 background: var(--color-accent); 224 color: #000; 225 border-radius: 4px; 226 font-family: var(--font-mono); 227 text-transform: uppercase; 228 letter-spacing: 0.05em; 229 transition: var(--transition); 230 } 231 .btn-submit:hover { 232 background: #fff; 233 transform: translateY(-2px); 234 box-shadow: 0 5px 15px rgba(255, 255, 255, 0.1); 235 } 236 237 /* Success State View */ 238 .success-view { 239 display: none; 240 text-align: center; 241 padding: 2rem 0; 242 } 243 .success-view i.success-icon { 244 font-size: 4.5rem; 245 color: #8ca68c; 246 margin-bottom: 1.5rem; 247 display: block; 248 animation: scaleIn 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275); 249 } 250 .success-view h2 { 251 font-family: var(--font-serif); 252 font-size: 2.2rem; 253 font-weight: 400; 254 margin-bottom: 1rem; 255 color: var(--text-primary); 256 } 257 .success-view p { 258 color: var(--text-secondary); 259 font-size: 1.05rem; 260 line-height: 1.6; 261 margin-bottom: 2.5rem; 262 max-width: 500px; 263 margin-left: auto; 264 margin-right: auto; 265 } 266 267 @keyframes scaleIn { 268 0% { transform: scale(0); opacity: 0; } 269 100% { transform: scale(1); opacity: 1; } 270 } 271 272 @media (max-width: 768px) { 273 .lang-header-wrapper { 274 flex-direction: column-reverse; 275 align-items: flex-end; 276 gap: 1rem; 277 } 278 .support-header { 279 width: 100%; 280 } 281 .support-card { 282 padding: 2rem 1.5rem; 283 } 284 } 285 </style> 286</head> 287<body> 288 289 <!-- Paper Grain Texture Overlay --> 290 <div class="grain-overlay"></div> 291 292 <!-- Navigation --> 293 <header> 294 <div class="container navbar"> 295 <a href="index.html" class="logo">AKA <span>Labs</span></a> 296 <ul class="nav-links"> 297 <li><a href="index.html" id="navReturnLink">
29701 // Geri Dön</a></li> 298 </ul> 299 </div> 300 </header> 301 302 <!-- Support Center --> 303 <section class="support-hero"> 304 <div class="container support-container"> 305 <a href="index.html" class="back-link" id="backLink"> 306 <i class="fa-solid fa-arrow-left"></i> <span id="backLinkText">Portföye Geri Dön</span> 307 </a> 308 309 <div class="lang-header-wrapper"> 310 <div class="support-header" id="supportHeader"> 311 <h1 id="heroTitle">Destek <span>Merkezi</span></h1> 312 <p id="heroDesc">Uygulamalarımızda yaÅadıÄınız teknik sorunları bildirmek, hata (bug) raporlamak veya önerilerinizi paylaÅmak için formu doldurabilirsiniz. Destek ekibimiz en kısa sürede sizinle iletiÅime geçecektir.</p> 313 </div> 314 315 <!-- Language Toggle Button --> 316 <div class="lang-toggle"> 317 <button type="button" class="lang-btn active" data-lang="tr" onclick="setLanguage('tr')">TR</button> 318 <button type="button" class="lang-btn" data-lang="en" onclick="setLanguage('en')">EN</button> 319 </div> 320 </div> 321 322 <div class="support-card"> 323 324 <!-- Success Message --> 325 <div class="success-view" id="successView"> 326 <i class="fa-solid fa-circle-check success-icon"></i> 327 <h2 id="successTitle">Mesajınız Alındı!</h2> 328 <p id="successDesc">Destek talebiniz baÅarıyla kaydedilmiÅtir. Talebinizle ilgili detaylar <strong>[email protected]</strong> e-posta adresimize iletilmiÅtir. En kısa sürede belirttiÄiniz e-posta adresi üzerinden size geri dönüŠsaÄlayacaÄız.</p> 329 <a href="index.html" class="btn btn-secondary" id="successBtn"><i class="fa-solid fa-house"></i> <span id="successBtnText">Ana Sayfaya Dön</span></a> 330 </div> 331 332 <!-- Support Form --> 333 <form id="supportForm" action="https://formsubmit.co/[email protected]" method="POST" enctype="multipart/form-data"> 334 335 <!-- Formsubmit Settings --> 336 <input type="hidden" name="_subject" id="subjectInput" value="Yeni Destek Talebi (kapar.org)"> 337 <input type="hidden" name="_next" value="https://kapar.org/support.html?success=true"> 338 <input type="hidden" name="_captcha" value="false"> 339 <input type="hidden" name="_honey" style="display:none"> 340 341 <!-- App Selection --> 342 <div class="form-group"> 343 <label for="app" id="labelApp">İlgili Uygulama / Ãrün</label> 344 <select name="app" id="app" class="form-control" required> 345 <option value="" disabled selected id="optSelect">Lütfen bir uygulama seçin...</option> 346 <option value="Sözgeç">Sözgeç</option> 347 <option value="GAZELIST">GAZELIST</option> 348 <option value="Dava Belgelerim">Dava Belgelerim</option> 349 <option value="UYAP Ãevirici">UYAP Ãevirici</option> 350 <option value="UYAP İndirici">UYAP İndirici</option> 351 <option value="AKA Manage Calendar">AKA Manage Calendar</option> 352 <option value="AKA Ticked Tasks">AKA Ticked Tasks</option> 353 <option value="Genel / DiÄer" id="optOther">Genel / DiÄer Sorular</option> 354 </select> 355 </div> 356 357 <!-- Email Address --> 358 <div class="form-group"> 359 <label for="email" id="labelEmail">E-posta Adresiniz</label> 360 <input type="email" name="email" id="email" class="form-control" placeholder="[email protected]" required> 361 </div> 362 363 <!-- Message / Description --> 364 <div class="form-group"> 365 <label for="message" id="labelMsg">Sorununuz veya Mesajınız</label> 366 <textarea name="message" id="message" class="form-control" placeholder="Lütfen karÅılaÅtıÄınız sorunu veya talebinizi kısaca açıklayın..." required></textarea> 367 </div> 368 369 <!-- File Upload (Screenshot) --> 370 <div class="form-group"> 371 <label id="labelFile">Ekran Görüntüsü Yükle (İsteÄe BaÄlı)</label> 372 <div class="upload-zone" id="uploadZone"> 373 <i class="fa-solid fa-image"></i> 374 <p id="fileDrop">Tıklayarak veya görseli buraya sürükleyerek yükleyin</p>
375 <span id="fileLimit">PNG, JPG veya JPEG (Maks. 5MB)</span> 376 <input type="file" name="attachment" id="attachment" accept="image/*"> 377 </div> 378 <div class="file-selected-name" id="fileSelectedName"> 379 <i class="fa-solid fa-paperclip"></i> 380 <span id="fileNameSpan">Dosya seçilmedi</span> 381 </div> 382 </div> 383 384 <!-- Submit Button --> 385 <button type="submit" class="btn-submit" id="btnSubmit"> 386 <i class="fa-solid fa-paper-plane"></i> <span id="btnSubmitText">Destek Talebi Gönder</span> 387 </button> 388 </form> 389 390 </div> 391 </div> 392 </section> 393 394 <!-- Footer --> 395 <footer> 396 <div class="container"> 397 <p>© 2026 AKA Labs. Tüm Hakları Saklıdır.</p> 398 </div> 399 </footer> 400 401 <!-- Translation Data and Controller --> 402
402<script> 403 const translations = { 404 tr: { 405 navReturn: "01 // Geri Dön", 406 backLink: "Portföye Geri Dön", 407 heroTitle: "Destek <span>Merkezi</span>", 408 heroDesc: "Uygulamalarımızda yaÅadıÄınız teknik sorunları bildirmek, hata (bug) raporlamak veya önerilerinizi paylaÅmak için formu doldurabilirsiniz. Destek ekibimiz en kısa sürede sizinle iletiÅime geçecektir.", 409 successTitle: "Mesajınız Alındı!", 410 successDesc: "Destek talebiniz baÅarıyla kaydedilmiÅtir. Talebinizle ilgili detaylar <strong>[email protected]</strong> e-posta adresimize iletilmiÅtir. En kısa sürede belirttiÄiniz e-posta adresi üzerinden size geri dönüŠsaÄlayacaÄız.", 411 successBtn: "Ana Sayfaya Dön", 412 labelApp: "İlgili Uygulama / Ãrün", 413 optSelect: "Lütfen bir uygulama seçin...", 414 labelEmail: "E-posta Adresiniz", 415 labelMsg: "Sorununuz veya Mesajınız", 416 placeholderMsg: "Lütfen karÅılaÅtıÄınız sorunu veya talebinizi kısaca açıklayın...", 417 labelFile: "Ekran Görüntüsü Yükle (İsteÄe BaÄlı)", 418 fileDrop: "Tıklayarak veya görseli buraya sürükleyerek yükleyin", 419 fileLimit: "PNG, JPG veya JPEG (Maks. 5MB)", 420 fileNoSelected: "Dosya seçilmedi", 421 btnSubmit: "Destek Talebi Gönder", 422 subject: "Yeni Destek Talebi (kapar.org)", 423 emailPlaceholder: "[email protected]" 424 }, 425 en: { 426 navReturn: "01 // Return", 427 backLink: "Return to Portfolio", 428 heroTitle: "Support <span>Center</span>", 429 heroDesc: "Fill out the form below to report technical issues, submit bug reports, or share your feature feedback. Our support team will get in touch with you as soon as possible.", 430 successTitle: "Message Received!", 431 successDesc: "Your support request has been successfully recorded. Details have been forwarded to <strong>[email protected]</strong>. We will get back to you via your email address as soon as possible.", 432 successBtn: "Back to Home", 433 labelApp: "Related App / Product", 434 optSelect: "Please select an app...", 435 labelEmail: "Your Email Address", 436 labelMsg: "Your Issue or Message", 437 placeholderMsg: "Please briefly describe the issue or your request...", 438 labelFile: "Upload Screenshot (Optional)", 439 fileDrop: "Click or drag image here to upload", 440 fileLimit: "PNG, JPG or JPEG (Max 5MB)", 441 fileNoSelected: "No file selected", 442 btnSubmit: "Submit Support Request", 443 subject: "New Support Request (kapar.org)", 444 emailPlaceholder: "[email protected]" 445 } 446 }; 447 448 const fileInput = document.getElementById('attachment'); 449 const fileSelectedNameDiv = document.getElementById('fileSelectedName'); 450 const fileNameSpan = document.getElementById('fileNameSpan'); 451 452 function setLanguage(lang) { 453 // Update root html lang attribute to fix uppercase 'i' conversion rules 454 document.documentElement.lang = lang; 455 456 // Save preferred language to localStorage 457 localStorage.setItem('preferred_lang', lang); 458 459 // Update active class on buttons 460 document.querySelectorAll('.lang-btn').forEach(btn => { 461 btn.classList.toggle('active', btn.getAttribute('data-lang') === lang); 462 }); 463 464 // Update navbar return link 465 document.getElementById('navReturnLink').textContent = translations[lang].navReturn; 466 467 // Update DOM text 468 document.getElementById('backLinkText').textContent = translations[lang].backLink; 469 document.getElementById('heroTitle').innerHTML = translations[lang].heroTitle; 470 document.getElementById('heroDesc').textContent = translations[lang].heroDesc; 471 472 document.getElementById('successTitle').textContent = translations[lang].successTitle; 473 document.getElementById('successDesc').innerHTML = translations[lang].successDesc; 474 document.getElementById('successBtnText').textContent = translations[lang].successBtn; 475 476 document.getElementById('labelApp').textContent = translations[lang].labelApp; 477 document.getElementById('optSelect').textContent = translations[lang].optSelect; 478 document.getElementById('optOther').textContent = lang === 'tr' ? 'Genel / DiÄer Sorular' : 'General / Other Questions'; 479 480 document.getElementById('labelEmail').textContent = translations[lang].labelEmail; 481 document.getElementById('email').placeholder = translations[lang].emailPlaceholder; 482 document.getElementById('labelMsg').textContent = translations[lang].labelMsg; 483 document.getElementById('message').placeholder = translations[lang].placeholderMsg; 484 485 document.getElementById('labelFile').textContent = translations[lang].labelFile; 486 document.getElementById('fileDrop').textContent = translations[lang].fileDrop; 487 document.getElementById('fileLimit').textContent = translations[lang].fileLimit; 488 489 // Check file upload text 490 if (!fileInput.files || fileInput.files.length === 0) { 491 fileNameSpan.textContent = translations[lang].fileNoSelected; 492 } 493 494 document.getElementById('btnSubmitText').textContent = translations[lang].btnSubmit; 495 496 // Update FormSubmit Subject 497 document.getElementById('subjectInput').value = translations[lang].subject; 498 } 499 500 // Initialize language 501 // Default to 'en' if not set, or check browser language 502 let defaultLang = 'en'; 503 const savedLang = localStorage.getItem('preferred_lang'); 504 if (savedLang === 'tr' || savedLang === 'en') { 505 defaultLang = savedLang; 506 } else { 507 // Check browser language prefix 508 const browserLang = navigator.language || navigator.userLanguage; 509 if (browserLang && browserLang.startsWith('tr')) { 510 defaultLang = 'tr'; 511 } 512 } 513 setLanguage(defaultLang); 514 515 // Check if URL has ?success=true (form submitted)
516 const urlParams = new URLSearchParams(window.location.search); 517 if (urlParams.get('success') === 'true') { 518 document.getElementById('supportForm').style.display = 'none'; 519 document.getElementById('supportHeader').style.display = 'none'; 520 document.getElementById('successView').style.display = 'block'; 521 } 522 523 // Show selected file name listener 524 fileInput.addEventListener('change', function(e) { 525 if (this.files && this.files.length > 0) { 526 const name = this.files[0].name; 527 fileNameSpan.textContent = name; 528 fileSelectedNameDiv.style.display = 'inline-flex'; 529 } else { 530 const currentLang = localStorage.getItem('preferred_lang') || 'tr'; 531 fileNameSpan.textContent = translations[currentLang].fileNoSelected; 532 fileSelectedNameDiv.style.display = 'none'; 533 } 534 }); 535 </script>
535 536</body> 537</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.