Merge pull request #10 from nukehub-dev/develop

Develop

_config.yml

@@ -1,5 +1,5 @@
 title: NukeHub
-email: talk@nukehub.org
+email: info@nukehub.org
 description: >- # this means to ignore newlines until "baseurl:"
   A pioneering platform dedicated to the exploration and 
   advancement of nuclear technology. Our mission is to foster 

_data/footer.yml

@@ -37,6 +37,6 @@
     - title: GitHub
       url: https://github.com/nukehub-dev/
       newpage: true
-    - title: NukeTalk
-      url: https://talk.nukehub.org
+    - title: LinkedIn
+      url: https://www.linkedin.com/company/nukehub
       newpage: true

_data/nav.yml

@@ -47,6 +47,12 @@
     - title: Code of Conduct
       icon: nuke-law
       url: /code-of-conduct
+    - title: Acknowledgment
+      icon: nuke-certificate-file
+      url: /acknowledgment
+    - title: Support Us
+      icon: nuke-love
+      url: /support
 
 - title: Community
   icon: nuke-group
@@ -65,3 +71,7 @@
       icon: nuke-github
       url: https://github.com/nukehub-dev
       newpage: true
+    - title: LinkedIn
+      icon: nuke-linkedin-solid
+      url: https://www.linkedin.com/company/nukehub
+      newpage: true

_data/sponsors.yml

@@ -0,0 +1,17 @@
+# This YAML structure defines categories for sponsor entries.
+# Each containing details such as name, description, image, and URL.
+
+# Fields:
+# name (required): The name of the sponsor.
+# image (required): The transparent background image of the sponsor.
+# url (required): The URL of the sponsor.
+# acknowledgment (required): Acknowledgment for the sponsor.
+
+- name: Military Institute of Science and Technology (MIST)
+  image: /assets/images/sponsors/MIST.png
+  url: https://mist.ac.bd
+  acknowledgment: >
+    Heartfelt thanks to the Military Institute of Science and Technology (MIST) 
+    for generously hosting NukeHub on their servers. Their support is instrumental 
+    in ensuring the smooth operation and accessibility of our platform.
+

_includes/sponsor-box.html

@@ -0,0 +1,46 @@
+<div class="box_container container grid sponsors">
+    {% for obj in include.data %}
+    <div class="box_content" id="sponsor{{ forloop.index }}" style="padding: 0">
+        <div class="box_bg"></div>
+        <div class="our-sponsor">
+            <a class="picture" target="_blank" href="{{ obj.url }}">
+                <img class="img-fluid" src="{{ obj.image }}" alt="{{ obj.name }}">
+            </a>
+            <p class="box_title">{{ obj.name }}</p>
+            <div class="acknowledgment">
+                <p>{{ obj.acknowledgment }}</p>
+                <a target="_blank" href="{{ obj.url }}" class="button button--flex">
+                    Visit Site <i class="nuke-arrow-ios-forward button_icon"></i>
+                </a>
+            </div>
+        </div>
+    </div>
+    <script>
+        $(function () {
+            $.contextMenu({
+                selector: "#sponsor{{ forloop.index }}",
+                callback: function (key, options) {
+                    var m = "clicked: " + key;
+                },
+                animation: {
+                    duration: 200,
+                    show: "fadeIn",
+                    hide: "fadeOut",
+                },
+                zIndex: 10000,
+                items: {
+                    //{% if obj.url %}
+                    "url": {
+                        name: "<i class='nuke-share-1 context_menu-icon'></i> Visit Site",
+                        isHtmlName: true,
+                        callback: function (key, options) {
+                            window.location.href = "{{ obj.url }}";
+                        },
+                    },
+                    // {% endif %}
+                },
+            });
+        });
+    </script>
+    {% endfor %}
+</div>

community/events.md

@@ -1,15 +1,15 @@
 ---
 layout: page
-id: about
+id: events
 title: Events
 description: >-
-    Discover and engage with the latest happenings in nuclear technology. 
-    Get comprehensive details about each event, including schedules, venues, 
-    speakers, and more. Stay connected with the global nuclear community and 
-    join us in shaping the future of nuclear science and engineering.
+  Discover and engage with the latest happenings in nuclear technology. 
+  Get comprehensive details about each event, including schedules, venues, 
+  speakers, and more. Stay connected with the global nuclear community and 
+  join us in shaping the future of nuclear science and engineering.
 permalink: /events
 ---
 
 # Events
 
-{% include calendar.html %}
+{% include calendar.html %}

community/people.md

@@ -3,13 +3,14 @@ layout: page
 id: people
 title: People
 description: >-
-    Meet the passionate individuals behind NukeHub. Discover the Executive Council 
-    members who guide our mission in advancing nuclear technology, 
-    their roles, affiliations, and ways to connect with them.
+  Discover the members who guide our mission in advancing nuclear technology, their roles, affiliations, and ways to connect with them.
 permalink: /people
 ---
+
 {% for obj in site.data.people %}
+
 # {{ obj.title }}
+
 <div class="box_content">
     <div class="box_bg"></div>
     <p>

css/nukehub.css

@@ -530,7 +530,7 @@ button {
   transition: 0.3s;
 }
 .button:hover {
-  background-color: var(--color-alt);
+  background-color: var(--opacity-color-100);
   transition: 0.3s;
 }
 .button_title {
@@ -1448,8 +1448,10 @@ button {
   grid-column: 1/3;
 }
 .home_title {
+  color: var(--title-color);
   font-size: var(--big-font);
   margin-bottom: var(--mb-0-75);
+  font-weight: var(--font-semi-bold);
 }
 .home_subtitle {
   font-size: var(--h3-font);
@@ -1469,7 +1471,6 @@ button {
   align-self: center;
   object-fit: cover;
   transition: all 0.3s ease-out;
-  cursor: pointer;
 }
 .join_img:hover {
   transform: scale(1.1);
@@ -1629,13 +1630,13 @@ textarea {
   list-style-type: disc;
 }
 
-/*TODO: Team */
-.team {
+/*TODO: Team and Sponsor */
+.team, .sponsors {
   margin-top: var(--mb-1);
   margin-bottom: var(--mb-1-5);
   grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
 }
-.our-team {
+.our-team, .our-sponsor {
   padding: 1.5rem 0.25rem 2rem 0.25rem;
   background-color: transparent;
   text-align: center;
@@ -1652,6 +1653,14 @@ textarea {
   position: relative;
 }
 
+.our-sponsor .picture {
+  display: inline-block;
+  width: 90%;
+  margin-bottom: auto;
+  z-index: 1;
+  position: relative;
+}
+
 .our-team .picture::before {
   content: "";
   width: 100%;
@@ -1692,13 +1701,17 @@ textarea {
   transition: all 0.9s ease 0s;
 }
 
+.our-sponsor .picture img {
+  transition: all 0.9s ease 0s;
+}
+
 .our-team:hover .picture img {
   border: 0px solid var(--color);
   box-shadow: 0 0 0 14px var(--opacity-color-200);
   transform: scale(0.7);
 }
 
-.our-team .title {
+.our-team .title , .our-sponsor .title {
   display: block;
   font-size: 15px;
   color: var(--text-color);
@@ -1711,12 +1724,26 @@ textarea {
   margin: 0;
   background-color: var(--color);
   position: absolute;
-  bottom: -100px;
+  bottom: -100%;
+  left: 0;
+  transition: all 0.5s ease 0s;
+}
+
+.our-sponsor .acknowledgment {
+  width: 100%;
+  min-height: 50%;
+  padding: 0.5rem;
+  margin: 0;
+  background-color: var(--color);
+  color: #fff;
+  position: absolute;
+  bottom: -100%;
   left: 0;
   transition: all 0.5s ease 0s;
+  z-index: 10;
 }
 
-.our-team:hover .social {
+.our-team:hover .social, .our-sponsor:hover .acknowledgment {
   bottom: 0;
 }
 

index.html

@@ -5,9 +5,8 @@
   Nukehub is a pioneering platform dedicated to the exploration and 
   advancement of nuclear technology.
 keywords: >-
-  NukeHub, nuclear technology, nuclear science, open source, innovation,
-  collaboration, community, NRMS, NukeAnalytics, NukeLab, NukeBox, NukeTalk,
-  simulation, discussions
+  nukehub, nuclear, technology, science, open source, innovation,
+  collaboration, community, simulation, discussions
 permalink: /
 ---
 
@@ -45,8 +44,9 @@
         {% include svg.html class="home_nukehub" %}
       </div>
       <div class="home_data">
+        <h1 style="display: none;">Home</h1>
         <h3 class="home_subtitle">Introducing</h3>
-        <h1 class="home_title">NukeHub</h1>
+        <div class="home_title">NukeHub</div>
         <p class="home_description">
           A pioneering platform dedicated to the exploration and advancement
           of nuclear technology. Our mission is to foster a community of innovators,
@@ -69,7 +69,7 @@ <h2 class="section_title">Projects</h2>
   <h2 class="section_title">Join with Us</h2>
   <span class="section_subtitle">Let's Dive into the Nuclear Universe Together</span>
   <div class="join_container container grid">
-    <img src="assets/images/nuketalk.png" alt="NukeTalk Logo" style="filter:var(--color-svg);" class="join_img" />
+    <img src="assets/images/nuketalk.svg" alt="NukeTalk Logo" style="filter:var(--color-svg);" class="join_img" />
     <div class="join_data">
       <p class="join_description">
         Ignite your passion for nuclear science & engineering.

js/main.js

@@ -34,26 +34,29 @@ if (navClose) {
 }
 
 // Close dropdown when clicking outside
-$(document).on('click', function (e) {
-  if (!$(e.target).closest('.nav_item.dropdown').length) {
-    $('.dropdown-menu').hide();
-    $('.nav_icon_droupdown').removeClass('rotate');
+$(document).on("click", function (e) {
+  if (!$(e.target).closest(".nav_item.dropdown").length) {
+    $(".dropdown-menu").hide();
+    $(".nav_icon_droupdown").removeClass("rotate");
   }
 });
 
 // Toggle dropdown on click
-$('.nav_item.dropdown').on('click', function () {
+$(".nav_item.dropdown").on("click", function () {
   // Calculate and set the position of the dropdown-menu
-  var dropdownMenu = $(this).find('.dropdown-menu');
-    dropdownMenu.css({
-      display: 'block',
-      left: $(this).offset().left,
-      bottom: 'auto'
-    });
-    $(this).find('.nav_icon_droupdown').addClass('rotate');
+  var dropdownMenu = $(this).find(".dropdown-menu");
+  dropdownMenu.css({
+    display: "block",
+    left: $(this).offset().left,
+    bottom: "auto",
+  });
+  $(this).find(".nav_icon_droupdown").addClass("rotate");
   // Hide other dropdowns
-  $('.dropdown-menu').not(dropdownMenu).hide();
-  $('.nav_item.dropdown').not(this).find('.nav_icon_droupdown').removeClass('rotate');
+  $(".dropdown-menu").not(dropdownMenu).hide();
+  $(".nav_item.dropdown")
+    .not(this)
+    .find(".nav_icon_droupdown")
+    .removeClass("rotate");
 });
 
 /*========== Remove Menu Mobile ==========*/
@@ -67,12 +70,12 @@ function linkAction() {
 navLink.forEach((n) => n.addEventListener("click", linkAction));
 
 /*TODO  Scroll Active Link */
-$(window).on('scroll', function() {
+$(window).on("scroll", function () {
   const scrollY = $(window).scrollTop();
-  $("section[id]").each(function() {
+  $("section[id]").each(function () {
     const sectionHeight = $(this).outerHeight();
     const sectionTop = $(this).offset().top - 100;
-    const sectionId = $(this).attr('id');
+    const sectionId = $(this).attr("id");
 
     if (scrollY > sectionTop && scrollY <= sectionTop + sectionHeight) {
       $(".nav_menu a[href*=" + sectionId + "]").addClass("active-link");
@@ -140,6 +143,9 @@ if (selectedTheme) {
   themeButton.classList[selectedIcon === "nuke-moon" ? "add" : "remove"](
     iconTheme
   );
+} else if (window.matchMedia("(prefers-color-scheme:dark)").matches) {
+  document.body.classList.add(darkTheme);
+  themeButton.classList.add(iconTheme);
 }
 
 themeButton.addEventListener("click", () => {
@@ -150,7 +156,6 @@ themeButton.addEventListener("click", () => {
 });
 
 document.querySelectorAll(".theme-colors .color").forEach((color) => {
-  console.log("clicked");
   color.onclick = () => {
     var colorName = color.getAttribute("name");
     var background = color.getAttribute("hue-color");
@@ -276,7 +281,11 @@ try {
 
 themeButton.addEventListener("click", () => {
   $("particles-js").html("");
-  particleColor = localStorage.getItem("particle-color").split(",");
+  try {
+    particleColor = localStorage.getItem("particle-color").split(",");
+  } catch (err) {
+    particleColor = ["#e06257", "#cb4e43", "#fcbbb6"];
+  }
   runParticleJS(particleColor);
 });
 
@@ -289,12 +298,12 @@ function runParticleJS(particleColor) {
   particlesJS("particles-js", {
     particles: {
       number: { value: 10, density: { enable: true, value_area: 1500 } },
-      color: { value: particleColor }, //FIXME: Not updateing after change color need page reflesh
+      color: { value: particleColor },
       shape: {
         type: "circle",
         stroke: { width: 0, color: "#000000" },
         polygon: { nb_sides: 12 },
-        image: { src: "assets/images/nrms.svg", width: 100, height: 100 },
+        image: { src: "assets/images/nukehub.svg", width: 100, height: 100 },
       },
       opacity: {
         value: 0.03,