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 <title>KorkutAt Asistan â GiriÅ</title> 7 <link rel="preconnect" href="https://fonts.googleapis.com"> 8 <link href="https://fonts.googleapis.com/css2?family=Sora:wght@300;400;500;600;700&family=DM+Sans:wght@300;400;500&display=swap" rel="stylesheet"> 9 <style> 10 *, *::before, *::after { 11 margin: 0; 12 padding: 0; 13 box-sizing: border-box; 14 } 15 16 :root { 17 --primary: #1a3a5c; 18 --accent: #e85d26; 19 --accent-light: #f4845a; 20 --surface: #f0f3f8; 21 --surface-card: #ffffff; 22 --text-main: #111827; 23 --text-sub: #6b7280; 24 --border: #dde3ed; 25 --input-bg: #f7f9fc; 26 --right-bg: #1a3a5c; 27 --shadow: 0 4px 24px rgba(26,58,92,0.10); 28 } 29 30 body { 31 font-family: 'DM Sans', sans-serif; 32 background: 33 radial-gradient(circle at top, rgba(232,93,38,0.10), transparent 34%), 34 linear-gradient(180deg, #f7f9fc 0%, #edf3f9 100%); 35 min-height: 100vh; 36 display: flex; 37 align-items: center; 38 justify-content: center; 39 padding: 28px; 40 } 41 42 #auth { 43 width: 100%; 44 min-height: calc(100vh - 56px); 45 display: flex; 46 align-items: center; 47 justify-content: center; 48 } 49 50 #auth-left { 51 width: min(100%, 560px); 52 background: var(--surface-card); 53 display: flex; 54 flex-direction: column; 55 justify-content: center; 56 padding: 46px 42px 42px; 57 position: relative; 58 overflow: hidden; 59 border-radius: 28px; 60 border: 1px solid rgba(221,227,237,0.95); 61 box-shadow: 0 22px 60px rgba(26,58,92,0.14); 62 } 63 64 #auth-left::before { 65 content: ''; 66 position: absolute; 67 inset: auto auto -120px -120px; 68 width: 280px; 69 height: 280px; 70 border-radius: 50%; 71 background: radial-gradient(circle, rgba(232,93,38,0.08) 0%, transparent 72%); 72 pointer-events: none; 73 } 74 75 /* Logo area */ 76 .auth-logo { 77 display: flex; 78 flex-direction: column; 79 align-items: center; 80 gap: 0; 81 margin-bottom: 24px; 82 text-align: center; 83 } 84 85 .logo-icon { 86 width: 44px; 87 height: 44px; 88 background: var(--primary); 89 border-radius: 10px; 90 display: flex; 91 align-items: center; 92 justify-content: center; 93 } 94 95 .logo-icon svg { 96 width: 24px; 97 height: 24px; 98 fill: none; 99 stroke: #fff; 100 stroke-width: 1.8; 101 } 102 103 .auth-title { 104 font-family: 'Sora', sans-serif; 105 font-size: 33px; 106 font-weight: 700; 107 color: var(--text-main); 108 line-height: 1.2; 109 margin-bottom: 12px; 110 letter-spacing: -0.02em; 111 text-align: center; 112 } 113 114 .auth-title .highlight { 115 color: var(--accent); 116 } 117 118 .auth-title .ata { 119 color: #09A886; 120 } 121 122 .auth-uni { 123 font-family: 'Sora', sans-serif; 124 font-size: 12px; 125 font-weight: 600; 126 letter-spacing: 0.14em; 127 text-transform: uppercase; 128 color: var(--text-sub); 129 text-align: center; 130 margin-bottom: 8px; 131 } 132 133 .auth-subtitle .auth-hint { 134 display: inline-block; 135 margin-top: 8px; 136 font-size: 13px; 137 color: var(--text-sub); 138 } 139 140 .auth-subtitle { 141 font-size: 14px; 142 color: var(--text-sub); 143 margin-bottom: 30px; 144 line-height: 1.6; 145 font-weight: 300; 146 text-align: center; 147 } 148 149 #auth-left form { 150 width: 100%; 151 } 152 153 /* Form */ 154 .form-group { 155 margin-bottom: 16px; 156 } 157 158 .input-wrapper { 159 position: relative; 160 display: flex; 161 align-items: center; 162 } 163 164 .input-icon { 165 position: absolute; 166 left: 16px; 167 color: var(--text-sub); 168 pointer-events: none; 169 display: flex; 170 align-items: center; 171 } 172 173 .input-icon svg { 174 width: 17px; 175 height: 17px; 176 stroke: var(--text-sub); 177 stroke-width: 1.8; 178 fill: none; 179 } 180 181 .form-control { 182 width: 100%; 183 padding: 14px 16px 14px 44px; 184 font-size: 14px; 185 font-family: 'DM Sans', sans-serif; 186 font-weight: 400; 187 color: var(--text-main); 188 background: var(--input-bg); 189 border: 1.5px solid var(--border); 190 border-radius: 10px; 191 outline: none; 192 transition: border-color 0.2s, box-shadow 0.2s, background 0.2s; 193 } 194 195 .form-control::placeholder { 196 color: #aab0bc; 197 } 198 199 .form-control:focus { 200 border-color: var(--primary); 201 background: #fff; 202 box-shadow: 0 0 0 4px rgba(26,58,92,0.08); 203 } 204 205 /* Email suffix */ 206 .input-suffix { 207 position: absolute; 208 right: 14px; 209 font-size: 12px; 210 font-weight: 500; 211 color: var(--text-sub); 212 background: var(--border); 213 padding: 3px 8px; 214 border-radius: 6px; 215 pointer-events: none; 216 letter-spacing: 0.01em; 217 } 218 219 /* Password toggle */ 220 .toggle-password { 221 position: absolute; 222 right: 14px; 223 background: none; 224 border: none; 225 cursor: pointer; 226 padding: 4px; 227 display: flex; 228 align-items: center; 229 color: var(--text-sub); 230 transition: color 0.2s; 231 } 232 233 .toggle-password:hover { color: var(--primary); } 234 235 .toggle-password svg { 236 width: 17px; 237 height: 17px; 238 stroke: currentColor; 239 stroke-width: 1.8; 240 fill: none; 241 } 242 243 /* Submit */ 244 .btn-submit { 245 width: 100%; 246 padding: 15px; 247 margin-top: 28px; 248 background: var(--primary); 249 color: #fff; 250 border: none; 251 border-radius: 10px; 252 font-family: 'Sora', sans-serif; 253 font-size: 15px; 254 font-weight: 600; 255 letter-spacing: 0.02em; 256 cursor: pointer; 257 display: flex; 258 align-items: center; 259 justify-content: center; 260 gap: 10px; 261 transition: background 0.2s, transform 0.15s, box-shadow 0.2s; 262 box-shadow: 0 4px 16px rgba(26,58,92,0.25); 263 } 264 265 .btn-submit:hover { 266 background: #14305a; 267 transform: translateY(-1px);
268 box-shadow: 0 6px 20px rgba(26,58,92,0.30); 269 } 270 271 .btn-submit:active { 272 transform: translateY(0); 273 } 274 275 .btn-submit svg { 276 width: 18px; 277 height: 18px; 278 stroke: #fff; 279 stroke-width: 2; 280 fill: none; 281 } 282 283 /* Label */ 284 label.field-label { 285 display: block; 286 font-size: 12px; 287 font-weight: 600; 288 color: var(--text-sub); 289 letter-spacing: 0.06em; 290 text-transform: uppercase; 291 margin-bottom: 7px; 292 } 293 294 /* Responsive */ 295 @media (max-width: 768px) { 296 body { 297 padding: 18px; 298 } 299 300 #auth { 301 min-height: calc(100vh - 36px); 302 } 303 304 #auth-left { 305 width: 100%; 306 padding: 38px 24px 30px; 307 border-radius: 22px; 308 } 309 310 .auth-title { 311 font-size: 28px; 312 } 313 } 314 315 /* Animations */ 316 @keyframes fadeUp { 317 from { opacity: 0; transform: translateY(18px); } 318 to { opacity: 1; transform: translateY(0); } 319 } 320 321 .auth-logo { animation: fadeUp 0.5s ease both; animation-delay: 0.05s; } 322 .auth-title { animation: fadeUp 0.5s ease both; animation-delay: 0.10s; } 323 .auth-subtitle { animation: fadeUp 0.5s ease both; animation-delay: 0.15s; } 324 .form-group:nth-child(1) { animation: fadeUp 0.5s ease both; animation-delay: 0.25s; } 325 .form-group:nth-child(2) { animation: fadeUp 0.5s ease both; animation-delay: 0.30s; } 326 .btn-submit { animation: fadeUp 0.5s ease both; animation-delay: 0.35s; } 327 .auth-alert { 328 margin-bottom: 20px; 329 padding: 13px 14px; 330 border-radius: 10px; 331 font-size: 13px; 332 line-height: 1.5; 333 border: 1px solid transparent; 334 } 335 336 .auth-alert.error { 337 background: #fff4f4; 338 color: #9f1239; 339 border-color: #fecdd3; 340 } 341 342 .auth-alert.info { 343 background: #eff6ff; 344 color: #1d4ed8; 345 border-color: #bfdbfe; 346 } 347 </style> 348</head> 349<body> 350<div id="auth"> 351 352 <!-- LEFT --> 353 <div id="auth-left"> 354 355 <div class="auth-logo"> 356 357 <img src="logo.svg" alt="Logo" style="height:110px; width:auto;"> 358 </div> 359 360 <p class="auth-uni">OSMANÄ°YE KORKUT ATA ÃNÄ°VERSÄ°TESÄ°</p> 361 <h1 class="auth-title">Korkut<span class="ata">AtA</span>sistan</h1> 362 <p class="auth-subtitle">Akıllı Akademik Asistan Platformu<br><span class="auth-hint">Kurumsal LDAP kullanıcı adınız ve Åifrenizle sisteme giriÅ yapabilirsiniz.</span></p> 363 364 365 <form method="post" action="/korkutatasistan/giris.php" novalidate> 366 <input type="hidden" name="csrf_token" value="fbfa9db8a62a4ce6bc8a08fedc8c276cc8447928444db793132459d30ca9136a"> 367 <input type="hidden" name="redirect" value="/korkutatasistan/KorkutAtAsistan.html"> 368 <div class="form-group"> 369 <label class="field-label" for="eposta">Kullanıcı Adı</label> 370 <div class="input-wrapper"> 371 <span class="input-icon"> 372 <svg viewBox="0 0 24 24"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg> 373 </span> 374 <input type="text" id="eposta" name="eposta" class="form-control" placeholder="kullanici.adi" autocomplete="username" autocapitalize="off" spellcheck="false" required value=""> 375 <span class="input-suffix">@osmaniye.edu.tr</span> 376 </div> 377 </div> 378 379 <div class="form-group"> 380 <label class="field-label" for="password">Åifre</label> 381 <div class="input-wrapper"> 382 <span class="input-icon"> 383 <svg viewBox="0 0 24 24"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg> 384 </span> 385 <input type="password" id="password" name="password" class="form-control" placeholder="â¢â¢â¢â¢â¢â¢â¢â¢" autocomplete="current-password" required> 386 <button class="toggle-password" type="button" id="togglePwd" aria-label="Åifreyi göster">
387 <svg id="eyeIcon" viewBox="0 0 24 24"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg> 388 </button> 389 </div> 390 </div> 391 392 <button class="btn-submit" type="submit"> 393 <svg viewBox="0 0 24 24"><path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4"/><polyline points="10 17 15 12 10 7"/><line x1="15" y1="12" x2="3" y2="12"/></svg> 394 Sisteme GiriÅ Yap 395 </button> 396 </form> 397 </div> 398 399</div> 400
401<script> 402 const toggleBtn = document.getElementById('togglePwd'); 403 const pwdInput = document.getElementById('password'); 404 const eyeIcon = document.getElementById('eyeIcon'); 405 406 const eyeOpen = `<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/>`; 407 const eyeClosed = `<path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"/><line x1="1" y1="1" x2="23" y2="23"/>`; 408 409 toggleBtn.addEventListener('click', () => { 410 const isHidden = pwdInput.type === 'password'; 411 pwdInput.type = isHidden ? 'text' : 'password'; 412 eyeIcon.innerHTML = isHidden ? eyeClosed : eyeOpen; 413 }); 414</script>
414 415</body> 416</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.