update dropdown

This commit is contained in:
Ehab Hassan 2025-05-24 21:04:08 +03:00
parent 59581304d0
commit ee206e1241
4 changed files with 41 additions and 24 deletions

View File

@ -74,6 +74,10 @@ body.dark-mode .icon {
fill: #ffffff !important; fill: #ffffff !important;
} }
body.dark-mode .card {
background-color: rgba(82, 82, 82, 50%) !important;
}
body.dark-mode .dropdown a{ body.dark-mode .dropdown a{
@apply @apply
px-0 px-0

View File

@ -124,29 +124,29 @@ function hideHamburger() {
} }
} }
// function toggleFilter() { function toggleFilter() {
// var filterMenu = document.getElementById("filter-menu"); var filterMenu = document.getElementById("filter-menu");
// if (filterMenu.className.includes("hidden")) { if (filterMenu.className.includes("hidden")) {
// filterMenu.className = filterMenu.className.replace("hidden", " "); filterMenu.className = filterMenu.className.replace("hidden", " ");
// } else { } else {
// filterMenu.className = filterMenu.className + " hidden"; filterMenu.className = filterMenu.className + " hidden";
// } }
// } }
// window.onload = function () { window.onload = function () {
// let elements = document.getElementsByTagName("button"); let elements = document.getElementsByTagName("button");
// let buttons = [...elements]; let buttons = [...elements];
// buttons.forEach((button) => { buttons.forEach((button) => {
// button.addEventListener("click", function () { button.addEventListener("click", function () {
// handleClick(button); handleClick(button);
// }); });
// }); });
// document.getElementById("filter-btn").addEventListener("click", toggleFilter); document.getElementById("filter-btn").addEventListener("click", toggleFilter);
// document document
// .getElementById("mobile-learn-btn") .getElementById("mobile-learn-btn")
// .addEventListener("click", toggleMenu); .addEventListener("click", toggleMenu);
// }; };
function openInNewTab(url) { function openInNewTab(url) {
window.open(url, "_blank").focus(); window.open(url, "_blank").focus();

View File

@ -2,7 +2,7 @@
{% set header_items = section.content | safe | split(pat="<li>") %} {% set header_items = section.content | safe | split(pat="<li>") %}
<header id="header-container"> <header id="header-container">
<div class="z-20 fixed top-0 left-0 right-0 lg:absolute w-full"> <div class="nav_header z-20 fixed top-0 left-0 right-0 lg:absolute w-full">
<div class="relative z-50"> <div class="relative z-50">
<div class="mx-auto container flex z-50 justify-between items-center px-6 sm:px-4 md:px-6 py-4 lg:px-5 lg:justify-start space-x-10 sm:space-x-4 "> <div class="mx-auto container flex z-50 justify-between items-center px-6 sm:px-4 md:px-6 py-4 lg:px-5 lg:justify-start space-x-10 sm:space-x-4 ">
{# <div> {# <div>
@ -168,7 +168,7 @@
--> -->
<div id="hamburger" class="hidden fixed mt-14 z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden"> <div id="hamburger" class="hidden fixed mt-14 z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden">
<div> <div>
<div style="background-color: rgb(255, 255, 255);" class="shadow-xs h-screen divide-y-2 divide-gray-50"> <div class="nav_header shadow-xs h-screen divide-y-2 divide-gray-50">
<div class="pb-6 sm:px-12 md:px-16 mt-0 lg:px-20 space-y-6 sm:space-y-8 sm:pb-8 max-h-screen overflow-y-auto"> <div class="pb-6 sm:px-12 md:px-16 mt-0 lg:px-20 space-y-6 sm:space-y-8 sm:pb-8 max-h-screen overflow-y-auto">
<nav class="flex flex-col justify-around pb-12"> <nav class="flex flex-col justify-around pb-12">
@ -340,4 +340,13 @@
display: none; display: none;
} }
body .nav_header {
background-color: rgba(255, 255, 255) !important;
}
body.dark-mode .nav_header {
background-color: #121212 !important;
}
</style> </style>

View File

@ -6,7 +6,7 @@
{% set hover_color = hover_color | default(value="hover:bg-gray-50") %} {% set hover_color = hover_color | default(value="hover:bg-gray-50") %}
<div class="relative shadow rounded-lg p-4 transition-all duration-300"> <div class="card relative shadow rounded-lg p-4 transition-all duration-300">
{% if icon %} {% if icon %}
<div class="flex items-center justify-center h-12 w-12 rounded-md mb-4"> <div class="flex items-center justify-center h-12 w-12 rounded-md mb-4">
<img src="{{ icon | safe }}" class=""> <img src="{{ icon | safe }}" class="">
@ -31,4 +31,8 @@
p{ p{
font-weight: 200; font-weight: 200;
} }
body.dark-mode .card {
background-color: rgba(82, 82, 82, 50%) !important;
}
</style> </style>