From 70d42d160372f3982333619112d1aea4e78da30e Mon Sep 17 00:00:00 2001
From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
Date: Tue, 17 Oct 2023 18:10:24 +0300
Subject: [PATCH 1/9] Simple plugin setup

---
 .gitignore                                    |  8 ++--
 .../plugins/academy-africa/academy-africa.php | 37 +++++++++++++++++++
 .../widgets/academy-africa-hero.php           | 31 ++++++++++++++++
 3 files changed, 73 insertions(+), 3 deletions(-)
 create mode 100644 wp-content/plugins/academy-africa/academy-africa.php
 create mode 100644 wp-content/plugins/academy-africa/widgets/academy-africa-hero.php

diff --git a/.gitignore b/.gitignore
index 3f9c8036..7c5efc32 100644
--- a/.gitignore
+++ b/.gitignore
@@ -62,10 +62,7 @@ wp-content/mu-plugins/wpe-wp-sign-on-plugin*
 /wp-admin
 /wp-includes
 /wp-content/themes/*
-!/wp-content/themes/academyAfrica
-!/wp-content/themes/hello-elementor
 /wp-content/plugins/*
-!/wp-content/plugins/index.php
 /wp-content/mu-plugins
 .htaccess
 apple-touch-icon-precomposed.png
@@ -111,3 +108,8 @@ wordpress
 *.avi
 
 .env
+
+!/wp-content/themes/academyAfrica
+!/wp-content/themes/hello-elementor
+!/wp-content/plugins/index.php
+!/wp-content/plugins/academy-africa
diff --git a/wp-content/plugins/academy-africa/academy-africa.php b/wp-content/plugins/academy-africa/academy-africa.php
new file mode 100644
index 00000000..15921c4f
--- /dev/null
+++ b/wp-content/plugins/academy-africa/academy-africa.php
@@ -0,0 +1,37 @@
+<?php
+/**
+ * Plugin Name: academyAfrica Elementor Addon
+ * Description: Academy Africa Website Elementor Addon
+ * Version:     1.0.0
+ * Author:      Code for Africa
+ * Author URI:  github.com/CodeForAfrica
+ * Text Domain: academy-africa
+ */
+
+
+if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
+
+/**
+ * Main Elementor Test Extension Class
+ *
+ * The main class that initiates and runs the plugin.
+ *
+ * @since 1.0.0
+ */
+
+
+// function academy_africa_scripts() {
+//     wp_enqueue_style( 'academy-africa-style', plugins_url( '/assets/css/academy-africa.css', __FILE__ ) );
+//     wp_enqueue_script( 'academy-africa-script', plugins_url( '/assets/js/academy-africa.js', __FILE__ ), array('jquery'), '1.0.0', true );
+// }
+
+// add_action( 'wp_enqueue_scripts', 'academy_africa_scripts' );
+
+function register_academy_africa_widget( $widgets_manager ) {
+
+    require_once( __DIR__ . '/widgets/academy-africa-hero.php' );
+
+    $widgets_manager->register( new \Academy_Africa_Hero() );
+
+}
+add_action( 'elementor/widgets/register', 'register_academy_africa_widget' );
\ No newline at end of file
diff --git a/wp-content/plugins/academy-africa/widgets/academy-africa-hero.php b/wp-content/plugins/academy-africa/widgets/academy-africa-hero.php
new file mode 100644
index 00000000..a60eb68d
--- /dev/null
+++ b/wp-content/plugins/academy-africa/widgets/academy-africa-hero.php
@@ -0,0 +1,31 @@
+<?php
+class Academy_Africa_Hero extends \Elementor\Widget_Base {
+
+	public function get_name() {
+		return 'academy_africa_hero';
+	}
+
+	public function get_title() {
+		return esc_html__( 'Hero Section', 'elementor-addon' );
+	}
+
+	public function get_icon() {
+		return 'eicon-code';
+	}
+
+	public function get_categories() {
+		return [ 'basic' ];
+	}
+
+	public function get_keywords() {
+		return [ 'hello', 'world' ];
+	}
+
+	protected function render() {
+		?>
+
+		<p> Hello World </p>
+
+		<?php
+	}
+}
\ No newline at end of file

From 44d2573f579883872a91bcec0dc18e1ddac6dac7 Mon Sep 17 00:00:00 2001
From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
Date: Tue, 17 Oct 2023 19:02:57 +0300
Subject: [PATCH 2/9] Modularize plugin

---
 .../plugins/academy-africa/academy-africa.php |  19 +-
 .../academy-africa/includes/plugin.php        | 219 ++++++++++++++++++
 .../widgets/hero.php}                         |   0
 3 files changed, 226 insertions(+), 12 deletions(-)
 create mode 100644 wp-content/plugins/academy-africa/includes/plugin.php
 rename wp-content/plugins/academy-africa/{widgets/academy-africa-hero.php => includes/widgets/hero.php} (100%)

diff --git a/wp-content/plugins/academy-africa/academy-africa.php b/wp-content/plugins/academy-africa/academy-africa.php
index 15921c4f..d06afb65 100644
--- a/wp-content/plugins/academy-africa/academy-africa.php
+++ b/wp-content/plugins/academy-africa/academy-africa.php
@@ -1,7 +1,7 @@
 <?php
 /**
- * Plugin Name: academyAfrica Elementor Addon
- * Description: Academy Africa Website Elementor Addon
+ * Plugin Name: Academy Africa
+ * Description: This plugin provides custom widgets for the Academy Africa website.
  * Version:     1.0.0
  * Author:      Code for Africa
  * Author URI:  github.com/CodeForAfrica
@@ -20,18 +20,13 @@
  */
 
 
-// function academy_africa_scripts() {
-//     wp_enqueue_style( 'academy-africa-style', plugins_url( '/assets/css/academy-africa.css', __FILE__ ) );
-//     wp_enqueue_script( 'academy-africa-script', plugins_url( '/assets/js/academy-africa.js', __FILE__ ), array('jquery'), '1.0.0', true );
-// }
 
-// add_action( 'wp_enqueue_scripts', 'academy_africa_scripts' );
+function academy_africa_plugin( $widgets_manager ) {
 
-function register_academy_africa_widget( $widgets_manager ) {
+    require_once( __DIR__ . '/includes/plugin.php' );
 
-    require_once( __DIR__ . '/widgets/academy-africa-hero.php' );
-
-    $widgets_manager->register( new \Academy_Africa_Hero() );
+    // Run the plugin
+    \Academy_Africa\Plugin::instance();
 
 }
-add_action( 'elementor/widgets/register', 'register_academy_africa_widget' );
\ No newline at end of file
+add_action( 'plugins_loaded', 'academy_africa_plugin' );
\ No newline at end of file
diff --git a/wp-content/plugins/academy-africa/includes/plugin.php b/wp-content/plugins/academy-africa/includes/plugin.php
new file mode 100644
index 00000000..c0ef9bc9
--- /dev/null
+++ b/wp-content/plugins/academy-africa/includes/plugin.php
@@ -0,0 +1,219 @@
+<?php
+
+namespace Academy_Africa;
+
+if (!defined('ABSPATH')) exit; // Exit if accessed directly
+
+
+final class Plugin
+{
+
+    /**
+     * Plugin Version
+     *
+     * @since 1.0.0
+     *
+     * @var string The plugin version.
+     */
+    const VERSION = '1.0.0';
+
+    /**
+     * Minimum Elementor Version
+     *
+     * @since 1.0.0
+     *
+     * @var string Minimum Elementor version required to run the plugin.
+     */
+    const MINIMUM_ELEMENTOR_VERSION = '3.15.3';
+
+    /**
+     * Minimum PHP Version
+     *
+     * @since 1.0.0
+     *
+     * @var string Minimum PHP version required to run the plugin.
+     */
+    const MINIMUM_PHP_VERSION = '8.0';
+
+    /**
+     * Instance
+     *
+     * @since 1.0.0
+     *
+     * @access private
+     * @static
+     *
+     * @var Plugin The single instance of the class.
+     */
+    private static $_instance = null;
+
+    /**
+     * Instance
+     *
+     * Ensures only one instance of the class is loaded or can be loaded.
+     *
+     * @since 1.0.0
+     *
+     * @access public
+     * @static
+     *
+     * @return Plugin An instance of the class.
+     */
+    public static function instance()
+    {
+
+        if (is_null(self::$_instance)) {
+            self::$_instance = new self();
+        }
+
+        return self::$_instance;
+    }
+
+    /**
+     * Constructor
+     *
+     * Perform some compatibility checks to make sure basic requirements are meet.
+     * If all compatibility checks pass, initiali
+     * @since 1.0.0
+     *
+     * @access public
+     */
+    public function __construct()
+    {
+        if ($this->is_compatible()) {
+            add_action('elementor/init', [$this, 'init']);
+        }
+    }
+
+    /**
+     * Compatibility Check
+     * 
+     * Checks if the installed version of Elementor meets the plugin's minimum requirement.
+     * 
+     * @since 1.0.0
+     * @access public
+     */
+
+    public function is_compatible()
+    {
+        // Check if Elementor installed and activated
+        if (!did_action('elementor/loaded')) {
+            add_action('admin_notices', [$this, 'admin_notice_missing_main_plugin']);
+            return false;
+        }
+
+        // Check if the installed version of Elementor meets the plugin's minimum requirement.
+        if (!version_compare(ELEMENTOR_VERSION, self::MINIMUM_ELEMENTOR_VERSION, '>=')) {
+            add_action('admin_notices', [$this, 'admin_notice_minimum_elementor_version']);
+            return false;
+        }
+
+        // Check if the installed version of PHP meets the plugin's minimum requirement.
+        if (!version_compare(PHP_VERSION, self::MINIMUM_PHP_VERSION, '>=')) {
+            add_action('admin_notices', [$this, 'admin_notice_minimum_php_version']);
+            return false;
+        }
+
+        return true;
+    }
+
+    /**
+     * Admin notice
+     * 
+     * Warning when the site doesn't have Elementor installed or activated.
+     * 
+     * @since 1.0.0
+     * @access public
+     */
+    public function admin_notice_missing_main_plugin()
+    {
+        if (isset($_GET['activate'])) unset($_GET['activate']);
+
+        $message = sprintf(
+            /* translators: 1: Plugin name 2: Elementor */
+            esc_html__('"%1$s" requires "%2$s" to be installed and activated.', 'academy-africa'),
+            '<strong>' . esc_html__('academyAfrica Elementor Addon', 'academy-africa') . '</strong>',
+            '<strong>' . esc_html__('Elementor', 'academy-africa') . '</strong>'
+        );
+
+        printf('<div class="notice notice-warning is-dismissible"><p>%1$s</p></div>', $message);
+    }
+
+    /**
+     * Admin notice
+     * 
+     * Warning when the site doesn't have a minimum required Elementor version.
+     * 
+     * @since 1.0.0
+     * @access public
+     */
+    public function admin_notice_minimum_elementor_version()
+    {
+        if (isset($_GET['activate'])) unset($_GET['activate']);
+
+        $message = sprintf(
+            /* translators: 1: Plugin name 2: Elementor 3: Required Elementor version */
+            esc_html__('"%1$s" requires "%2$s" version %3$s or greater.', 'academy-africa'),
+            '<strong>' . esc_html__('academyAfrica Elementor Addon', 'academy-africa') . '</strong>',
+            '<strong>' . esc_html__('Elementor', 'academy-africa') . '</strong>',
+            self::MINIMUM_ELEMENTOR_VERSION
+        );
+
+        printf('<div class="notice notice-warning is-dismissible"><p>%1$s</p></div>', $message);
+    }
+
+    /**
+     * Admin notice
+     * 
+     * Warning when the site doesn't have a minimum required PHP version.
+     * 
+     * @since 1.0.0
+     * @access public
+     */
+    public function admin_notice_minimum_php_version()
+    {
+        if (isset($_GET['activate'])) unset($_GET['activate']);
+
+        $message = sprintf(
+            /* translators: 1: Plugin name 2: PHP 3: Required PHP version */
+            esc_html__('"%1$s" requires "%2$s" version %3$s or greater.', 'academy-africa'),
+            '<strong>' . esc_html__('academyAfrica Elementor Addon', 'academy-africa') . '</strong>',
+            '<strong>' . esc_html__('PHP', 'academy-africa') . '</strong>',
+            self::MINIMUM_PHP_VERSION
+        );
+
+        printf('<div class="notice notice-warning is-dismissible"><p>%1$s</p></div>', $message);
+    }
+
+    /**
+     * Initialize the plugin
+     * 
+     * Load the plugin only after Elementor (and other plugins) are loaded.
+     * 
+     * @since 1.0.0
+     * @access public
+     */
+
+    public function init()
+    {
+
+        add_action('elementor/widgets/register', [$this, 'register_widgets']);
+    }
+
+    /**
+     * Include Widgets files
+     * 
+     * Load widgets files
+     * 
+     * @since 1.0.0
+     * @access private
+     */
+    public function register_widgets()
+    {
+        // Include Widget files
+        require_once(__DIR__ . '/widgets/hero.php');
+
+        // Register widget
+        $widgets_manager->register(new \Academy_Africa_Hero());
+    }
+}
diff --git a/wp-content/plugins/academy-africa/widgets/academy-africa-hero.php b/wp-content/plugins/academy-africa/includes/widgets/hero.php
similarity index 100%
rename from wp-content/plugins/academy-africa/widgets/academy-africa-hero.php
rename to wp-content/plugins/academy-africa/includes/widgets/hero.php

From b780e82cde4d6743c29ff5cfc59747056373fa5a Mon Sep 17 00:00:00 2001
From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
Date: Tue, 17 Oct 2023 19:54:08 +0300
Subject: [PATCH 3/9] Fix plugin register

---
 wp-content/plugins/academy-africa/includes/plugin.php | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/wp-content/plugins/academy-africa/includes/plugin.php b/wp-content/plugins/academy-africa/includes/plugin.php
index c0ef9bc9..4cbb40da 100644
--- a/wp-content/plugins/academy-africa/includes/plugin.php
+++ b/wp-content/plugins/academy-africa/includes/plugin.php
@@ -208,12 +208,12 @@ public function init()
      * @since 1.0.0
      * @access private
      */
-    public function register_widgets()
+    public function register_widgets($widgets_manager)
     {
         // Include Widget files
         require_once(__DIR__ . '/widgets/hero.php');
 
         // Register widget
-        $widgets_manager->register(new \Academy_Africa_Hero());
+        $widgets_manager->register( new \Academy_Africa_Hero() );
     }
 }

From 8d311731f8c355f080d00114a3c7986ec8fe2a3b Mon Sep 17 00:00:00 2001
From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
Date: Wed, 18 Oct 2023 14:42:33 +0300
Subject: [PATCH 4/9] Academy plugin assets

Signed-off-by: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
---
 .gitignore                                    |  1 +
 .../plugins/academy-africa/academy-africa.php | 22 ++++++--
 .../includes/assets/css/academy-africa.css    | 56 +++++++++++++++++++
 .../includes/assets/css/header.css            | 12 ++++
 .../includes/assets/css/style.css             |  9 +++
 .../academy-africa/includes/plugin.php        | 25 ++++++++-
 .../includes/widgets/header.php               | 44 +++++++++++++++
 .../academy-africa/includes/widgets/hero.php  | 33 ++++++-----
 8 files changed, 183 insertions(+), 19 deletions(-)
 create mode 100644 wp-content/plugins/academy-africa/includes/assets/css/academy-africa.css
 create mode 100644 wp-content/plugins/academy-africa/includes/assets/css/header.css
 create mode 100644 wp-content/plugins/academy-africa/includes/assets/css/style.css
 create mode 100644 wp-content/plugins/academy-africa/includes/widgets/header.php

diff --git a/.gitignore b/.gitignore
index 7c5efc32..d9ebf3d4 100644
--- a/.gitignore
+++ b/.gitignore
@@ -71,6 +71,7 @@ favicon.ico
 wpe-deploy-status-academyafrica
 robots.txt
 wordpress
+node_modules
 
 # large/disallowed file types
 # a CDN should be used for these
diff --git a/wp-content/plugins/academy-africa/academy-africa.php b/wp-content/plugins/academy-africa/academy-africa.php
index d06afb65..52692743 100644
--- a/wp-content/plugins/academy-africa/academy-africa.php
+++ b/wp-content/plugins/academy-africa/academy-africa.php
@@ -1,4 +1,5 @@
 <?php
+
 /**
  * Plugin Name: Academy Africa
  * Description: This plugin provides custom widgets for the Academy Africa website.
@@ -9,7 +10,18 @@
  */
 
 
-if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
+if (!defined('ABSPATH')) exit; // Exit if accessed directly
+
+
+// Define Academy Africa Plugin Constants
+
+if (!defined('ACADEMY_AFRICA_PLUGIN_VERSION')) {
+    define('ACADEMY_AFRICA_PLUGIN_VERSION', '1.0.0');
+}
+
+if (!defined('ACADEMY_AFRICA_PLUGIN_DIR')) {
+    define('ACADEMY_AFRICA_PLUGIN_DIR', dirname(__FILE__));
+}
 
 /**
  * Main Elementor Test Extension Class
@@ -21,12 +33,12 @@
 
 
 
-function academy_africa_plugin( $widgets_manager ) {
+function academy_africa_plugin($widgets_manager)
+{
 
-    require_once( __DIR__ . '/includes/plugin.php' );
+    require_once(__DIR__ . '/includes/plugin.php');
 
     // Run the plugin
     \Academy_Africa\Plugin::instance();
-
 }
-add_action( 'plugins_loaded', 'academy_africa_plugin' );
\ No newline at end of file
+add_action('plugins_loaded', 'academy_africa_plugin');
diff --git a/wp-content/plugins/academy-africa/includes/assets/css/academy-africa.css b/wp-content/plugins/academy-africa/includes/assets/css/academy-africa.css
new file mode 100644
index 00000000..35b2b53d
--- /dev/null
+++ b/wp-content/plugins/academy-africa/includes/assets/css/academy-africa.css
@@ -0,0 +1,56 @@
+:root {
+    --color-primary: #1020E1;
+    --color-secondary: #ED1C24;
+    --color-text: #8C8FA5;
+    --color-accent: #10B981;
+    --color-primary-50: #EFF0FD;
+    --color-primary-100: #E0E2FC;
+    --color-primary-200: #B1B7F7;
+    --color-primary-300: #737FF2;
+    --color-primary-400: #4556EE;
+    --color-primary-500: #1020E1;
+    --color-primary-600: #1022A6;
+    --color-primary-700: #0C1A81;
+    --color-primary-800: #08125C;
+    --color-primary-900: #040A37;
+    --color-neutral-50: #F7F9FD;
+    --color-8b64181: #E2E4EB;
+    --color-b2ba20c: #CCCFDA;
+    --color-db403fc: #B7BAC8;
+    --color-a7754b9: #A1A5B7;
+    --color-5e46824: #8C8FA5;
+    --color-bc80d88: #767A94;
+    --color-2489758: #616582;
+    --color-e97dfee: #4B5071;
+    --color-cce4f80: #4B5071;
+    --color-2d33f45: #FEECED;
+    --color-b96808b: #FBD9DB;
+    --color-e4a3aae: #F8B3B7;
+    --color-e7f2917: #F48E93;
+    --color-7022a8e: #EF565E;
+    --color-712831c: #ED1C24;
+    --color-225ba24: #B6131E;
+    --color-06c638a: #8D0E16;
+    --color-1a005e7: #51070C;
+    --color-f901dbc: #3C0609;
+    --color-899f28d: #ECFDF5;
+    --color-e0ac9d2: #D1FAE5;
+    --color-c04c0d5: #A7F3D0;
+    --color-9f72177: #6EE7B7;
+    --color-e41d497: #34D399;
+    --color-0212c0f: #10B981;
+    --color-1b71ddf: #059669;
+    --color-f51a01d: #047857;
+    --color-ba4996a: #065F46;
+    --color-531d123: #064E3B;
+    --color-d4bf333: #FFFBEB;
+    --color-1668ab7: #FEF3C7;
+    --color-4d4d031: #FDE68A;
+    --color-587e120: #FCD34D;
+    --color-d147518: #FBBF24;
+    --color-2993394: #F59E0B;
+    --color-3ef6ed8: #D97706;
+    --color-ded6d99: #B45309;
+    --color-909faee: #92400E;
+    --color-d6a3d53: #78350F;
+}
diff --git a/wp-content/plugins/academy-africa/includes/assets/css/header.css b/wp-content/plugins/academy-africa/includes/assets/css/header.css
new file mode 100644
index 00000000..353f3c74
--- /dev/null
+++ b/wp-content/plugins/academy-africa/includes/assets/css/header.css
@@ -0,0 +1,12 @@
+.academy-africa-header {
+    width: 100vw;
+    background-color: var(--color-primary);
+    height: 200px;
+}
+
+.academy-africa-header h1 {
+    color: var(--color-neutral50);
+    text-align: center;
+    padding-top: 50px;
+    font-size: large;
+}
\ No newline at end of file
diff --git a/wp-content/plugins/academy-africa/includes/assets/css/style.css b/wp-content/plugins/academy-africa/includes/assets/css/style.css
new file mode 100644
index 00000000..0fb49f8b
--- /dev/null
+++ b/wp-content/plugins/academy-africa/includes/assets/css/style.css
@@ -0,0 +1,9 @@
+body {
+    background-color: #000;
+    color: #fff;
+    font-family: sans-serif;
+    font-size: 16px;
+    line-height: 1.5;
+    margin: 0;
+    padding: 0;
+}
\ No newline at end of file
diff --git a/wp-content/plugins/academy-africa/includes/plugin.php b/wp-content/plugins/academy-africa/includes/plugin.php
index 4cbb40da..3519b0fd 100644
--- a/wp-content/plugins/academy-africa/includes/plugin.php
+++ b/wp-content/plugins/academy-africa/includes/plugin.php
@@ -198,6 +198,7 @@ public function init()
     {
 
         add_action('elementor/widgets/register', [$this, 'register_widgets']);
+        add_action('elementor/frontend/after_enqueue_styles', [$this, 'register_widget_styles']);
     }
 
     /**
@@ -212,8 +213,30 @@ public function register_widgets($widgets_manager)
     {
         // Include Widget files
         require_once(__DIR__ . '/widgets/hero.php');
+        require_once(__DIR__ . '/widgets/header.php');
 
         // Register widget
-        $widgets_manager->register( new \Academy_Africa_Hero() );
+        $widgets_manager->register(new \Academy_Africa_Hero());
+        $widgets_manager->register(new \Academy_Africa_Header());
+    }
+
+    public function register_widget_styles()
+    {
+        wp_enqueue_style(
+            'academy-africa',
+            plugins_url('assets/css/academy-africa.css', __FILE__),
+            [],
+            [],
+            filemtime(plugin_dir_path(__FILE__) . 'assets/css/academy-africa.css.css')
+        );
+
+        wp_enqueue_style(
+            'academy-africa-header',
+            plugins_url('assets/css/header.css', __FILE__),
+            [
+                'academy-africa'
+            ],
+            filemtime(plugin_dir_path(__FILE__) . 'assets/css/header.css')
+        );
     }
 }
diff --git a/wp-content/plugins/academy-africa/includes/widgets/header.php b/wp-content/plugins/academy-africa/includes/widgets/header.php
new file mode 100644
index 00000000..f6a2fe6b
--- /dev/null
+++ b/wp-content/plugins/academy-africa/includes/widgets/header.php
@@ -0,0 +1,44 @@
+<?php
+
+class Academy_Africa_Header extends \Elementor\Widget_Base
+{
+    public function get_style_depends()
+    {
+        return ['academy-africa-header'];
+    }
+
+    public function get_name()
+    {
+        return 'academy_africa_header';
+    }
+
+    public function get_title()
+    {
+        return esc_html__('Header Section', 'elementor-addon');
+    }
+
+    public function get_icon()
+    {
+        return 'eicon-code';
+    }
+
+    public function get_categories()
+    {
+        return ['basic'];
+    }
+
+    public function get_keywords()
+    {
+        return ['header', 'navigation'];
+    }
+
+    protected function render()
+    {
+?>
+        <div class="academy-africa-header">
+            <h1 class="title">Header</h1>
+        </div>
+
+<?php
+    }
+}
diff --git a/wp-content/plugins/academy-africa/includes/widgets/hero.php b/wp-content/plugins/academy-africa/includes/widgets/hero.php
index a60eb68d..0581fe1f 100644
--- a/wp-content/plugins/academy-africa/includes/widgets/hero.php
+++ b/wp-content/plugins/academy-africa/includes/widgets/hero.php
@@ -1,31 +1,38 @@
 <?php
-class Academy_Africa_Hero extends \Elementor\Widget_Base {
+class Academy_Africa_Hero extends \Elementor\Widget_Base
+{
 
-	public function get_name() {
+	public function get_name()
+	{
 		return 'academy_africa_hero';
 	}
 
-	public function get_title() {
-		return esc_html__( 'Hero Section', 'elementor-addon' );
+	public function get_title()
+	{
+		return esc_html__('Hero Section', 'elementor-addon');
 	}
 
-	public function get_icon() {
+	public function get_icon()
+	{
 		return 'eicon-code';
 	}
 
-	public function get_categories() {
-		return [ 'basic' ];
+	public function get_categories()
+	{
+		return ['basic'];
 	}
 
-	public function get_keywords() {
-		return [ 'hello', 'world' ];
+	public function get_keywords()
+	{
+		return ['hello', 'world'];
 	}
 
-	protected function render() {
-		?>
+	protected function render()
+	{
+?>
 
 		<p> Hello World </p>
 
-		<?php
+<?php
 	}
-}
\ No newline at end of file
+}

From 97e998c29e96e70b73088896977c35c006adc89b Mon Sep 17 00:00:00 2001
From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
Date: Wed, 18 Oct 2023 16:13:41 +0300
Subject: [PATCH 5/9] basic nav

Signed-off-by: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
---
 .../includes/assets/css/header.css            | 176 +++++++++++++++++-
 .../academy-africa/includes/plugin.php        |  17 ++
 .../includes/widgets/header.php               |  56 +++++-
 .../academy-africa/includes/widgets/hero.php  |   2 +-
 4 files changed, 237 insertions(+), 14 deletions(-)

diff --git a/wp-content/plugins/academy-africa/includes/assets/css/header.css b/wp-content/plugins/academy-africa/includes/assets/css/header.css
index 353f3c74..4738c78d 100644
--- a/wp-content/plugins/academy-africa/includes/assets/css/header.css
+++ b/wp-content/plugins/academy-africa/includes/assets/css/header.css
@@ -1,12 +1,170 @@
-.academy-africa-header {
-    width: 100vw;
-    background-color: var(--color-primary);
-    height: 200px;
+.nav {
+    display: flex;
+    width: 1440px;
+    height: 92px;
+    padding: 20px 40px;
+    justify-content: center;
+    align-items: center;
+    gap: 58px;
+    flex-shrink: 0;
+    background: #0C1A81;
 }
 
-.academy-africa-header h1 {
-    color: var(--color-neutral50);
-    text-align: center;
-    padding-top: 50px;
-    font-size: large;
+.nav .logo-section {
+    display: flex;
+    align-items: center;
+    gap: 20px;
+}
+
+.nav .logo-section .logo {
+    width: 52px;
+    height: 52px;
+}
+
+.nav .logo-section .page-title {
+    color: #FFFFFF;
+    font-family: Open Sans;
+    font-size: 18px;
+    font-style: normal;
+    font-weight: 600;
+    line-height: 28px;
+}
+
+.navigation-section {
+    display: flex;
+    width: 1032px;
+    min-width: 880px;
+    max-width: 1032px;
+    justify-content: flex-end;
+    align-items: center;
+    gap: 100px;
+    flex-shrink: 0;
+}
+
+.navigation-section .search-bar {
+    display: flex;
+    align-items: center;
+    flex: 1 0 0;
+}
+
+.navigation-section .search-bar .search-input {
+    display: flex;
+    padding: 0px 9px;
+    align-items: flex-start;
+    gap: 10px;
+    flex: 1 0 0;
+    align-self: stretch;
+    border: none;
+    outline: none;
+}
+
+.navigation-section .search-bar .search-input::placeholder {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    flex: 1 0 0;
+    align-self: stretch;
+    color: var(#767A94, #767A94);
+    font-family: Open Sans;
+    font-size: 14px;
+    font-style: italic;
+    font-weight: 400;
+    line-height: 18px;
+}
+
+.navigation-section .search-bar .search-button {
+    display: flex;
+    padding: 12px 16px;
+    justify-content: center;
+    align-items: center;
+    gap: 8px;
+    border: none;
+    background: var(#EFF0FD, #EFF0FD);
+}
+
+.navigation-section .search-bar .search-button img {
+    width: 16px;
+    height: 16px;
+}
+
+.navigation-section .navigation-links {
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+    gap: 10px;
+    height: 43px;
+    overflow: hidden;
+}
+
+.navigation-section .navigation-links a {
+    text-decoration: none;
+}
+
+.navigation-section .navigation-links .nav-link {
+    display: flex;
+    padding: 10px;
+    justify-content: center;
+    align-items: center;
+    gap: 6px;
+    background: #0C1A81;
+    text-decoration: none;
+}
+
+.navigation-section .navigation-links .nav-link .nav-link-text {
+    color: #F7F9FD;
+    font-family: Open Sans;
+    font-size: 18px;
+    font-style: normal;
+    font-weight: 600;
+    line-height: 21.6px;
+}
+
+.navigation-section .navigation-links .nav-link .arrow-down {
+    width: 16px;
+    height: 16px;
+    color: #fff;
+}
+
+.navigation-section .navigation-links .nav-link.login-button {
+    display: flex;
+    padding: 12px 16px;
+    justify-content: center;
+    align-items: center;
+    gap: 8px;
+    background: #EFF0FD;
+}
+
+.navigation-section .navigation-links .nav-link.login-button .nav-link-text {
+    color: #0C1A81;
+    font-family: Open Sans;
+    font-size: 16px;
+    font-style: normal;
+    font-weight: 800;
+    line-height: 19px;
+    letter-spacing: 1.6px;
+    text-transform: uppercase;
+}
+
+.navigation-section .navigation-links .nav-link.lang-button {
+    display: flex;
+    max-height: 42px;
+    padding: 10px;
+    justify-content: center;
+    align-items: center;
+    gap: 6px;
+    background: #0C1A81;
+}
+
+.navigation-section .navigation-links .nav-link.lang-button .language-icon {
+    width: 24px;
+    height: 24px;
+}
+
+.navigation-section .navigation-links .nav-link.lang-button .arrow-down {
+    width: 16px;
+    height: 16px;
+}
+
+.navigation-section .navigation-links .nav-link.lang-button .icon {
+    color: #fff;
 }
\ No newline at end of file
diff --git a/wp-content/plugins/academy-africa/includes/plugin.php b/wp-content/plugins/academy-africa/includes/plugin.php
index 3519b0fd..d863f44b 100644
--- a/wp-content/plugins/academy-africa/includes/plugin.php
+++ b/wp-content/plugins/academy-africa/includes/plugin.php
@@ -199,6 +199,7 @@ public function init()
 
         add_action('elementor/widgets/register', [$this, 'register_widgets']);
         add_action('elementor/frontend/after_enqueue_styles', [$this, 'register_widget_styles']);
+        add_action('elementor/elements/categories_registered', [$this, 'add_elementor_widget_categories']);
     }
 
     /**
@@ -239,4 +240,20 @@ public function register_widget_styles()
             filemtime(plugin_dir_path(__FILE__) . 'assets/css/header.css')
         );
     }
+
+    /**
+     * Add custom category
+     * 
+     * @since 1.0.0
+     * @access public
+     */
+    public function add_elementor_widget_categories($elements_manager){
+        $elements_manager->add_category(
+            'academy-africa',
+            [
+                'title' => __('Academy Africa', 'academy-africa'),
+                'icon' => 'fa fa-plug',
+            ]
+        );
+    }
 }
diff --git a/wp-content/plugins/academy-africa/includes/widgets/header.php b/wp-content/plugins/academy-africa/includes/widgets/header.php
index f6a2fe6b..e7440905 100644
--- a/wp-content/plugins/academy-africa/includes/widgets/header.php
+++ b/wp-content/plugins/academy-africa/includes/widgets/header.php
@@ -2,6 +2,7 @@
 
 class Academy_Africa_Header extends \Elementor\Widget_Base
 {
+
     public function get_style_depends()
     {
         return ['academy-africa-header'];
@@ -24,7 +25,7 @@ public function get_icon()
 
     public function get_categories()
     {
-        return ['basic'];
+        return ['academy-africa'];
     }
 
     public function get_keywords()
@@ -32,12 +33,59 @@ public function get_keywords()
         return ['header', 'navigation'];
     }
 
+    function getSiteName()
+    {
+        return get_bloginfo('name');
+    }
+
+    function get_custom_logo_url()
+    {
+        $custom_logo_id = get_theme_mod('custom_logo');
+        $image = wp_get_attachment_image_src($custom_logo_id, 'full');
+        return $image[0];
+    }
+
     protected function render()
     {
 ?>
-        <div class="academy-africa-header">
-            <h1 class="title">Header</h1>
-        </div>
+        <nav class="nav">
+            <div class="logo-section">
+                <img src="<?php echo $this->get_custom_logo_url(); ?>" alt=<?php echo $this->getSiteName(); ?> class="logo">
+                <p class="page-title">
+                    <?php echo $this->getSiteName(); ?>
+                </p>
+            </div>
+            <div class="navigation-section">
+                <div class="search-bar">
+                    <input type="text" placeholder="Search Courses" class="search-input">
+                    <button class="search-button">
+                        <img src="./search-icon.png" alt="search" class="search-icon">
+                    </button>
+                </div>
+                <div class="navigation-links">
+                    <a href="#" class="nav-link">
+                        <p class="nav-link-text">Courses</p>
+                    </a>
+                    <a href="#" class="nav-link">
+                        <p class="nav-link-text">Events</p>
+                    </a>
+                    <a href="#" class="nav-link">
+                        <p class="nav-link-text">Blog</p>
+                    </a>
+                    <a href="#" class="nav-link">
+                        <p class="nav-link-text">About Us</p>
+                        <img src="./arrow-down.png" alt="arrow-down" class="arrow-down">
+                    </a>
+                    <a href="#" class="nav-link login-button">
+                        <p class="nav-link-text">Sign In</p>
+                    </a>
+                    <a href="#" class="nav-link nav-button lang-button ">
+                        <img src="./language-icon.png" alt="language" class="icon language-icon">
+                        <img src="./arrow-down.png" alt="arrow-down" class="arrow-down icon">
+                    </a>
+                </div>
+            </div>
+        </nav>
 
 <?php
     }
diff --git a/wp-content/plugins/academy-africa/includes/widgets/hero.php b/wp-content/plugins/academy-africa/includes/widgets/hero.php
index 0581fe1f..35ff4599 100644
--- a/wp-content/plugins/academy-africa/includes/widgets/hero.php
+++ b/wp-content/plugins/academy-africa/includes/widgets/hero.php
@@ -19,7 +19,7 @@ public function get_icon()
 
 	public function get_categories()
 	{
-		return ['basic'];
+		return ['academy-africa'];
 	}
 
 	public function get_keywords()

From 4439f9885db7239e613a1dc04ac777755d2bae07 Mon Sep 17 00:00:00 2001
From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
Date: Wed, 18 Oct 2023 17:05:20 +0300
Subject: [PATCH 6/9] basic controls

Signed-off-by: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
---
 .../includes/assets/css/style.css             |  9 ---
 .../includes/widgets/header.php               | 55 +++++++++++++++++--
 2 files changed, 49 insertions(+), 15 deletions(-)
 delete mode 100644 wp-content/plugins/academy-africa/includes/assets/css/style.css

diff --git a/wp-content/plugins/academy-africa/includes/assets/css/style.css b/wp-content/plugins/academy-africa/includes/assets/css/style.css
deleted file mode 100644
index 0fb49f8b..00000000
--- a/wp-content/plugins/academy-africa/includes/assets/css/style.css
+++ /dev/null
@@ -1,9 +0,0 @@
-body {
-    background-color: #000;
-    color: #fff;
-    font-family: sans-serif;
-    font-size: 16px;
-    line-height: 1.5;
-    margin: 0;
-    padding: 0;
-}
\ No newline at end of file
diff --git a/wp-content/plugins/academy-africa/includes/widgets/header.php b/wp-content/plugins/academy-africa/includes/widgets/header.php
index e7440905..de4299e1 100644
--- a/wp-content/plugins/academy-africa/includes/widgets/header.php
+++ b/wp-content/plugins/academy-africa/includes/widgets/header.php
@@ -33,6 +33,43 @@ public function get_keywords()
         return ['header', 'navigation'];
     }
 
+    protected function register_controls()
+    {
+        $this->start_controls_section(
+            'section_header',
+            [
+                'label' => __('Header', 'academy-africa'),
+            ]
+        );
+
+        // Sign in button text
+        $this->add_control(
+            'sign_in_button_text',
+            [
+                'label' => __('Sign In Button Text', 'academy-africa'),
+                'type' => \Elementor\Controls_Manager::TEXT,
+                'default' => __('Sign In', 'academy-africa'),
+                'placeholder' => __('Sign In', 'academy-africa'),
+            ]
+        );
+
+        // Search bar placeholder text
+        $this->add_control(
+            'search_bar_placeholder_text',
+            [
+                'label' => __('Search Bar Placeholder Text', 'academy-africa'),
+                'type' => \Elementor\Controls_Manager::TEXT,
+                'default' => __('Search Courses', 'academy-africa'),
+                'placeholder' => __('Search Courses', 'academy-africa'),
+            ]
+        );
+
+
+
+
+        $this->end_controls_section();
+    }
+
     function getSiteName()
     {
         return get_bloginfo('name');
@@ -47,6 +84,10 @@ function get_custom_logo_url()
 
     protected function render()
     {
+        $settings = $this->get_settings_for_display();
+
+        // inline editing
+        $this->add_inline_editing_attributes('sign_in_button_text', 'none');
 ?>
         <nav class="nav">
             <div class="logo-section">
@@ -57,9 +98,9 @@ protected function render()
             </div>
             <div class="navigation-section">
                 <div class="search-bar">
-                    <input type="text" placeholder="Search Courses" class="search-input">
+                    <input type="text" placeholder="<?php echo $settings['search_bar_placeholder_text']; ?>" class="search-input">
                     <button class="search-button">
-                        <img src="./search-icon.png" alt="search" class="search-icon">
+                        <i class="eicon-search search-icon"></i>
                     </button>
                 </div>
                 <div class="navigation-links">
@@ -74,14 +115,16 @@ protected function render()
                     </a>
                     <a href="#" class="nav-link">
                         <p class="nav-link-text">About Us</p>
-                        <img src="./arrow-down.png" alt="arrow-down" class="arrow-down">
+                        <i class="eicon-caret-down arrow-down"></i>
                     </a>
                     <a href="#" class="nav-link login-button">
-                        <p class="nav-link-text">Sign In</p>
+                        <p class="nav-link-text" <?php echo $this->get_render_attribute_string('sign_in_button_text'); ?>>
+                            <?php echo $settings['sign_in_button_text']; ?>
+                        </p>
                     </a>
                     <a href="#" class="nav-link nav-button lang-button ">
-                        <img src="./language-icon.png" alt="language" class="icon language-icon">
-                        <img src="./arrow-down.png" alt="arrow-down" class="arrow-down icon">
+                        <i class="eicon-globe arrow-down icon language-icon"></i>
+                        <i class="eicon-caret-down arrow-down icon"></i>
                     </a>
                 </div>
             </div>

From 52f21ec136e0522ef90791defbc68fec1e0ed7cd Mon Sep 17 00:00:00 2001
From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
Date: Wed, 18 Oct 2023 17:50:26 +0300
Subject: [PATCH 7/9] render dynamic menus

Signed-off-by: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
---
 .../includes/widgets/header.php               | 72 ++++++++++++++-----
 1 file changed, 55 insertions(+), 17 deletions(-)

diff --git a/wp-content/plugins/academy-africa/includes/widgets/header.php b/wp-content/plugins/academy-africa/includes/widgets/header.php
index de4299e1..5f534e64 100644
--- a/wp-content/plugins/academy-africa/includes/widgets/header.php
+++ b/wp-content/plugins/academy-africa/includes/widgets/header.php
@@ -33,6 +33,18 @@ public function get_keywords()
         return ['header', 'navigation'];
     }
 
+
+    function get_menus()
+    {
+        $menus = wp_get_nav_menus();
+        $menu_names = [];
+        foreach ($menus as $menu) {
+            $menu_names[$menu->name] = $menu->name;
+        }
+        return $menu_names;
+    }
+
+
     protected function register_controls()
     {
         $this->start_controls_section(
@@ -41,6 +53,16 @@ protected function register_controls()
                 'label' => __('Header', 'academy-africa'),
             ]
         );
+        // Select menu
+        $this->add_control(
+            'select_menu',
+            [
+                'label' => __('Select Menu', 'academy-africa'),
+                'type' => \Elementor\Controls_Manager::SELECT,
+                'default' => 'primary',
+                'options' => $this->get_menus(),
+            ]
+        );
 
         // Sign in button text
         $this->add_control(
@@ -64,9 +86,6 @@ protected function register_controls()
             ]
         );
 
-
-
-
         $this->end_controls_section();
     }
 
@@ -82,11 +101,35 @@ function get_custom_logo_url()
         return $image[0];
     }
 
+    function get_menu_items($name)
+    {
+        $list = wp_get_nav_menu_items($name);
+        $menu_items = [];
+        foreach ($list as $item) {
+            $menu_items[] = [
+                'title' => $item->title,
+                'url' => $item->url,
+                'id' => $item->ID,
+                'parent_id' => $item->menu_item_parent,
+            ];
+        }
+        $menu = [];
+        foreach ($menu_items as $item) {
+            if ($item['parent_id'] == 0) {
+                $menu[$item['id']] = $item;
+            } else {
+                $menu[$item['parent_id']]['children'][] = $item;
+            }
+        }
+        return $menu;
+    }
+
     protected function render()
     {
         $settings = $this->get_settings_for_display();
+        $selected_menu = $settings['select_menu'];
+        $menus = $selected_menu ? $this->get_menu_items($selected_menu) : [];
 
-        // inline editing
         $this->add_inline_editing_attributes('sign_in_button_text', 'none');
 ?>
         <nav class="nav">
@@ -104,19 +147,14 @@ protected function render()
                     </button>
                 </div>
                 <div class="navigation-links">
-                    <a href="#" class="nav-link">
-                        <p class="nav-link-text">Courses</p>
-                    </a>
-                    <a href="#" class="nav-link">
-                        <p class="nav-link-text">Events</p>
-                    </a>
-                    <a href="#" class="nav-link">
-                        <p class="nav-link-text">Blog</p>
-                    </a>
-                    <a href="#" class="nav-link">
-                        <p class="nav-link-text">About Us</p>
-                        <i class="eicon-caret-down arrow-down"></i>
-                    </a>
+                    <?php foreach ($menus as $menu) : ?>
+                        <a href="<?php echo $menu['url']; ?>" class="nav-link">
+                            <p class="nav-link-text"><?php echo $menu['title']; ?></p>
+                            <?php if (isset($menu['children'])) : ?>
+                                <i class="eicon-caret-down arrow-down"></i>
+                            <?php endif; ?>
+                        </a>
+                    <?php endforeach; ?>
                     <a href="#" class="nav-link login-button">
                         <p class="nav-link-text" <?php echo $this->get_render_attribute_string('sign_in_button_text'); ?>>
                             <?php echo $settings['sign_in_button_text']; ?>

From 08014bad45cfecdd7d3fefb95288df8bf3d109e5 Mon Sep 17 00:00:00 2001
From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
Date: Wed, 18 Oct 2023 18:54:52 +0300
Subject: [PATCH 8/9] fix alignment issues

Signed-off-by: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
---
 .../includes/assets/css/header.css            | 23 ++++++++++---------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/wp-content/plugins/academy-africa/includes/assets/css/header.css b/wp-content/plugins/academy-africa/includes/assets/css/header.css
index 4738c78d..e1d66fdd 100644
--- a/wp-content/plugins/academy-africa/includes/assets/css/header.css
+++ b/wp-content/plugins/academy-africa/includes/assets/css/header.css
@@ -56,6 +56,7 @@
     align-self: stretch;
     border: none;
     outline: none;
+    border-radius: 0;
 }
 
 .navigation-section .search-bar .search-input::placeholder {
@@ -64,7 +65,7 @@
     justify-content: center;
     flex: 1 0 0;
     align-self: stretch;
-    color: var(#767A94, #767A94);
+    color: #767A94;
     font-family: Open Sans;
     font-size: 14px;
     font-style: italic;
@@ -79,12 +80,14 @@
     align-items: center;
     gap: 8px;
     border: none;
-    background: var(#EFF0FD, #EFF0FD);
+    background: #EFF0FD;
+    border-radius: 0;
 }
 
-.navigation-section .search-bar .search-button img {
-    width: 16px;
-    height: 16px;
+.navigation-section .search-bar .search-button .search-icon {
+    font-size: 16px;
+    font-weight: bolder;
+    color: #0C1A81;
 }
 
 .navigation-section .navigation-links {
@@ -92,8 +95,6 @@
     justify-content: flex-end;
     align-items: center;
     gap: 10px;
-    height: 43px;
-    overflow: hidden;
 }
 
 .navigation-section .navigation-links a {
@@ -117,6 +118,7 @@
     font-style: normal;
     font-weight: 600;
     line-height: 21.6px;
+    margin: 0;
 }
 
 .navigation-section .navigation-links .nav-link .arrow-down {
@@ -143,6 +145,7 @@
     line-height: 19px;
     letter-spacing: 1.6px;
     text-transform: uppercase;
+    margin: 0;
 }
 
 .navigation-section .navigation-links .nav-link.lang-button {
@@ -156,13 +159,11 @@
 }
 
 .navigation-section .navigation-links .nav-link.lang-button .language-icon {
-    width: 24px;
-    height: 24px;
+    font-size: 24px;
 }
 
 .navigation-section .navigation-links .nav-link.lang-button .arrow-down {
-    width: 16px;
-    height: 16px;
+    font-size: 16px;
 }
 
 .navigation-section .navigation-links .nav-link.lang-button .icon {

From a066d7ea52ecbaa20cf662ab3fe2f27d1dd1001a Mon Sep 17 00:00:00 2001
From: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
Date: Thu, 19 Oct 2023 09:30:46 +0300
Subject: [PATCH 9/9] remove unused class

Signed-off-by: Kipruto <43873157+kelvinkipruto@users.noreply.github.com>
---
 wp-content/plugins/academy-africa/includes/widgets/header.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/wp-content/plugins/academy-africa/includes/widgets/header.php b/wp-content/plugins/academy-africa/includes/widgets/header.php
index 5f534e64..70f5acc3 100644
--- a/wp-content/plugins/academy-africa/includes/widgets/header.php
+++ b/wp-content/plugins/academy-africa/includes/widgets/header.php
@@ -161,7 +161,7 @@ protected function render()
                         </p>
                     </a>
                     <a href="#" class="nav-link nav-button lang-button ">
-                        <i class="eicon-globe arrow-down icon language-icon"></i>
+                        <i class="eicon-globe icon language-icon"></i>
                         <i class="eicon-caret-down arrow-down icon"></i>
                     </a>
                 </div>