diff --git a/groups/HarusSelesaiKP/images/audit-untan.webp b/groups/HarusSelesaiKP/images/audit-untan.webp new file mode 100644 index 0000000..73f7849 Binary files /dev/null and b/groups/HarusSelesaiKP/images/audit-untan.webp differ diff --git a/groups/HarusSelesaiKP/images/bem-untan.webp b/groups/HarusSelesaiKP/images/bem-untan.webp new file mode 100644 index 0000000..7a760e7 Binary files /dev/null and b/groups/HarusSelesaiKP/images/bem-untan.webp differ diff --git a/groups/HarusSelesaiKP/images/cafatifa-untan.webp b/groups/HarusSelesaiKP/images/cafatifa-untan.webp new file mode 100644 index 0000000..c049d4c Binary files /dev/null and b/groups/HarusSelesaiKP/images/cafatifa-untan.webp differ diff --git a/groups/HarusSelesaiKP/images/gebuk-sambalado.webp b/groups/HarusSelesaiKP/images/gebuk-sambalado.webp new file mode 100644 index 0000000..d4717d7 Binary files /dev/null and b/groups/HarusSelesaiKP/images/gebuk-sambalado.webp differ diff --git a/groups/HarusSelesaiKP/images/hmif-untan.webp b/groups/HarusSelesaiKP/images/hmif-untan.webp new file mode 100644 index 0000000..551378c Binary files /dev/null and b/groups/HarusSelesaiKP/images/hmif-untan.webp differ diff --git a/groups/HarusSelesaiKP/images/khatulistiwa.webp b/groups/HarusSelesaiKP/images/khatulistiwa.webp new file mode 100644 index 0000000..f86b60f Binary files /dev/null and b/groups/HarusSelesaiKP/images/khatulistiwa.webp differ diff --git a/groups/HarusSelesaiKP/images/kota-sari.webp b/groups/HarusSelesaiKP/images/kota-sari.webp new file mode 100644 index 0000000..ad9c111 Binary files /dev/null and b/groups/HarusSelesaiKP/images/kota-sari.webp differ diff --git a/groups/HarusSelesaiKP/images/lisma-untan.webp b/groups/HarusSelesaiKP/images/lisma-untan.webp new file mode 100644 index 0000000..11551af Binary files /dev/null and b/groups/HarusSelesaiKP/images/lisma-untan.webp differ diff --git a/groups/HarusSelesaiKP/images/mapala-untan.webp b/groups/HarusSelesaiKP/images/mapala-untan.webp new file mode 100644 index 0000000..757fc69 Binary files /dev/null and b/groups/HarusSelesaiKP/images/mapala-untan.webp differ diff --git a/groups/HarusSelesaiKP/images/rumah-radank.webp b/groups/HarusSelesaiKP/images/rumah-radank.webp new file mode 100644 index 0000000..83c7dd0 Binary files /dev/null and b/groups/HarusSelesaiKP/images/rumah-radank.webp differ diff --git a/groups/HarusSelesaiKP/images/waterfront.webp b/groups/HarusSelesaiKP/images/waterfront.webp new file mode 100644 index 0000000..61622a3 Binary files /dev/null and b/groups/HarusSelesaiKP/images/waterfront.webp differ diff --git a/groups/HarusSelesaiKP/index.html b/groups/HarusSelesaiKP/index.html index 22b3d34..cecfeec 100644 --- a/groups/HarusSelesaiKP/index.html +++ b/groups/HarusSelesaiKP/index.html @@ -1,1351 +1,407 @@  - - - - - Group 03 – HarusSelesaiKP | Informatika UNTAN - - - - - - - - #pengumuman-bar { - z-index: 40; - } + + - #pengumuman-bar.is-stuck { - position: fixed; - left: 0; - right: 0; - z-index: 40; - } + + - @media (prefers-reduced-motion: reduce) { - *, - *::before, - *::after { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - } - } + + + + + - /* Skip Link Styling */ - .skip-link { - position: absolute; - top: -40px; - left: 0; - background: #003150; - color: white; - padding: 8px 16px; - z-index: 100; - transition: top 0.3s; - } + + + + - .skip-link:focus { - top: 0; - } - /* Focus visible for better keyboard navigation */ - :focus-visible { - outline: 3px solid #feb401; - outline-offset: 2px; - } + + - /* Mega Menu Styles */ - .hero-pagination .swiper-pagination-bullet { - width: 8px; - height: 8px; - border-radius: 50%; - background: rgba(255, 255, 255, 0.4); - display: inline-block; - margin: 0 4px; - cursor: pointer; - transition: all 0.3s ease; - } - - .hero-pagination .swiper-pagination-bullet-active { - background: rgba(255, 255, 255, 1); - width: 24px; - border-radius: 4px; - } - - .mega-panel { - opacity: 0; - visibility: hidden; - transition: - opacity 0.2s ease, - visibility 0.2s ease; - position: absolute; - top: 100%; - left: 0; - right: 0; - } - - .mega-panel.active { - opacity: 1; - visibility: visible; - } - - /* Overlay transition */ - #mega-overlay { - opacity: 0; - visibility: hidden; - transition: - opacity 0.2s ease, - visibility 0.2s ease; - } - - #mega-overlay.active { - opacity: 1; - visibility: visible; - } - - .mega-link-card { - display: flex; - align-items: flex-start; - gap: 1rem; - padding: 1rem; - border-radius: 0.75rem; - border: 1px solid #e2e8f0; - background: white; - transition: all 0.2s ease; - } - - .mega-link-card:hover { - border-color: #3b82f6; - box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15); - transform: translateY(-2px); - } - - .mega-link-icon { - width: 2.5rem; - height: 2.5rem; - border-radius: 0.5rem; - display: flex; - align-items: center; - justify-content: center; - flex-shrink: 0; - transition: all 0.2s ease; - } - - .nav-menu-btn.active { - background: rgba(255, 255, 255, 0.9); - color: #1e40af; - } - - .nav-menu-btn:hover { - background: rgba(255, 255, 255, 0.8); - } - - /* Mega menu positioning - no gap */ - #main-nav { - position: relative; - } - - #mega-menu-container { - position: absolute; - top: 100%; - left: 0; - right: 0; - pointer-events: none; - } - - #mega-menu-container .mega-panel { - pointer-events: auto; - } - - /* Keep pointer bridge under nav to prevent hover loss */ - .nav-menu-item { - position: relative; - } - - .nav-menu-item::after { - content: ""; - position: absolute; - bottom: -12px; - left: 0; - right: 0; - height: 12px; - } - - /* ===== Luco Chatbot Animations ===== */ - @keyframes slideInRight { - from { - transform: translateX(100px); - opacity: 0; - } - - to { - transform: translateX(0); - opacity: 1; - } - } - - @keyframes fadeInUp { - from { - transform: translateY(10px); - opacity: 0; - } - - to { - transform: translateY(0); - opacity: 1; - } - } - - @keyframes lucoPulse { - 0%, - 100% { - transform: scale(1); - } - - 50% { - transform: scale(1.05); - } - } - - #luco-container { - animation: slideInRight 0.5s ease-out forwards; - } - - #luco-bubble { - animation: fadeInUp 0.3s ease-out forwards; - width: min(18rem, calc(100vw - 2rem)); - } - - #luco-btn { - animation: lucoPulse 2s ease-in-out infinite; - } - - #luco-btn:hover { - animation: none; - } - - /* Typing indicator */ - .typing-indicator span { - display: inline-block; - animation: bounce 1.4s infinite ease-in-out; - } - - .typing-indicator span:nth-child(1) { - animation-delay: 0s; - } - - .typing-indicator span:nth-child(2) { - animation-delay: 0.2s; - } - - .typing-indicator span:nth-child(3) { - animation-delay: 0.4s; - } - - @keyframes bounce { - 0%, - 80%, - 100% { - transform: translateY(0); - } - - 40% { - transform: translateY(-6px); - } - } - - /* Luco speech bubble arrow */ - #luco-bubble .bubble-arrow { - position: absolute; - right: 24px; - bottom: -6px; - width: 12px; - height: 12px; - background: white; - transform: rotate(45deg); - border-right: 1px solid #e2e8f0; - border-bottom: 1px solid #e2e8f0; - } - - - - - - -