diff --git a/assets/edukarsa.js b/assets/edukarsa.js new file mode 100644 index 0000000..bea8a38 --- /dev/null +++ b/assets/edukarsa.js @@ -0,0 +1,69 @@ +document.addEventListener("DOMContentLoaded", function() { + // Menu Toggle + const toggleBtn = document.getElementById("mobile-menu-toggle"); + const navMenu = document.getElementById("site-navigation"); + if (toggleBtn && navMenu) { + toggleBtn.addEventListener("click", function() { + toggleBtn.classList.toggle("active"); + navMenu.classList.toggle("active"); + }); + } + + // Back to Top + const bttBtn = document.getElementById("back-to-top"); + if (bttBtn) { + window.addEventListener("scroll", function() { + if (window.scrollY > 350) { bttBtn.classList.add("show"); } else { bttBtn.classList.remove("show"); } + }); + bttBtn.addEventListener("click", function() { + window.scrollTo({ top: 0, behavior: "smooth" }); + }); + } + + // Accessibility Panel + const a11yTrigger = document.getElementById("a11y-trigger"); + const a11yPanel = document.getElementById("a11y-panel"); + const a11yClose = document.getElementById("a11y-close"); + if (a11yTrigger && a11yPanel) { + a11yTrigger.addEventListener("click", function() { a11yPanel.classList.toggle("active"); }); + if (a11yClose) { a11yClose.addEventListener("click", function() { a11yPanel.classList.remove("active"); }); } + + const fontLevels = ['', 'a11y-font-lg', 'a11y-font-xl']; + let currentFontIdx = parseInt(localStorage.getItem('edukarsa_a11y_font') || '0', 10); + function applyA11y() { + fontLevels.forEach(function(c) { if (c) document.body.classList.remove(c); }); + if (fontLevels[currentFontIdx]) { document.body.classList.add(fontLevels[currentFontIdx]); } + if (localStorage.getItem('edukarsa_a11y_contrast') === '1') { document.body.classList.add('a11y-high-contrast'); } else { document.body.classList.remove('a11y-high-contrast'); } + if (localStorage.getItem('edukarsa_a11y_grayscale') === '1') { document.body.classList.add('a11y-grayscale'); } else { document.body.classList.remove('a11y-grayscale'); } + if (localStorage.getItem('edukarsa_a11y_links') === '1') { document.body.classList.add('a11y-underline-links'); } else { document.body.classList.remove('a11y-underline-links'); } + } + applyA11y(); + + document.getElementById("a11y-font-inc")?.addEventListener("click", function() { if (currentFontIdx < fontLevels.length - 1) currentFontIdx++; localStorage.setItem('edukarsa_a11y_font', currentFontIdx); applyA11y(); }); + document.getElementById("a11y-font-dec")?.addEventListener("click", function() { if (currentFontIdx > 0) currentFontIdx--; localStorage.setItem('edukarsa_a11y_font', currentFontIdx); applyA11y(); }); + document.getElementById("a11y-font-reset")?.addEventListener("click", function() { currentFontIdx = 0; localStorage.setItem('edukarsa_a11y_font', currentFontIdx); applyA11y(); }); + document.getElementById("a11y-contrast")?.addEventListener("click", function() { const active = localStorage.getItem('edukarsa_a11y_contrast') === '1'; localStorage.setItem('edukarsa_a11y_contrast', active ? '0' : '1'); applyA11y(); }); + document.getElementById("a11y-grayscale")?.addEventListener("click", function() { const active = localStorage.getItem('edukarsa_a11y_grayscale') === '1'; localStorage.setItem('edukarsa_a11y_grayscale', active ? '0' : '1'); applyA11y(); }); + document.getElementById("a11y-links")?.addEventListener("click", function() { const active = localStorage.getItem('edukarsa_a11y_links') === '1'; localStorage.setItem('edukarsa_a11y_links', active ? '0' : '1'); applyA11y(); }); + document.getElementById("a11y-reset-all")?.addEventListener("click", function() { + currentFontIdx = 0; + localStorage.removeItem('edukarsa_a11y_font'); + localStorage.removeItem('edukarsa_a11y_contrast'); + localStorage.removeItem('edukarsa_a11y_grayscale'); + localStorage.removeItem('edukarsa_a11y_links'); + applyA11y(); + }); + } + + // Homepage Hero Slider Scroll + const slider = document.getElementById('hero-slider-wrapper'); + if (slider && slider.children.length > 1) { + setInterval(function() { + if (slider.scrollLeft + slider.clientWidth >= slider.scrollWidth - 10) { + slider.scrollTo({ left: 0, behavior: 'smooth' }); + } else { + slider.scrollBy({ left: slider.clientWidth, behavior: 'smooth' }); + } + }, 4000); + } +}); diff --git a/comments.php b/comments.php new file mode 100644 index 0000000..4646602 --- /dev/null +++ b/comments.php @@ -0,0 +1,41 @@ + +
+ +

+ +

+ +
    + 48, + 'style' => 'ol', + 'short_ping' => true, + ) ); + ?> +
+ + '« ' . esc_html__( 'Komentar Lama', 'edukarsa' ), + 'next_text' => esc_html__( 'Komentar Baru', 'edukarsa' ) . ' »', + ) ); ?> + + + + +

+ + + +
diff --git a/footer.php b/footer.php index bd11700..d60d1a0 100644 --- a/footer.php +++ b/footer.php @@ -1,8 +1,6 @@ - - -
- -
-

♿ Aksesibilitas

+

- Pembaca Suara (Audio) +
- - + +
-
- Ukuran Teks +
- +
-
- Tampilan Visual +
- - + +
-
- Navigasi +
- - + +
@@ -192,7 +160,6 @@ $wa_def_msg = get_option( 'edukarsa_wa_default_msg', 'Halo Admin EduKarsa, say
- @@ -200,183 +167,7 @@ $wa_def_msg = get_option( 'edukarsa_wa_default_msg', 'Halo Admin EduKarsa, say - - - - + diff --git a/functions.php b/functions.php index 9b50e0e..23aecc4 100644 --- a/functions.php +++ b/functions.php @@ -1,18 +1,28 @@ + > @@ -7,128 +9,66 @@ > - -
-
-
- - - <?php bloginfo( 'name' ); ?> - -

- - -
+ - -
- - - - 'ID' ); - if ( get_option( 'edukarsa_lang_en', 1 ) == 1 ) $available_langs['en'] = 'EN'; - if ( get_option( 'edukarsa_lang_ar', 0 ) == 1 ) $available_langs['ar'] = 'AR'; - if ( get_option( 'edukarsa_lang_zh', 0 ) == 1 ) $available_langs['zh-CN'] = 'ZH'; - if ( get_option( 'edukarsa_lang_ja', 0 ) == 1 ) $available_langs['ja'] = 'JA'; - - $incl_codes = implode( ',', array_keys( $available_langs ) ); +
+
+
+ + -
- $label ) : - $idx++; - ?> - - | - -
- + <?php bloginfo( 'name' ); ?> + +

- - - -
- +
-
- - - - - - +
+ + 'ID' ); + if ( get_option( 'edukarsa_lang_en', 1 ) == 1 ) $available_langs['en'] = 'EN'; + if ( get_option( 'edukarsa_lang_ar', 0 ) == 1 ) $available_langs['ar'] = 'AR'; + if ( get_option( 'edukarsa_lang_zh', 0 ) == 1 ) $available_langs['zh-CN'] = 'ZH'; + if ( get_option( 'edukarsa_lang_ja', 0 ) == 1 ) $available_langs['ja'] = 'JA'; + ?> +
+ $label ) : + $idx++; + ?> + + | + +
+ + + +
+
+
diff --git a/inc/cpt-slider.php b/inc/cpt-slider.php index 2d529a5..01a8a63 100644 --- a/inc/cpt-slider.php +++ b/inc/cpt-slider.php @@ -1,86 +1,7 @@ - array('name' => 'Semua Slider', 'singular_name' => 'Slider', 'add_new_item' => 'Tambah Slider'), - 'supports' => array('title', 'thumbnail'), 'public' => false, 'show_ui' => true, 'show_in_menu' => false - )); - register_post_type( 'program', array( - 'labels' => array('name' => 'Semua Program', 'singular_name' => 'Program', 'add_new_item' => 'Tambah Program'), - 'supports' => array('title', 'editor', 'thumbnail', 'excerpt'), 'public' => true, 'show_ui' => true, 'show_in_menu' => false - )); - register_post_type( 'milestone', array( - 'labels' => array('name' => 'Semua Milestone', 'singular_name' => 'Milestone', 'add_new_item' => 'Tambah Milestone'), - 'supports' => array('title', 'excerpt'), 'public' => false, 'show_ui' => true, 'show_in_menu' => false - )); - register_post_type( 'keunggulan', array( - 'labels' => array('name' => 'Semua Keunggulan', 'singular_name' => 'Keunggulan', 'add_new_item' => 'Tambah Keunggulan'), - 'supports' => array('title', 'editor'), 'public' => false, 'show_ui' => true, 'show_in_menu' => false - )); - register_post_type( 'faq', array( - 'labels' => array('name' => 'Semua FAQ', 'singular_name' => 'FAQ', 'add_new_item' => 'Tambah FAQ Baru', 'all_items' => 'Semua FAQ'), - 'supports' => array('title', 'editor'), 'public' => false, 'show_ui' => true, 'show_in_menu' => false - )); -} -add_action( 'init', 'edukarsa_register_all_cpt', 0 ); - -// METABOX UNTUK LINK SLIDER -function edukarsa_slider_meta_box() { - add_meta_box( 'slider_link_meta', 'Tautan (URL) Slider', 'edukarsa_slider_meta_callback', 'slider', 'normal', 'high' ); -} -add_action( 'add_meta_boxes', 'edukarsa_slider_meta_box' ); - -function edukarsa_slider_meta_callback( $post ) { - wp_nonce_field( 'edukarsa_slider_save', 'edukarsa_slider_meta_nonce' ); - $value = get_post_meta( $post->ID, '_slider_link', true ); - echo '

Masukkan URL tujuan jika pengunjung mengklik gambar slider ini (opsional).

'; - echo ''; -} - -function edukarsa_slider_save_meta( $post_id ) { - if ( ! isset( $_POST['edukarsa_slider_meta_nonce'] ) || ! wp_verify_nonce( $_POST['edukarsa_slider_meta_nonce'], 'edukarsa_slider_save' ) ) return; - if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) return; - if ( isset( $_POST['slider_link'] ) ) { update_post_meta( $post_id, '_slider_link', sanitize_text_field( $_POST['slider_link'] ) ); } -} -add_action( 'save_post', 'edukarsa_slider_save_meta' ); - -// --- REGISTRASI CPT GALERI & TAXONOMY --- -function edukarsa_register_galeri_cpt() { - register_post_type( 'galeri', array( - 'labels' => array( - 'name' => 'Galeri Fasilitas', - 'singular_name' => 'Galeri', - 'add_new_item' => 'Tambah Foto Galeri', - 'all_items' => 'Semua Foto Galeri' - ), - 'supports' => array('title', 'editor', 'thumbnail', 'excerpt'), - 'public' => true, - 'show_ui' => true, - 'show_in_menu' => false, - 'menu_icon' => 'dashicons-format-gallery' - )); - - register_taxonomy( 'kategori_galeri', 'galeri', array( - 'labels' => array('name' => 'Kategori Galeri', 'singular_name' => 'Kategori', 'add_new_item' => 'Tambah Kategori'), - 'hierarchical' => true, - 'public' => true, - 'show_ui' => true, - 'show_admin_column' => true, - 'show_in_menu' => false - )); -} -add_action( 'init', 'edukarsa_register_galeri_cpt', 0 ); - -// --- NOTIFIKASI PANDUAN RESOLUSI SLIDER --- -function edukarsa_slider_admin_notice() { - $screen = get_current_screen(); - if ( isset($screen->post_type) && $screen->post_type === 'slider' ) { - echo '
-

💡 Panduan Resolusi Gambar: Untuk tampilan terbaik tanpa pecah, gunakan gambar beresolusi 1920x1080 piksel (16:9) pada kotak Gambar Unggulan (Featured Image) di sisi kanan bawah.

-
'; - } -} -add_action('admin_notices', 'edukarsa_slider_admin_notice'); +defined( 'ABSPATH' ) || exit; diff --git a/inc/security.php b/inc/security.php index 038cd2a..155ce12 100644 --- a/inc/security.php +++ b/inc/security.php @@ -1,13 +1,11 @@ [\d]+)'] ) ) { - unset( $endpoints['/wp/v2/users/(?P[\d]+)'] ); - } - } - return $endpoints; -} -add_filter( 'rest_endpoints', 'edukarsa_restrict_rest_users_endpoint' ); - -// 5. SANITASI INPUT PENCARIAN (ANTI-REFLECTED XSS) -function edukarsa_sanitize_search_query( $query ) { - if ( ! is_admin() && $query->is_main_query() && $query->is_search() ) { - $s = $query->get( 's' ); - $query->set( 's', sanitize_text_field( $s ) ); - } - return $query; -} -add_action( 'pre_get_posts', 'edukarsa_sanitize_search_query' ); diff --git a/inc/setup.php b/inc/setup.php index d178a45..8c70f71 100644 --- a/inc/setup.php +++ b/inc/setup.php @@ -1,55 +1,90 @@ __( 'Menu Utama', 'edukarsa' ), - 'menu-footer' => __( 'Menu Footer', 'edukarsa' ), + add_theme_support( 'automatic-feed-links' ); + add_theme_support( 'title-tag' ); + add_theme_support( 'post-thumbnails' ); + add_theme_support( 'align-wide' ); + add_theme_support( 'wp-block-styles' ); + add_theme_support( 'responsive-embeds' ); + add_theme_support( 'editor-styles' ); + add_editor_style( 'style.css' ); + add_theme_support( 'html5', array( 'search-form', 'comment-form', 'comment-list', 'gallery', 'caption', 'style', 'script' ) ); + + add_theme_support( 'custom-logo', array( + 'height' => 110, + 'width' => 400, + 'flex-height' => true, + 'flex-width' => true, + ) ); + + add_theme_support( 'custom-header', array( + 'default-image' => '', + 'width' => 1920, + 'height' => 800, + 'flex-height' => true, + ) ); + + add_theme_support( 'custom-background', array( + 'default-color' => 'ffffff', + ) ); + + register_nav_menus( array( + 'menu-utama' => esc_html__( 'Menu Navigasi Utama', 'edukarsa' ), + 'menu-footer' => esc_html__( 'Menu Tautan Footer', 'edukarsa' ), + ) ); + } +} +add_action( 'after_setup_theme', 'edukarsa_theme_setup' ); + +function edukarsa_register_block_components() { + if ( function_exists( 'register_block_style' ) ) { + register_block_style( 'core/quote', array( + 'name' => 'edukarsa-quote', + 'label' => esc_html__( 'EduKarsa Quote', 'edukarsa' ), + ) ); + } + + if ( function_exists( 'register_block_pattern' ) ) { + register_block_pattern( + 'edukarsa/cta-banner', + array( + 'title' => esc_html__( 'EduKarsa CTA Banner', 'edukarsa' ), + 'description' => esc_html__( 'Banner ajakan pendaftaran PMB EduKarsa', 'edukarsa' ), + 'content' => '

' . esc_html__( 'Pendaftaran Mahasiswa / Siswa Baru Telah Dibuka!', 'edukarsa' ) . '

', + 'categories' => array( 'featured' ), + ) + ); + } +} +add_action( 'init', 'edukarsa_register_block_components' ); + +function edukarsa_register_sidebars() { + register_sidebar( array( + 'name' => esc_html__( 'Sidebar Utama', 'edukarsa' ), + 'id' => 'sidebar-utama', + 'description' => esc_html__( 'Area widget untuk bilah samping postingan dan halaman.', 'edukarsa' ), + 'before_widget' => '', + 'before_title' => '

', + 'after_title' => '

', ) ); } -add_action( 'after_setup_theme', 'edukarsa_setup' ); +add_action( 'widgets_init', 'edukarsa_register_sidebars' ); -// 2. MENGHUBUNGKAN ASET (CSS & JS FRONTEND) -function edukarsa_scripts() { - // Memaksa path absolut langsung ke folder tema dengan Cache Busting time() - wp_enqueue_style( - 'edukarsa-style', - get_template_directory_uri() . '/style.css', - array(), - time(), - 'all' - ); -} -add_action( 'wp_enqueue_scripts', 'edukarsa_scripts' ); +function edukarsa_enqueue_scripts() { + wp_enqueue_style( 'edukarsa-style', get_stylesheet_uri(), array(), time() ); -// 3. MEMUAT JAVASCRIPT UNTUK MEDIA UPLOADER (DASHBOARD) -function edukarsa_admin_scripts( $hook ) { - // Memastikan skrip uploader dipanggil di halaman pengaturan Edukarsa - if ( strpos( $hook, 'edukarsa' ) !== false ) { - wp_enqueue_media(); + if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) { + wp_enqueue_script( 'comment-reply' ); + } + + if ( file_exists( get_template_directory() . '/assets/edukarsa.js' ) ) { + wp_enqueue_script( 'edukarsa-global-js', get_template_directory_uri() . '/assets/edukarsa.js', array(), time(), true ); } } -add_action( 'admin_enqueue_scripts', 'edukarsa_admin_scripts' ); - -// 4. REDIRECT SETELAH AKTIVASI TEMA - -// 4. REDIRECT AMAN SETELAH AKTIVASI TEMA -function edukarsa_activation_redirect() { - global $pagenow; - if ( 'themes.php' === $pagenow && isset( $_GET['activated'] ) ) { - // Redirect yang aman, dipanggil setelah seluruh menu dan hak akses WordPress siap - wp_safe_redirect( admin_url( 'admin.php?page=edukarsa_settings' ) ); - exit; - } -} -add_action( 'admin_init', 'edukarsa_activation_redirect' ); +add_action( 'wp_enqueue_scripts', 'edukarsa_enqueue_scripts' ); diff --git a/readme.txt b/readme.txt new file mode 100644 index 0000000..6813135 --- /dev/null +++ b/readme.txt @@ -0,0 +1,27 @@ +=== EduKarsa === +Contributors: masbudikusuma +Requires at least: 6.0 +Tested up to: 6.7 +Requires PHP: 7.4 +Stable tag: 1.1.6 +License: GPLv2 or later +License URI: https://www.gnu.org/licenses/gpl-2.0.html + +EduKarsa adalah tema WordPress native modern yang didesain khusus untuk portal web sekolah, madrasah, pesantren, dan institusi akademik. + +== Description == +EduKarsa dirancang dengan filosofi 100% Native & Zero Plugin. Menyediakan performa muat halaman ultra-cepat, fitur aksesibilitas WCAG 2.1 AAA, struktur JSON-LD terpadu, dan konfigurasi fleksibel langsung dari WordPress Customizer/Settings API tanpa membutuhkan plugin berat pihak ketiga. + +== Installation == +1. Di dasbor WordPress Anda, buka menu Appearance > Themes > Add New. +2. Unggah file zip tema EduKarsa. +3. Klik Activate setelah instalasi selesai. +4. Buka menu EduKarsa di dasbor admin untuk mengonfigurasi profil sekolah dan tata letak. + +== Frequently Asked Questions == += Apakah tema ini membutuhkan plugin builder seperti Elementor? = +Tidak. EduKarsa dirancang 100% native dan bebas plugin. + +== Copyright == +EduKarsa WordPress Theme, Copyright 2026 Mas Budi Kusuma. +EduKarsa didistribusikan di bawah lisensi GNU GPL v2 atau yang lebih baru. diff --git a/screenshot.png b/screenshot.png index 13776bb..bd8b726 100644 Binary files a/screenshot.png and b/screenshot.png differ diff --git a/screenshots/sambutan.jpg b/screenshots/sambutan.jpg index 4afc568..cd50051 100644 Binary files a/screenshots/sambutan.jpg and b/screenshots/sambutan.jpg differ diff --git a/screenshots/slide1.jpg b/screenshots/slide1.jpg index 5f23bbc..bdf9cc1 100644 Binary files a/screenshots/slide1.jpg and b/screenshots/slide1.jpg differ diff --git a/screenshots/slide2.jpg b/screenshots/slide2.jpg index 6fd4500..df29a55 100644 Binary files a/screenshots/slide2.jpg and b/screenshots/slide2.jpg differ diff --git a/screenshots/slide3.jpg b/screenshots/slide3.jpg index 6f43833..f0d36f3 100644 Binary files a/screenshots/slide3.jpg and b/screenshots/slide3.jpg differ diff --git a/sidebar.php b/sidebar.php index b2e9941..de37c36 100644 --- a/sidebar.php +++ b/sidebar.php @@ -1,25 +1,19 @@ - -
- -

@@ -65,7 +57,6 @@ 'posts_per_page' => $count, 'post__not_in' => array( get_the_ID() ) ) ); - if ( $recent_query->have_posts() ) : while ( $recent_query->have_posts() ) : $recent_query->the_post(); ?> @@ -76,7 +67,7 @@
- 📅 + 📅

@@ -86,14 +77,13 @@ endwhile; wp_reset_postdata(); else : - echo '

Belum ada artikel lainnya.

'; + echo '

' . esc_html__( 'Belum ada artikel lainnya.', 'edukarsa' ) . '

'; endif; ?>
-

@@ -113,17 +103,15 @@
- -
- Banner Pengumuman + <?php esc_attr_e( 'Banner Pengumuman', 'edukarsa' ); ?>
- diff --git a/single.php b/single.php index 734520e..c58f52f 100644 --- a/single.php +++ b/single.php @@ -1,23 +1,13 @@ - -
- -
- - - -
- -
-
- - +
Fitur Unggulan Tema: -Version: 1.1.5 -Tags: pendidikan, sekolah, universitas, custom-menu, custom-logo, modern-layout, responsive-layout, translation-ready, accessibility-ready, seo-friendly +Description: Tema WordPress native profesional untuk institusi pendidikan, sekolah, madrasah, dan perguruan tinggi dengan arsitektur modern card layout, aksesibilitas WCAG 2.1, serta kecepatan tinggi tanpa plugin pihak ketiga. +Version: 1.1.6 +Tested up to: 6.7 +Requires at least: 6.0 +Requires PHP: 7.4 +License: GNU General Public License v2 or later +License URI: https://www.gnu.org/licenses/gpl-2.0.html +Text Domain: edukarsa +Tags: education, grid-layout, custom-menu, custom-logo, featured-images, translation-ready, wide-blocks, block-styles, full-width-template, theme-options */ :root { @@ -17,17 +23,17 @@ Tags: pendidikan, sekolah, universitas, custom-menu, custom-logo, modern-layout, --bg-light-blue: #f8fafc; --bg-white: #ffffff; --radius: 14px; - --shadow: 0 12px 32px rgba(15, 23, 42, 0.08); + --shadow: 0 12px 32px rgba(15, 23, 42, 0.08); --font-main: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif; } /* 1. RESET & DASAR */ * { box-sizing: border-box; margin: 0; padding: 0; } -body { - font-family: var(--font-main); - color: var(--text-color); - background-color: var(--bg-white); - line-height: 1.7; +body { + font-family: var(--font-main); + color: var(--text-color); + background-color: var(--bg-white); + line-height: 1.7; font-size: 16px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; @@ -38,6 +44,48 @@ img { max-width: 100%; height: auto; display: block; } a { text-decoration: none; color: var(--primary-color); transition: 0.3s; } h1, h2, h3, h4, h5, h6 { color: var(--heading-color); font-weight: 800; line-height: 1.3; } +/* Standar Kelas Wajib WordPress Theme Check */ +.screen-reader-text { + border: 0; + clip: rect(1px, 1px, 1px, 1px); + clip-path: inset(50%); + height: 1px; + margin: -1px; + overflow: hidden; + padding: 0; + position: absolute !important; + width: 1px; + word-wrap: normal !important; +} +.screen-reader-text:focus { + background-color: #f1f5f9; + border-radius: 4px; + box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.2); + clip: auto !important; + clip-path: none; + color: var(--primary-color); + display: block; + font-size: 14px; + font-weight: 700; + height: auto; + left: 8px; + line-height: normal; + padding: 12px 20px; + text-decoration: none; + top: 8px; + width: auto; + z-index: 100000; +} +.alignleft { float: left; margin: 0.5em 1.5em 1.5em 0; } +.alignright { float: right; margin: 0.5em 0 1.5em 1.5em; } +.aligncenter { display: block; margin-left: auto; margin-right: auto; clear: both; } +.wp-caption { margin-bottom: 1.5em; max-width: 100%; text-align: center; } +.wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } +.wp-caption-text { font-size: 13px; color: var(--text-muted); margin-top: 6px; font-style: italic; } +.sticky { border-left: 4px solid var(--secondary-color); padding-left: 10px; } +.gallery-caption { font-size: 12px; color: var(--text-muted); text-align: center; } +.bypostauthor { font-weight: inherit; } + /* 2. LAYOUT UTAMA */ .container { max-width: 1200px; margin: 0 auto; padding: 0 20px; } .text-center { text-align: center; } @@ -111,11 +159,9 @@ h1, h2, h3, h4, h5, h6 { color: var(--heading-color); font-weight: 800; line-hei .stat-card-modern .stat-number { font-size: 40px; font-weight: 800; color: var(--primary-color); margin-bottom: 4px; line-height: 1; } .stat-card-modern .stat-title { font-size: 17px; font-weight: 800; color: var(--heading-color); margin-bottom: 6px; } .stat-card-modern .stat-desc { font-size: 14px; color: var(--text-muted); line-height: 1.6; margin: 0; } - .edukarsa-sambutan { padding: 45px 0 50px; } .sambutan-grid { display: grid; grid-template-columns: 360px 1fr; gap: 50px; align-items: start; } .sambutan-text { color: #475569; font-size: 15px; line-height: 1.8; margin-bottom: 25px; } - .milestone-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; } .program-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; } .program-card { padding: 30px 22px; } @@ -137,15 +183,15 @@ h1, h2, h3, h4, h5, h6 { color: var(--heading-color); font-weight: 800; line-hei /* FLOATING CTA */ .edukarsa-cta-floating-section { position: relative; z-index: 15; margin-top: -45px; margin-bottom: 20px; } -.cta-floating-card { - background: linear-gradient(135deg, var(--secondary-color), var(--primary-color)); - border-radius: 20px; - padding: 35px 45px; - display: flex; - justify-content: space-between; - align-items: center; - box-shadow: 0 18px 40px rgba(0,0,0,0.18); - border: 1px solid rgba(255,255,255,0.2); +.cta-floating-card { + background: linear-gradient(135deg, var(--secondary-color), var(--primary-color)); + border-radius: 20px; + padding: 35px 45px; + display: flex; + justify-content: space-between; + align-items: center; + box-shadow: 0 18px 40px rgba(0,0,0,0.18); + border: 1px solid rgba(255,255,255,0.2); } .cta-floating-title { font-size: 26px; font-weight: 800; color: #ffffff; margin: 0; letter-spacing: -0.5px; } .cta-btn-custom { padding: 14px 34px; font-size: 15px; font-weight: 800; box-shadow: 0 4px 15px rgba(0,0,0,0.15); } @@ -186,24 +232,20 @@ h1, h2, h3, h4, h5, h6 { color: var(--heading-color); font-weight: 800; line-hei .footer-brand-desc { font-size: 14px; color: rgba(255,255,255,0.8); line-height: 1.7; margin-bottom: 20px; } .footer-hours-box { display: flex; align-items: center; gap: 12px; background: rgba(255,255,255,0.06); padding: 12px 16px; border-radius: 10px; border: 1px solid rgba(255,255,255,0.1); } .hours-icon { font-size: 22px; } - .footer-contact-list { list-style: none; padding: 0; margin: 0; } .footer-contact-list li { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 15px; font-size: 14px; color: rgba(255,255,255,0.85); line-height: 1.6; } .footer-contact-list li a { color: rgba(255,255,255,0.9); } .footer-contact-list li a:hover { color: #f39c12; } .f-icon { font-size: 16px; flex-shrink: 0; margin-top: 2px; } - .footer-links-custom { list-style: none; padding: 0; margin: 0; } .footer-links-custom li { margin-bottom: 12px; } .footer-links-custom li a { color: rgba(255,255,255,0.82); font-size: 14px; transition: all 0.25s ease; display: inline-flex; align-items: center; gap: 8px; } -.footer-links-custom li a::before { content: '›'; font-size: 16px; color: var(--secondary-color); font-weight: bold; transition: transform 0.2s; } +.footer-links-custom li a::before { content: ' '; font-size: 16px; color: var(--secondary-color); font-weight: bold; transition: transform 0.2s; } .footer-links-custom li a:hover { color: #ffffff; padding-left: 5px; } .footer-links-custom li a:hover::before { transform: translateX(3px); color: #f39c12; } - .footer-social-icons { display: flex; gap: 10px; flex-wrap: wrap; } .social-btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: rgba(255,255,255,0.08); color: #ffffff !important; border: 1px solid rgba(255,255,255,0.15); transition: all 0.25s ease; } .social-btn:hover { background: var(--secondary-color); transform: translateY(-3px); box-shadow: 0 8px 18px rgba(0,0,0,0.25); border-color: transparent; } - .footer-bottom-bar { border-top: 1px solid rgba(255,255,255,0.08); padding: 22px 0; background: rgba(0,0,0,0.15); } .footer-bottom-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 15px; } .copyright-text { margin: 0; font-size: 13px; color: rgba(255,255,255,0.65); } @@ -214,7 +256,7 @@ h1, h2, h3, h4, h5, h6 { color: var(--heading-color); font-weight: 800; line-hei .sidebar-widget { padding: 25px; margin-bottom: 25px; } .sidebar-widget-title { font-size: 18px; font-weight: 800; color: var(--heading-color); margin-bottom: 18px; border-bottom: 2px solid var(--primary-color); padding-bottom: 8px; } -/* 10. TYPOGRAPHY KONTEN */ +/* 10. TYPOGRAPHY KONTEN & COMMENTS */ .entry-content { font-size: 16px; color: #334155; line-height: 1.85; } .entry-content p { margin-bottom: 22px; } .entry-content h2 { font-size: 26px; margin: 35px 0 15px; color: var(--heading-color); } @@ -223,6 +265,12 @@ h1, h2, h3, h4, h5, h6 { color: var(--heading-color); font-weight: 800; line-hei .entry-content li { margin-bottom: 8px; } .entry-content blockquote { margin: 30px 0; padding: 20px 25px; background: #f8fafc; border-left: 4px solid var(--primary-color); font-style: italic; color: #475569; border-radius: 0 8px 8px 0; } +.comments-area { margin-top: 40px; padding-top: 30px; border-top: 1px solid #e2e8f0; } +.comment-list { list-style: none; padding: 0; margin: 0 0 30px; } +.comment-list .comment { margin-bottom: 20px; padding: 18px; background: #f8fafc; border-radius: 10px; border: 1px solid #e2e8f0; } +.comment-author { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; } +.comment-author img.avatar { border-radius: 50%; } + /* 11. PAGINATION */ .pagination { margin-top: 45px; text-align: center; } .pagination .nav-links { display: inline-flex; gap: 8px; align-items: center; } @@ -230,7 +278,9 @@ h1, h2, h3, h4, h5, h6 { color: var(--heading-color); font-weight: 800; line-hei .pagination .page-numbers.current, .pagination .page-numbers:hover { background: var(--primary-color); color: #fff; border-color: var(--primary-color); } /* 12. RESPONSIVE MEDIA QUERIES */ -@media (max-width: 1024px) { .footer-grid-wrapper { grid-template-columns: repeat(2, 1fr); gap: 35px; } } +@media (max-width: 1024px) { + .footer-grid-wrapper { grid-template-columns: repeat(2, 1fr); gap: 35px; } +} @media (max-width: 992px) { .single-layout-wrapper { grid-template-columns: 1fr; } .program-grid, .milestone-grid, .news-grid { grid-template-columns: repeat(2, 1fr); } @@ -257,7 +307,6 @@ h1, h2, h3, h4, h5, h6 { color: var(--heading-color); font-weight: 800; line-hei .menu-toggle.active span:nth-child(1) { transform: translateY(8px) rotate(45deg); } .menu-toggle.active span:nth-child(2) { opacity: 0; } .menu-toggle.active span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); } - @media (max-width: 768px) { .menu-toggle { display: flex; } .main-navigation { @@ -364,22 +413,13 @@ h1, h2, h3, h4, h5, h6 { color: var(--heading-color); font-weight: 800; line-hei } /* 17. BULLETPROOF GOOGLE TRANSLATE BANNER SUPPRESSION */ -.goog-te-banner-frame, -.goog-te-banner-frame.skiptranslate, -iframe.goog-te-banner-frame, -.VIpgJd-ZVi9od-ORHb-OEVmcd, -#goog-gt-tt, -.goog-te-balloon-frame { +.goog-te-banner-frame, .goog-te-banner-frame.skiptranslate, iframe.goog-te-banner-frame, .VIpgJd-ZVi9od-ORHb-OEVmcd, #goog-gt-tt, .goog-te-balloon-frame { display: none !important; visibility: hidden !important; height: 0 !important; width: 0 !important; opacity: 0 !important; } -body { - top: 0px !important; - position: static !important; -} .goog-tooltip, .goog-tooltip:hover { display: none !important; } .goog-text-highlight { background-color: transparent !important; box-shadow: none !important; } font { background-color: transparent !important; box-shadow: none !important; } @@ -424,7 +464,6 @@ font { background-color: transparent !important; box-shadow: none !important; } .a11y-btn-danger { background: #fee2e2; border-color: #fca5a5; color: #991b1b; } .a11y-btn-danger:hover { background: #fecaca; color: #7f1d1d; } -/* KELAS STATUS AKSESIBILITAS YANG DITERAPKAN KE BODY */ body.a11y-font-lg { font-size: 18px !important; } body.a11y-font-lg h1 { font-size: 34px !important; } body.a11y-font-lg h2 { font-size: 28px !important; } @@ -433,13 +472,11 @@ body.a11y-font-xl { font-size: 20px !important; } body.a11y-font-xl h1 { font-size: 38px !important; } body.a11y-font-xl h2 { font-size: 32px !important; } body.a11y-font-xl h3 { font-size: 25px !important; } - body.a11y-high-contrast { filter: contrast(160%) !important; } body.a11y-grayscale { filter: grayscale(100%) !important; } body.a11y-high-contrast.a11y-grayscale { filter: grayscale(100%) contrast(160%) !important; } body.a11y-underline-links a { text-decoration: underline !important; text-underline-offset: 3px !important; } -/* STATE BUTTON AKSESIBILITAS SUARA AKTIF */ .a11y-btn.speaking { background: #10b981 !important; border-color: #059669 !important; @@ -466,7 +503,6 @@ body.a11y-underline-links a { text-decoration: underline !important; text-underl .edukarsa-breadcrumbs a:hover { text-decoration: underline; } .bc-sep { color: #cbd5e1; font-weight: bold; } .bc-current { color: var(--heading-color); font-weight: 600; } - .single-article-card { padding: 40px; margin-bottom: 30px; } .single-article-title { font-size: 32px; @@ -501,7 +537,6 @@ body.a11y-underline-links a { text-decoration: underline !important; text-underl font-style: italic; } -/* INTRA-POST PAGINATION () */ .intra-post-pagination { margin-top: 35px; padding-top: 20px; @@ -543,7 +578,6 @@ body.a11y-underline-links a { text-decoration: underline !important; text-underl color: #ffffff; } -/* FOOTER ARTIKEL & SHARE BAR */ .single-article-footer { margin-top: 35px; padding-top: 25px; @@ -566,7 +600,6 @@ body.a11y-underline-links a { text-decoration: underline !important; text-underl font-weight: 600; } .single-tags-list a:hover { background: var(--primary-color); color: #ffffff; } - .single-share-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .share-label { font-size: 13px; font-weight: 700; color: var(--heading-color); margin-right: 4px; } .share-btn { @@ -589,7 +622,6 @@ body.a11y-underline-links a { text-decoration: underline !important; text-underl .share-copy { background: #475569; color: #ffffff; } .share-copy:hover { background: #334155; } -/* INTER-POST NAVIGATION (SEBELUMNYA & SELANJUTNYA) */ .inter-post-nav { display: grid; grid-template-columns: 1fr 1fr; @@ -619,7 +651,7 @@ body.a11y-underline-links a { text-decoration: underline !important; text-underl .nav-box:hover .nav-post-title { color: var(--primary-color); } .text-right { text-align: right; } -/* 20. KOMPONEN SIDEBAR NATIVE TERINTEGRASI */ +/* 20. KOMPONEN SIDEBAR */ .sidebar-search-form { position: relative; } .sidebar-search-wrapper { display: flex; position: relative; } .sidebar-search-input { @@ -644,7 +676,6 @@ body.a11y-underline-links a { text-decoration: underline !important; text-underl cursor: pointer; padding: 6px; } - .sidebar-cta-box { background: linear-gradient(135deg, var(--primary-color), var(--heading-color)); color: #ffffff; @@ -664,7 +695,6 @@ body.a11y-underline-links a { text-decoration: underline !important; text-underl .sidebar-cta-title { font-size: 19px; font-weight: 800; color: #ffffff; margin-bottom: 10px; line-height: 1.35; } .sidebar-cta-desc { font-size: 13px; opacity: 0.9; margin-bottom: 20px; line-height: 1.6; } .sidebar-cta-btn { display: inline-block; padding: 10px 26px; font-size: 14px; font-weight: 800; } - .sidebar-recent-list { display: flex; flex-direction: column; gap: 16px; } .sidebar-recent-item { display: flex; gap: 14px; align-items: center; } .sidebar-recent-thumb { width: 68px; height: 68px; border-radius: 8px; overflow: hidden; flex-shrink: 0; } @@ -673,7 +703,6 @@ body.a11y-underline-links a { text-decoration: underline !important; text-underl .sidebar-recent-title { font-size: 14px; font-weight: 700; margin: 0; line-height: 1.4; } .sidebar-recent-title a { color: var(--heading-color); } .sidebar-recent-title a:hover { color: var(--primary-color); } - .sidebar-category-list { list-style: none; padding: 0; margin: 0; } .sidebar-category-list li { margin-bottom: 8px; } .sidebar-cat-link { @@ -706,173 +735,107 @@ body.a11y-underline-links a { text-decoration: underline !important; text-underl color: #ffffff; } -@media (max-width: 768px) { - .inter-post-nav { grid-template-columns: 1fr; } - .text-right { text-align: left; } - .single-article-card { padding: 25px 20px; } - .single-article-title { font-size: 24px; } -} - /* 21. SIDEBAR CUSTOM HTML BOX */ .sidebar-custom-html-box { padding: 25px; } .sidebar-html-rendered-content { font-size: 14px; line-height: 1.7; color: var(--text-color); } .sidebar-html-rendered-content iframe { width: 100% !important; border-radius: 8px; border: none; } .sidebar-html-rendered-content img { border-radius: 8px; margin: 10px 0; } -/* --------------------------------------------------------- - MODUL GALERI & FASILITAS (GRID + LIGHTBOX) ---------------------------------------------------------- */ +/* MODUL GALERI & FASILITAS */ .gallery-filters { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; } .gallery-filter-btn { - background: #ffffff; - border: 2px solid #e2e8f0; + background: #ffffff; + border: 2px solid #e2e8f0; color: var(--text-muted); - padding: 8px 22px; - border-radius: 50px; - font-weight: 700; + padding: 8px 22px; + border-radius: 50px; + font-weight: 700; font-size: 14px; - cursor: pointer; + cursor: pointer; transition: all 0.3s ease; } .gallery-filter-btn:hover, .gallery-filter-btn.active { - background: var(--primary-color); - border-color: var(--primary-color); + background: var(--primary-color); + border-color: var(--primary-color); color: #ffffff; box-shadow: 0 4px 12px rgba(11, 74, 142, 0.2); } - -.gallery-grid { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); - gap: 25px; -} - +.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 25px; } .gallery-item-card { - background: #ffffff; - border-radius: 14px; + background: #ffffff; + border-radius: 14px; overflow: hidden; - box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04); - cursor: pointer; + box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04); + cursor: pointer; transition: all 0.3s ease; border: 1px solid #f1f5f9; } -.gallery-item-card:hover { - transform: translateY(-6px); - box-shadow: 0 15px 35px rgba(11, 74, 142, 0.12); - border-color: var(--secondary-color); -} - -.gallery-img-wrapper { - position: relative; - aspect-ratio: 4/3; - overflow: hidden; - background: #f8fafc; -} -.gallery-img-wrapper img { - width: 100%; - height: 100%; - object-fit: cover; - transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94); -} -.gallery-item-card:hover .gallery-img-wrapper img { - transform: scale(1.08); -} - +.gallery-item-card:hover { transform: translateY(-6px); box-shadow: 0 15px 35px rgba(11, 74, 142, 0.12); border-color: var(--secondary-color); } +.gallery-img-wrapper { position: relative; aspect-ratio: 4/3; overflow: hidden; background: #f8fafc; } +.gallery-img-wrapper img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94); } +.gallery-item-card:hover .gallery-img-wrapper img { transform: scale(1.08); } .gallery-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; - background: linear-gradient(to bottom, rgba(11,74,142,0.2) 0%, rgba(11,74,142,0.8) 100%); + background: linear-gradient(to bottom, rgba(11,74,142,0.2) 0%, rgba(11,74,142,0.8) 100%); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.3s ease; } .gallery-item-card:hover .gallery-overlay { opacity: 1; } - -.gallery-zoom-icon { - font-size: 32px; color: #fff; - transform: translateY(20px); - transition: transform 0.3s ease; - filter: drop-shadow(0 4px 6px rgba(0,0,0,0.3)); -} +.gallery-zoom-icon { font-size: 32px; color: #fff; transform: translateY(20px); transition: transform 0.3s ease; filter: drop-shadow(0 4px 6px rgba(0,0,0,0.3)); } .gallery-item-card:hover .gallery-zoom-icon { transform: translateY(0); } - .gallery-item-info { padding: 22px 20px; } .gallery-item-info h4 { margin: 0 0 10px; font-size: 17px; font-weight: 800; color: var(--heading-color); line-height: 1.4; } -.gallery-cat-badge { +.gallery-cat-badge { display: inline-block; - font-size: 11px; font-weight: 800; - color: var(--secondary-color); - text-transform: uppercase; + font-size: 11px; font-weight: 800; + color: var(--secondary-color); + text-transform: uppercase; letter-spacing: 0.5px; - background: #e0f2fe; padding: 4px 12px; border-radius: 20px; + background: #e0f2fe; padding: 4px 12px; border-radius: 20px; } -/* NATIVE LIGHTBOX (ZOOM EFEK) */ +/* NATIVE LIGHTBOX */ .ek-lightbox { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(15, 23, 42, 0.96); z-index: 9999; display: flex; align-items: center; justify-content: center; - opacity: 0; visibility: hidden; transition: all 0.3s ease; + opacity: 0; visibility: hidden; transition: all 0.3s ease; backdrop-filter: blur(8px); } .ek-lightbox.show { opacity: 1; visibility: visible; } - -.ek-lb-close { - position: absolute; top: 25px; right: 35px; font-size: 45px; - color: rgba(255,255,255,0.6); cursor: pointer; line-height: 1; +.ek-lb-close { + position: absolute; top: 25px; right: 35px; font-size: 45px; + color: rgba(255,255,255,0.6); cursor: pointer; line-height: 1; transition: color 0.2s, transform 0.2s; z-index: 10; } .ek-lb-close:hover { color: #f59e0b; transform: scale(1.1); } - .ek-lb-content { max-width: 900px; width: 92%; max-height: 90vh; - display: flex; flex-direction: column; + display: flex; flex-direction: column; background: #ffffff; border-radius: 16px; overflow: hidden; transform: scale(0.95); transition: transform 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); } .ek-lightbox.show .ek-lb-content { transform: scale(1); } - -.ek-lb-img-container { - width: 100%; height: 60vh; background: #000; - display: flex; align-items: center; justify-content: center; -} -.ek-lb-img-container img { - width: 100%; height: 100%; object-fit: contain; -} - +.ek-lb-img-container { width: 100%; height: 60vh; background: #000; display: flex; align-items: center; justify-content: center; } +.ek-lb-img-container img { width: 100%; height: 100%; object-fit: contain; } .ek-lb-caption { padding: 25px 35px; text-align: center; } -.ek-lb-cat { - font-size: 12px; font-weight: 800; color: var(--secondary-color); - text-transform: uppercase; letter-spacing: 1px; display: inline-block; - margin-bottom: 8px; background: #f1f5f9; padding: 4px 14px; border-radius: 20px; -} +.ek-lb-cat { font-size: 12px; font-weight: 800; color: var(--secondary-color); text-transform: uppercase; letter-spacing: 1px; display: inline-block; margin-bottom: 8px; background: #f1f5f9; padding: 4px 14px; border-radius: 20px; } .ek-lb-caption h3 { margin: 0 0 12px; font-size: 24px; font-weight: 800; color: var(--heading-color); } .ek-lb-caption p { margin: 0; font-size: 15px; color: var(--text-color); line-height: 1.7; } - -/* Tombol Navigasi Lightbox */ .ek-lb-nav { position: absolute; top: 50%; transform: translateY(-50%); - background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.2); - color: #ffffff; width: 56px; height: 56px; border-radius: 50%; - font-size: 20px; cursor: pointer; transition: all 0.2s ease; + background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.2); + color: #ffffff; width: 56px; height: 56px; border-radius: 50%; + font-size: 20px; cursor: pointer; transition: all 0.2s ease; display: flex; align-items: center; justify-content: center; } .ek-lb-nav:hover { background: var(--primary-color); border-color: var(--primary-color); transform: translateY(-50%) scale(1.1); } .ek-lb-prev { left: 40px; } .ek-lb-next { right: 40px; } -@media (max-width: 768px) { - .ek-lb-nav { width: 44px; height: 44px; font-size: 16px; } - .ek-lb-prev { left: 15px; } - .ek-lb-next { right: 15px; } - .ek-lb-close { top: 15px; right: 20px; font-size: 35px; } - .ek-lb-img-container { height: 45vh; } - .ek-lb-caption { padding: 20px; } - .ek-lb-caption h3 { font-size: 20px; } - .gallery-grid { grid-template-columns: 1fr; } -} - -/* 22. FIX: HILANGKAN BULLET PADA SUB-MENU DROPDOWN */ -.nav-menu-custom .sub-menu, +/* FIX SUB-MENU DROPDOWN */ +.nav-menu-custom .sub-menu, .nav-menu-custom .sub-menu li { list-style: none !important; list-style-type: none !important; @@ -883,139 +846,51 @@ body.a11y-underline-links a { text-decoration: underline !important; text-underl } /* 23. NATIVE POP-UP FLYER MODAL */ -body.edukarsa-popup-open { - overflow: hidden; -} +body.edukarsa-popup-open { overflow: hidden; } .edukarsa-popup-overlay { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; + position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(15, 23, 42, 0.78); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); z-index: 99999; - display: flex; - align-items: center; - justify-content: center; - padding: 20px; - opacity: 0; - visibility: hidden; + display: flex; align-items: center; justify-content: center; + padding: 20px; opacity: 0; visibility: hidden; transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.3s ease; } -.edukarsa-popup-overlay.is-visible { - opacity: 1; - visibility: visible; -} +.edukarsa-popup-overlay.is-visible { opacity: 1; visibility: visible; } .edukarsa-popup-card { - position: relative; - background: #ffffff; - border-radius: 18px; - max-width: 520px; - width: 100%; - max-height: 90vh; - overflow-y: auto; - overflow-x: hidden; + position: relative; background: #ffffff; border-radius: 18px; + max-width: 520px; width: 100%; max-height: 90vh; + overflow-y: auto; overflow-x: hidden; box-shadow: 0 25px 60px -15px rgba(0, 0, 0, 0.4); transform: scale(0.92) translateY(15px); transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1); } -.edukarsa-popup-overlay.is-visible .edukarsa-popup-card { - transform: scale(1) translateY(0); -} +.edukarsa-popup-overlay.is-visible .edukarsa-popup-card { transform: scale(1) translateY(0); } .edukarsa-popup-close { - position: absolute; - top: 14px; - right: 14px; - width: 36px; - height: 36px; - border-radius: 50%; - background: rgba(15, 23, 42, 0.75); - color: #ffffff; - border: 2px solid #ffffff; - font-size: 24px; - line-height: 1; - display: flex; - align-items: center; - justify-content: center; - cursor: pointer; - z-index: 10; - transition: background 0.2s, transform 0.2s; -} -.edukarsa-popup-close:hover { - background: #e11d48; - transform: scale(1.1); -} -.edukarsa-popup-media { - width: 100%; - background: #0f172a; - display: block; - line-height: 0; -} -.edukarsa-popup-media img { - width: 100%; - height: auto; - max-height: 380px; - object-fit: contain; - display: block; - margin: 0 auto; -} -.edukarsa-popup-img-link { - display: block; - cursor: pointer; -} -.edukarsa-popup-details { - padding: 24px 28px; - text-align: center; - background: #ffffff; + position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; + border-radius: 50%; background: rgba(15, 23, 42, 0.75); color: #ffffff; + border: 2px solid #ffffff; font-size: 24px; line-height: 1; + display: flex; align-items: center; justify-content: center; + cursor: pointer; z-index: 10; transition: background 0.2s, transform 0.2s; } +.edukarsa-popup-close:hover { background: #e11d48; transform: scale(1.1); } +.edukarsa-popup-media { width: 100%; background: #0f172a; display: block; line-height: 0; } +.edukarsa-popup-media img { width: 100%; height: auto; max-height: 380px; object-fit: contain; display: block; margin: 0 auto; } +.edukarsa-popup-img-link { display: block; cursor: pointer; } +.edukarsa-popup-details { padding: 24px 28px; text-align: center; background: #ffffff; } .edukarsa-popup-badge { - display: inline-block; - padding: 4px 14px; - background: #e0f2fe; - color: var(--primary-color); - font-size: 11px; - font-weight: 800; - text-transform: uppercase; - letter-spacing: 0.8px; - border-radius: 20px; + display: inline-block; padding: 4px 14px; background: #e0f2fe; + color: var(--primary-color); font-size: 11px; font-weight: 800; + text-transform: uppercase; letter-spacing: 0.8px; border-radius: 20px; margin-bottom: 10px; } -.edukarsa-popup-heading { - font-size: 20px; - font-weight: 800; - color: var(--heading-color); - margin: 0 0 10px; - line-height: 1.35; -} -.edukarsa-popup-desc { - font-size: 14px; - color: var(--text-color); - line-height: 1.6; - margin: 0 0 20px; -} -.edukarsa-popup-action { - margin-top: 15px; -} +.edukarsa-popup-heading { font-size: 20px; font-weight: 800; color: var(--heading-color); margin: 0 0 10px; line-height: 1.35; } +.edukarsa-popup-desc { font-size: 14px; color: var(--text-color); line-height: 1.6; margin: 0 0 20px; } +.edukarsa-popup-action { margin-top: 15px; } .edukarsa-popup-btn { - display: inline-block; - padding: 12px 32px; - font-size: 15px; - font-weight: 800; - border-radius: 50px; + display: inline-block; padding: 12px 32px; font-size: 15px; + font-weight: 800; border-radius: 50px; box-shadow: 0 6px 18px rgba(11, 74, 142, 0.25); } -.edukarsa-popup-btn:hover { - transform: translateY(-2px); - box-shadow: 0 10px 25px rgba(11, 74, 142, 0.35); -} - -@media (max-width: 600px) { - .edukarsa-popup-card { max-width: 95%; border-radius: 14px; } - .edukarsa-popup-details { padding: 18px 16px; } - .edukarsa-popup-heading { font-size: 18px; } - .edukarsa-popup-desc { font-size: 13px; } - .edukarsa-popup-btn { padding: 10px 24px; font-size: 14px; } - .edukarsa-popup-close { top: 10px; right: 10px; width: 32px; height: 32px; font-size: 20px; } -} +.edukarsa-popup-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 25px rgba(11, 74, 142, 0.35); }