1 2 3 4 <div class="app-navbar-wrap"> 5 <nav class="navbar app-navbar"> 6 <div class="container is-fluid"> 7 <div class="navbar-brand"> 8 <a class="navbar-item app-navbar-brand" href="/"> 9 <span class="app-navbar-logo"> 10 <img src="/static/img/logo-MU_Color.png" alt="Mahidol University logo" width="94" height="38" decoding="async"> 11 </span> 12 <span> 13 <span class="app-navbar-title">MUMT MIS</span> 14 <span class="app-navbar-subtitle">Internal Information System</span> 15 </span> 16 </a> 17 <span class="navbar-burger burger" data-target="rootNavbarMenu"> 18 <span></span> 19 <span></span> 20 <span></span> 21 </span> 22 </div> 23 24 <div id="rootNavbarMenu" class="navbar-menu"> 25 26 <div class="navbar-start"> 27 28 <a class="navbar-item app-navbar-link is-primary" href="/"> 29 30 <span class="icon"> 31 <i class="fas fa-house"></i> 32 </span> 33 34 <span>หà¸à¹à¸²à¸«à¸¥à¸±à¸</span> 35 </a> 36 37 </div> 38 39 40 <div class="navbar-end"> 41 42 43 44 <a class="navbar-item app-navbar-action" href="/auth/login"> 45 46 <span class="icon"> 47 <i class="fas fa-sign-in-alt"></i> 48 </span> 49 50 <span>ลà¸à¸à¸·à¹à¸à¹à¸à¹à¸²à¹à¸à¹</span> 51 </a> 52 53 54 55 56 57 <a class="navbar-item app-navbar-action" href="/user-support"> 58 59 <span class="icon"> 60 <i class="fa-solid fa-circle-info"></i> 61 </span> 62 63 <span>à¹à¸à¹à¸à¸à¸±à¸à¸«à¸²/à¸à¸à¸à¸§à¸²à¸¡à¸à¹à¸§à¸¢à¹à¸«à¸¥à¸·à¸</span> 64 </a> 65 66 67 68 </div> 69 </div> 70 </div> 71 </nav> 72 </div> 73<!DOCTYPE html> 74<html> 75<head> 76 <style> 77 :root { 78 --theme-bg: #f5f6f8; 79 --theme-surface: rgba(255, 255, 255, 0.88); 80 --theme-surface-strong: #ffffff; 81 --theme-border: rgba(58, 101, 184, 0.22); 82 --theme-text: #15284d; 83 --theme-muted: #66738d; 84 --theme-navy: #1a3d7c; 85 --theme-navy-deep: #10264c; 86 --theme-navy-soft: #eef3ff; 87 --theme-gold: #caa84a; 88 --theme-yellow: #f0c419; 89 --theme-green: #2e8b57; 90 --theme-red: #b8433f; 91 --theme-shadow: 0 4px 14px rgba(18, 39, 84, 0.045); 92 } 93 94 html, 95 body { 96 min-height: 100%; 97 } 98 99 body { 100 background: 101 radial-gradient(circle at top left, rgba(26, 61, 124, 0.16), transparent 28%), 102 radial-gradient(circle at top right, rgba(202, 168, 74, 0.16), transparent 24%), 103 linear-gradient(180deg, #fbfbfc 0%, var(--theme-bg) 100%); 104 color: var(--theme-text); 105 } 106 107 body.is-test-server { 108 padding-top: 2.5rem; 109 } 110 111 .test-server-banner { 112 align-items: center; 113 background: linear-gradient(90deg, #a83d16, #d96b1f); 114 box-shadow: 0 4px 14px rgba(125, 45, 12, 0.22); 115 color: #fff; 116 display: flex; 117 font-size: 0.9rem; 118 font-weight: 700; 119 gap: 0.65rem; 120 justify-content: center; 121 letter-spacing: 0.03em; 122 min-height: 2.5rem; 123 padding: 0.55rem 1rem; 124 position: fixed; 125 left: 0; 126 right: 0; 127 top: 0; 128 text-align: center; 129 z-index: 2000; 130 } 131 132 .test-server-banner .icon { 133 color: #ffe08a; 134 } 135 136 a { 137 color: var(--theme-navy); 138 } 139 140 a:hover { 141 color: var(--theme-navy-deep); 142 } 143 144 .title, 145 .subtitle, 146 .label, 147 .content, 148 .table, 149 .message, 150 .notification { 151 color: inherit; 152 } 153 154 .title + .subtitle { 155 margin-top: 0.55rem; 156 } 157 158 .button.is-info, 159 .tag.is-info, 160 .message.is-info > .message-header { 161 background-color: var(--theme-navy); 162 border-color: var(--theme-navy); 163 color: #fff; 164 } 165 166 .button.is-info:hover, 167 .button.is-info:focus { 168 background-color: var(--theme-navy-deep); 169 border-color: var(--theme-navy-deep); 170 color: #fff; 171 } 172 173 .button.is-success, 174 .tag.is-success { 175 background-color: var(--theme-green); 176 border-color: var(--theme-green); 177 color: #fff; 178 } 179 180 .button.is-danger, 181 .tag.is-danger { 182 background-color: var(--theme-red); 183 border-color: var(--theme-red); 184 color: #fff; 185 } 186 187 .button.is-warning, 188 .tag.is-warning, 189 .message.is-warning > .message-header { 190 background-color: var(--theme-yellow); 191 border-color: var(--theme-yellow); 192 color: var(--theme-navy-deep); 193 } 194 195 .card, 196 .box, 197 .panel,
198 .modal-card, 199 .dropdown-content { 200 border: 2px solid var(--theme-border); 201 box-shadow: 0 5px 14px rgba(18, 39, 84, 0.045); 202 } 203 204 .notification { 205 border: 2px solid var(--theme-border); 206 border-radius: 18px; 207 box-shadow: 0 4px 12px rgba(18, 39, 84, 0.04); 208 } 209 210 .table-container { 211 border: 1px solid var(--theme-border); 212 border-radius: 18px; 213 box-shadow: 0 10px 24px rgba(18, 39, 84, 0.05); 214 overflow: hidden; 215 } 216 217 table.table { 218 border-collapse: separate; 219 border-spacing: 0; 220 border-radius: 18px; 221 overflow: hidden; 222 } 223 224 table.table.is-bordered { 225 border: 1px solid var(--theme-border); 226 } 227 228 table.table.is-bordered td, 229 table.table.is-bordered th { 230 border-color: var(--theme-border); 231 } 232 233 table.table.is-bordered > thead:first-child > tr:first-child > th:first-child, 234 table.table.is-bordered > tbody:first-child > tr:first-child > td:first-child, 235 table.table.is-bordered > tbody:first-child > tr:first-child > th:first-child, 236 table.table.is-bordered > tr:first-child > td:first-child, 237 table.table.is-bordered > tr:first-child > th:first-child { 238 border-top-left-radius: 18px; 239 } 240 241 table.table.is-bordered > thead:first-child > tr:first-child > th:last-child, 242 table.table.is-bordered > tbody:first-child > tr:first-child > td:last-child, 243 table.table.is-bordered > tbody:first-child > tr:first-child > th:last-child, 244 table.table.is-bordered > tr:first-child > td:last-child, 245 table.table.is-bordered > tr:first-child > th:last-child { 246 border-top-right-radius: 18px; 247 } 248 249 table.table.is-bordered > tfoot:last-child > tr:last-child > td:first-child, 250 table.table.is-bordered > tfoot:last-child > tr:last-child > th:first-child, 251 table.table.is-bordered > tbody:last-child > tr:last-child > td:first-child, 252 table.table.is-bordered > tbody:last-child > tr:last-child > th:first-child, 253 table.table.is-bordered > tr:last-child > td:first-child, 254 table.table.is-bordered > tr:last-child > th:first-child { 255 border-bottom-left-radius: 18px; 256 } 257 258 table.table.is-bordered > tfoot:last-child > tr:last-child > td:last-child, 259 table.table.is-bordered > tfoot:last-child > tr:last-child > th:last-child, 260 table.table.is-bordered > tbody:last-child > tr:last-child > td:last-child, 261 table.table.is-bordered > tbody:last-child > tr:last-child > th:last-child, 262 table.table.is-bordered > tr:last-child > td:last-child, 263 table.table.is-bordered > tr:last-child > th:last-child { 264 border-bottom-right-radius: 18px; 265 } 266 267 .navbar, 268 .navbar.is-info, 269 .navbar.is-danger, 270 .navbar.is-warning, 271 .navbar.is-success, 272 .navbar.is-primary, 273 .navbar.is-link, 274 .navbar.is-light { 275 background: var(--theme-surface); 276 border: 1px solid var(--theme-border); 277 border-radius: 22px; 278 box-shadow: var(--theme-shadow); 279 margin: 1rem 1.25rem 0; 280 overflow: visible; 281 } 282 283 .navbar > .container, 284 .navbar > .container.is-fluid { 285 min-height: 4.5rem; 286 } 287 288 .navbar-brand { 289 align-items: center; 290 } 291 292 .navbar-item, 293 .navbar-link { 294 border-radius: 999px; 295 color: var(--theme-text); 296 margin: 0.45rem 0.2rem; 297 min-height: 2.6rem; 298 padding: 0.65rem 1rem; 299 transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, color 0.15s ease; 300 } 301 302 .navbar-item:hover, 303 .navbar-item:focus, 304 .navbar-link:hover, 305 .navbar-link:focus { 306 background: rgba(255, 245, 210, 0.82) !important; 307 color: var(--theme-navy-deep) !important; 308 transform: translateY(-1px); 309 } 310 311 .navbar-brand > .navbar-item { 312 border-radius: 16px; 313 font-weight: 700; 314 margin-left: 0.8rem; 315 } 316 317 .navbar-menu { 318 align-items: center; 319 background: transparent; 320 box-shadow: none; 321 overflow: visible; 322 } 323 324 .navbar-start, 325 .navbar-end { 326 align-items: center; 327 gap: 0.35rem; 328 overflow: visible; 329 padding: 0 0.75rem; 330 } 331 332 .navbar-item.has-dropdown { 333 overflow: visible; 334 } 335 336 .navbar-dropdown { 337 z-index: 30; 338 } 339 340 .navbar.is-info .navbar-item, 341 .navbar.is-danger .navbar-item, 342 .navbar.is-warning .navbar-item, 343 .navbar.is-success .navbar-item, 344 .navbar.is-primary .navbar-item, 345 .navbar.is-link .navbar-item, 346 .navbar.is-light .navbar-item, 347 .navbar.is-info .navbar-link, 348 .navbar.is-danger .navbar-link, 349 .navbar.is-warning .navbar-link, 350 .navbar.is-success .navbar-link, 351 .navbar.is-primary .navbar-link, 352 .navbar.is-link .navbar-link, 353 .navbar.is-light .navbar-link { 354 color: var(--theme-text) !important; 355 } 356 357 .navbar-burger { 358 border-radius: 14px; 359 color: var(--theme-navy-deep); 360 height: 3.25rem; 361 margin-right: 0.65rem; 362 margin-top: 0.35rem; 363 width: 3.25rem; 364 } 365 366 .navbar-burger:hover { 367 background: rgba(255, 245, 210, 0.92); 368 } 369 370 .app-navbar-wrap { 371 padding: 1rem 1.25rem 0; 372 } 373 374 .app-navbar { 375 background: var(--theme-surface); 376 border: 1px solid var(--theme-border); 377 border-radius: 22px; 378 box-shadow: var(--theme-shadow); 379 margin: 0; 380 backdrop-filter: blur(14px); 381 } 382 383 .app-navbar .navbar-brand { 384 align-items: center; 385 } 386 387 .app-navbar-brand { 388 align-items: center; 389 color: var(--theme-text); 390 display: inline-flex; 391 gap: 0.9rem; 392 padding-left: 1rem; 393 padding-right: 1rem; 394 } 395 396 .app-navbar-brand:hover { 397 color: var(--theme-navy-deep); 398 } 399 400 .app-navbar-logo { 401 background: linear-gradient(135deg, rgba(238, 243, 255, 0.98), rgba(255, 247, 220, 0.98)); 402 border: 1px solid rgba(18, 39, 84, 0.08); 403 border-radius: 16px; 404 display: inline-flex; 405 flex-shrink: 0; 406 padding: 0.45rem; 407 } 408 409 .app-navbar-logo img { 410 display: block; 411 height: 2.35rem; 412 width: auto; 413 } 414 415 .app-navbar-title { 416 color: var(--theme-navy-deep); 417 display: block; 418 font-size: 0.95rem; 419 font-weight: 700; 420 line-height: 1.1; 421 } 422 423 .app-navbar-subtitle { 424 color: var(--theme-muted); 425 display: block; 426 font-size: 0.75rem; 427 line-height: 1.1; 428 margin-top: 0.15rem; 429 } 430 431 .app-navbar .navbar-menu { 432 align-items: center; 433 } 434 435 .app-navbar .navbar-start, 436 .app-navbar .navbar-end { 437 align-items: center; 438 gap: 0.45rem; 439 padding-left: 0.85rem; 440 padding-right: 0.85rem; 441 } 442 443 .app-navbar-link, 444 .app-navbar-user, 445 .app-navbar-action { 446 align-items: center; 447 border-radius: 999px; 448 color: var(--theme-text); 449 display: inline-flex; 450 gap: 0.55rem; 451 margin: 0.45rem 0; 452 min-height: 2.6rem; 453 padding: 0.65rem 1rem; 454 } 455 456 .app-navbar-link:hover, 457 .app-navbar-action:hover { 458 background: rgba(255, 245, 210, 0.9); 459 color: var(--theme-navy-deep); 460 } 461 462 .app-navbar-link.is-primary { 463 background: linear-gradient(135deg, var(--theme-navy), var(--theme-navy-deep)); 464 color: #ffffff; 465 font-weight: 600; 466 } 467 468 .app-navbar-link.is-primary:hover { 469 background: linear-gradient(135deg, #244a90, #16335e); 470 color: #ffffff; 471 } 472 473 .app-navbar-user { 474 background: var(--theme-navy-soft); 475 color: var(--theme-navy-deep); 476 font-weight: 600; 477 } 478 479 .app-navbar-user-name { 480 max-width: 16rem; 481 overflow: hidden; 482 text-overflow: ellipsis; 483 white-space: nowrap; 484 } 485 486 .app-navbar-dropdown-link { 487 align-items: center; 488 display: flex; 489 gap: 0.6rem; 490 min-width: 12rem; 491 } 492 493 .app-navbar .navbar-dropdown { 494 border: 1px solid var(--theme-border); 495 border-radius: 16px; 496 box-shadow: 0 14px 28px rgba(18, 39, 84, 0.14); 497 overflow: hidden; 498 padding: 0.45rem; 499 } 500 501 .app-navbar .navbar-dropdown .navbar-item { 502 border-radius: 10px; 503 } 504 505 .app-navbar .navbar-burger { 506 border-radius: 14px; 507 color: var(--theme-navy-deep); 508 height: 3.25rem; 509 margin-right: 0.65rem; 510 margin-top: 0.35rem; 511 width: 3.25rem; 512 } 513 514 .app-navbar .navbar-burger:hover { 515 background: rgba(255, 245, 210, 0.92); 516 } 517 518 .panel, 519 .panel.is-info, 520 .panel.is-danger, 521 .panel.is-warning, 522 .panel.is-success, 523 .panel.is-primary, 524 .panel.is-link, 525 .panel.is-light { 526 background: var(--theme-surface); 527 border-radius: 22px; 528 overflow: hidden; 529 } 530 531 .panel .panel-heading, 532 .panel.is-info .panel-heading, 533 .panel.is-danger .panel-heading, 534 .panel.is-warning .panel-heading, 535 .panel.is-success .panel-heading, 536 .panel.is-primary .panel-heading, 537 .panel.is-link .panel-heading, 538 .panel.is-light .panel-heading { 539 background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(243, 246, 255, 0.96)); 540 border-bottom: 1px solid var(--theme-border); 541 color: var(--theme-navy-deep); 542 font-size: 1rem; 543 font-weight: 700; 544 letter-spacing: 0.01em; 545 padding: 1rem 1.2rem; 546 } 547 548 .panel .panel-block, 549 .panel a.panel-block { 550 align-items: center; 551 background: rgba(255, 255, 255, 0.84); 552 border: 1px solid rgba(18, 39, 84, 0.08); 553 color: var(--theme-text); 554 gap: 0.75rem; 555 justify-content: flex-start; 556 margin: 0.35rem 0.6rem; 557 border-radius: 14px; 558 min-height: 3.15rem; 559 padding: 0.85rem 1rem; 560 transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease, background 0.15s ease; 561 } 562 563 .panel a.panel-block { 564 box-shadow: 0 6px 18px rgba(18, 39, 84, 0.04); 565 } 566 567 .panel > .panel-block:last-child, 568 .panel > a.panel-block:last-child { 569 margin-bottom: 0.6rem; 570 } 571 572 .panel-block:first-of-type, 573 a.panel-block:first-of-type { 574 margin-top: 0.6rem; 575 } 576 577 .panel .panel-block:hover, 578 .panel a.panel-block:hover { 579 background: rgba(255, 245, 210, 0.76); 580 border-color: rgba(202, 168, 74, 0.28); 581 box-shadow: 0 10px 24px rgba(18, 39, 84, 0.08); 582 color: var(--theme-navy-deep); 583 transform: translateY(-1px); 584 } 585 586 .panel .panel-icon { 587 align-items: center; 588 color: var(--theme-navy); 589 display: inline-flex; 590 justify-content: center; 591 margin-right: 0.25rem; 592 min-width: 1.5rem; 593 } 594 595 .panel .panel-tabs, 596 .panel .panel-list { 597 padding: 0.6rem; 598 } 599 600 .panel .panel-block > :last-child, 601 .panel a.panel-block > :last-child { 602 min-width: 0; 603 } 604 605 .panel.is-info .panel-heading, 606 .panel.is-danger .panel-heading, 607 .panel.is-warning .panel-heading, 608 .panel.is-success .panel-heading, 609 .panel.is-primary .panel-heading, 610 .panel.is-link .panel-heading, 611 .panel.is-light .panel-heading { 612 background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(243, 246, 255, 0.96)) !important; 613 color: var(--theme-navy-deep) !important; 614 } 615 616 .panel.is-info .panel-block, 617 .panel.is-danger .panel-block, 618 .panel.is-warning .panel-block, 619 .panel.is-success .panel-block, 620 .panel.is-primary .panel-block, 621 .panel.is-link .panel-block, 622 .panel.is-light .panel-block, 623 .panel.is-info a.panel-block, 624 .panel.is-danger a.panel-block, 625 .panel.is-warning a.panel-block, 626 .panel.is-success a.panel-block, 627 .panel.is-primary a.panel-block, 628 .panel.is-link a.panel-block, 629 .panel.is-light a.panel-block { 630 color: var(--theme-text) !important; 631 } 632 633 .footer { 634 background: rgba(255, 255, 255, 0.72); 635 border-top: 1px solid var(--theme-border); 636 margin-top: 2rem; 637 } 638 639 @media screen and (max-width: 1023px) { 640 .navbar, 641 .navbar.is-info, 642 .navbar.is-danger, 643 .navbar.is-warning, 644 .navbar.is-success, 645 .navbar.is-primary, 646 .navbar.is-link, 647 .navbar.is-light { 648 margin-left: 1rem; 649 margin-right: 1rem; 650 } 651 652 .navbar-menu { 653 padding: 0 0.8rem 0.85rem; 654 } 655 656 .navbar-start, 657 .navbar-end { 658 align-items: stretch; 659 padding: 0; 660 } 661 662 .navbar-item, 663 .navbar-link { 664 justify-content: flex-start; 665 width: 100%; 666 } 667 668 .app-navbar-wrap { 669 padding-left: 1rem; 670 padding-right: 1rem; 671 } 672 673 .app-navbar .navbar-menu { 674 background: transparent; 675 box-shadow: none; 676 padding: 0 0.8rem 0.85rem; 677 } 678 679 .app-navbar .navbar-start, 680 .app-navbar .navbar-end { 681 align-items: stretch; 682 padding-right: 0; 683 padding-left: 0; 684 } 685 686 .app-navbar-link, 687 .app-navbar-user, 688 .app-navbar-action { 689 justify-content: flex-start; 690 width: 100%; 691 } 692 693 .app-navbar-user-name { 694 max-width: none; 695 } 696 } 697 698 .colored-toast.swal2-icon-success { 699 background-color: var(--theme-green) !important; 700 } 701 702 .colored-toast.swal2-icon-error { 703 background-color: var(--theme-red) !important; 704 } 705 706 .colored-toast.swal2-icon-warning { 707 background-color: var(--theme-yellow) !important; 708 } 709 710 .colored-toast.swal2-icon-info { 711 background-color: var(--theme-navy) !important; 712 } 713 714 .colored-toast.swal2-icon-question { 715 background-color: var(--theme-gold) !important; 716 } 717 718 .colored-toast .swal2-title { 719 color: white; 720 } 721 722 .colored-toast .swal2-close { 723 color: white; 724 } 725 726 .colored-toast .swal2-html-container { 727 color: white; 728 } 729 </style> 730 731 <title>MUMT Internal Information System: User Support</title> 732 <meta charset="utf-8"> 733 <meta name="viewport" content="width=device-width, initial-scale=1"> 734 <meta name="htmx-config" content='{"requestClass": "is-loading"}'> 735 736 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypA
736SozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw==" crossorigin="anonymous" referrerpolicy="no-referrer" /> 737 <link rel="stylesheet" href="//cdn.materialdesignicons.com/2.5.94/css/materialdesignicons.min.css"/> 738 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/buefy.min.css"/> 739 <link rel="stylesheet" href="https://unpkg.com/bulmaswatch/default/bulmaswatch.min.css"> 740 <link rel="stylesheet" href="https://cdn.datatables.net/1.12.0/css/dataTables.bulma.min.css"/> 741 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/shepherd.css"/> 742 <link rel="stylesheet" href="https://cdn.datatables.net/fixedcolumns/4.2.1/css/fixedColumns.dataTables.min.css"/> 743 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"/> 744 <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/toastify-js/src/toastify.min.css"> 745 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@sweetalert2/theme-bulma@5/bulma.css" /> 746 747 <style> 748 .title:not(.is-spaced) + .subtitle { 749 margin-top: 0.7rem !important; 750 } 751 752 :where(input[type="checkbox"], input[type="radio"]):not([class]):not([style]):not([role="switch"]) { 753 accent-color: var(--theme-navy); 754 cursor: pointer; 755 height: 1.35rem; 756 margin: 0; 757 vertical-align: middle; 758 width: 1.35rem; 759 } 760 761 :where(input[type="checkbox"], input[type="radio"]):not([class]):not([style]):not([role="switch"]):focus-visible { 762 outline: 3px solid rgba(202, 168, 74, 0.45); 763 outline-offset: 3px; 764 } 765 766 :where(label.checkbox, label.radio):has(> input:not([class]):not([style]):not([role="switch"])) { 767 align-items: center; 768 border: 1px solid transparent; 769 border-radius: 14px; 770 cursor: pointer; 771 display: inline-flex; 772 gap: 0.7rem; 773 padding: 0.55rem 0.75rem; 774 transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease; 775 } 776 777 :where(label.checkbox, label.radio):has(> input:not([class]):not([style]):not([role="switch"])):hover { 778 background: rgba(26, 61, 124, 0.06); 779 border-color: rgba(26, 61, 124, 0.14); 780 } 781 782 :where(label.checkbox, label.radio):has(> input:not([class]):not([style]):not([role="switch"]):checked) { 783 background: rgba(26, 61, 124, 0.09); 784 border-color: rgba(26, 61, 124, 0.24); 785 color: var(--theme-navy-deep); 786 } 787 </style> 788 789</head> 790<body class=""> 791
792<script> 793 function openForm() { 794 document.getElementById("myForm").style.display = "block"; 795 } 796 797 function closeForm() { 798 document.getElementById("myForm").style.display = "none"; 799 } 800</script>
800 801 802 <section class="section"> 803 <div class="container"> 804 805 806 807 <div class="columns"> 808 <div class="column"> 809 <div class="content has-text-centered"> 810 <span class="icon is-large"> 811 <i class="fa-solid fa-circle-info fa-4x"></i> 812 </span> 813 <h1 class="title is-size-4 has-text-danger">à¹à¸à¹à¸à¸à¸±à¸à¸«à¸²à¸à¸²à¸£à¹à¸à¹à¸à¸²à¸/à¸à¸à¸à¸§à¸²à¸¡à¸à¹à¸§à¸¢à¹à¸«à¸¥à¸·à¸</h1> 814 <h1 class="subtitle is-size-6"> 815 à¸à¹à¸²à¸à¸ªà¸²à¸¡à¸²à¸£à¸à¹à¸à¹à¸à¸à¸±à¸à¸«à¸²à¸à¸²à¸£à¹à¸à¹à¸à¸²à¸à¸«à¸£à¸·à¸à¸à¸à¸à¸§à¸²à¸¡à¸à¹à¸§à¸¢à¹à¸«à¸¥à¸·à¸à¸à¹à¸²à¸à¸à¸²à¸£à¹à¸à¹à¸à¸²à¸à¸£à¸°à¸à¸à¹à¸à¹à¸à¸µà¹ <strong>Line MUMT-IT User Support</strong> 816 </h1> 817 <p> 818 <figure class="image is-128x128 is-inline-block"> 819 <img src="https://qr-official.line.me/gs/M_030btotn_BW.png?oat_content=qr"> 820 <a href="https://lin.ee/Z1QovqT"> 821 <img src="https://scdn.line-apps.com/n/line_add_friends/btn/th.png" alt="à¹à¸à¸´à¹à¸¡à¹à¸à¸·à¹à¸à¸" height="36" border="0"> 822 </a> 823 </figure> 824 </p> 825 </div> 826 </div> 827 </div> 828 </div> 829 </section> 830 831 832 <div class="footer"> 833 <div class="container"> 834 835 836 <div class="content has-text-centered"> 837 MUMT Information Management System Powered by HTMX, Bulma, Flask, SQLAlchemy and Python Technology 838 <div>Icons made by <a href="https://www.flaticon.com/authors/smashicons" 839 title="Smashicons">Smashicons</a> from 840 <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a> is licensed by 841 <a href="http://creativecommons.org/licenses/by/3.0/" 842 title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></div> 843 844 </div> 845 </div> 846 </div> 847 848 849 850
850<script src="https://unpkg.com/@popperjs/core@2"></script>
850 851
851<script src="https://unpkg.com/tippy.js@6"></script>
851 852
852<script src="https://unpkg.com/[email protected]"></script>
852 853
853<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
853 854
854<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/shepherd.min.js"></script>
854 855
855<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
855 856
856<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.3/moment-with-locales.min.js" integrity="sha512-vFABRuf5oGUaztndx4KoAEUVQnOvAIFs59y4tO0DILGWhQiFnFHiR+ZJfxLDyJlXgeut9Z07Svuvm+1Jv89w5g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
856 857
857<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.3/locale/th.min.js" integrity="sha512-IiSJKJyOVydT9/jfVcnpg7PIUM41Be6YzR5bTiAEAEQxTVtnUhbhiSNtgGXmOTFoxYpYs+LdxWlELOK7iRVVBg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
857 858
858<script src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script>
858 859
859<script src="https://cdn.datatables.net/plug-ins/1.13.6/sorting/datetime-moment.js"></script>
859 860
860<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.12/vue.min.js"></script>
860 861
861<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.min.js"></script>
861 862
862<script src="/static/js/buefy.min.js"></script>
862 863
863<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
863 864
864<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.4.1/knockout.mapping.min.js"></script>
864 865
865<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.min.js"></script>
865 866
866<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/print.min.js"></script>
866 867
867<script src="https://cdnjs.cloudflare.com/ajax/libs/cleave.js/1.5.8/cleave.min.js" 868 integrity="sha256-F/xzCMjFU6UaVTw7IPk3dDxJ5mvvonjQxVfIPqbJDmA=" crossorigin="anonymous"></script>
868 869
869<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bulma-extensions.min.js"></script>
869 870
870<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bulma-accordion.min.js"></script>
870 871
871<script src="https://cdn.datatables.net/1.12.0/js/dataTables.bulma.min.js"></script>
871 872
872<script src="https://cdn.datatables.net/fixedcolumns/4.2.1/js/dataTables.fixedColumns.min.js"></script>
872 873
873<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/toastify-js"></script>
873 874
874<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
874 875
875<script src="/static/js/navbar.js"></script>
875 876 877
877<script> 878 if (window.moment) { 879 moment.locale('th'); 880 } 881 if (window.$ && window.bulmaAccordion) { 882 $(document).ready(function () { 883 bulmaAccordion.attach(); 884 }); 885 } 886 </script>
886 887
887<script> 888 function showToastAlert(icon, msg) { 889 if (!window.Swal) { 890 return; 891 } 892 Swal.fire({ 893 title: msg, 894 icon: icon, 895 toast: true, 896 position: 'top', 897 iconColor: 'white', 898 customClass: { 899 popup: 'colored-toast' 900 }, 901 showConfirmButton: false, 902 timer: 1500, 903 }); 904 } 905 906 document.addEventListener('DOMContentLoaded', 907 () => { 908 (document.querySelectorAll('.notification .delete') || []).forEach(($delete) => { 909 const $notification = $delete.parentNode; 910 911 $delete.addEventListener('click', () => { 912 $notification.parentNode.removeChild($notification); 913 }); 914 }); 915 }) 916 document.body.addEventListener('successAlert', function(evt) { 917 let msg = evt.detail.value 918 showToastAlert('success', msg) 919 }) 920 document.addEventListener('dangerAlert', function(evt) { 921 let msg = evt.detail.value 922 showToastAlert('error', msg) 923 }) 924 document.addEventListener('htmx:responseError', function(evt) { 925 let msg = evt.detail.xhr.statusText 926 showToastAlert('error', msg) 927 }) 928 </script>
928 929 930</body> 931</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.