OXIESEC PANEL

Name	Size	Modified	Perms
📁 ..	-	03/26/2025 04:21:24 AM	rwxr-xr-x
📄 Edit-arvind-index.php	61.9 KB	03/26/2025 04:16:33 AM	rw-r--r--
📁 NW_images	-	03/26/2025 04:21:28 AM	rwxr-xr-x
📄 aditya_index.php	44.57 KB	03/26/2025 04:16:33 AM	rw-r--r--
📄 arvind-save-template.php	3.75 KB	03/26/2025 04:16:33 AM	rw-r--r--
📄 arvinds-index.php	52.82 KB	03/26/2025 04:16:33 AM	rw-r--r--
📁 assets	-	03/26/2025 04:21:24 AM	rwxr-xr-x
📄 db_gallery.php	285 bytes	03/26/2025 04:16:33 AM	rw-r--r--
📄 delete_image.php	646 bytes	03/26/2025 04:16:33 AM	rw-r--r--
📄 edit_template.php	658 bytes	03/26/2025 04:16:33 AM	rw-r--r--
📄 fetch_data.php	779 bytes	03/26/2025 04:16:33 AM	rw-r--r--
📄 fetch_titles.php	0 bytes	03/26/2025 04:16:33 AM	rw-r--r--
📁 images10	-	03/26/2025 04:20:38 AM	rwxr-xr-x
📁 images11	-	03/26/2025 04:20:38 AM	rwxr-xr-x
📁 images12	-	03/26/2025 04:20:38 AM	rwxr-xr-x
📁 images13	-	03/26/2025 04:20:39 AM	rwxr-xr-x
📁 images14	-	03/26/2025 04:20:40 AM	rwxr-xr-x
📁 images15	-	03/26/2025 04:20:43 AM	rwxr-xr-x
📁 images16	-	03/26/2025 04:20:43 AM	rwxr-xr-x
📁 images17	-	03/26/2025 04:20:44 AM	rwxr-xr-x
📁 images18	-	03/26/2025 04:20:44 AM	rwxr-xr-x
📁 images19	-	03/26/2025 04:20:45 AM	rwxr-xr-x
📁 images2	-	03/26/2025 04:20:47 AM	rwxr-xr-x
📁 images20	-	03/26/2025 04:20:47 AM	rwxr-xr-x
📁 images21	-	03/26/2025 04:20:48 AM	rwxr-xr-x
📁 images3	-	03/26/2025 04:20:52 AM	rwxr-xr-x
📁 images4	-	03/26/2025 04:20:52 AM	rwxr-xr-x
📁 images5	-	03/26/2025 04:20:54 AM	rwxr-xr-x
📁 images6	-	03/26/2025 04:20:54 AM	rwxr-xr-x
📁 images7	-	03/26/2025 04:20:56 AM	rwxr-xr-x
📁 images8	-	03/26/2025 04:20:56 AM	rwxr-xr-x
📁 images9	-	03/26/2025 04:20:57 AM	rwxr-xr-x
📄 index.php	45.3 KB	03/26/2025 04:16:33 AM	rw-r--r--
📄 load_template.php	2.2 KB	03/26/2025 04:16:33 AM	rw-r--r--
📁 newsletter	-	03/26/2025 04:21:25 AM	rwxr-xr-x
📄 nleditor_navbar.php	10.1 KB	03/26/2025 04:16:33 AM	rw-r--r--
📄 save-template.php	2.45 KB	03/26/2025 04:16:33 AM	rw-r--r--
📄 script.js	34.02 KB	03/26/2025 04:16:33 AM	rw-r--r--
📄 styles.css	2.43 KB	03/26/2025 04:16:33 AM	rw-r--r--
📄 template1.jpg	0 bytes	03/26/2025 04:16:33 AM	rw-r--r--
📄 test.php	1.58 KB	03/26/2025 04:16:33 AM	rw-r--r--
📄 test_index.php	46.51 KB	03/26/2025 04:16:33 AM	rw-r--r--
📄 texts.txt	1.7 KB	03/26/2025 04:16:33 AM	rw-r--r--
📄 upload.php	858 bytes	03/26/2025 04:16:33 AM	rw-r--r--
📁 uploads	-	03/26/2025 04:20:57 AM	rwxr-xr-x

Editing: nleditor_navbar.php

<?php
require_once '../assets/php/function.php';
?>
<style>
    .navbar-brand {
        font-weight: 700;
        font-size: 1.5rem;
        color: #e50914 !important;
        /* Netflix Red */
    }

/* Navbar links */
    .navbar-nav .nav-link {
        color: #bbb !important;
        transition: color 0.3s;
    }

.navbar-nav .nav-link:hover {
        color: #fff !important;
    }

.navbar {
        background-color: #141414;
    }

/* CSS for the navbar */
    .navbar {
        position: sticky;
        /* Makes the navbar sticky */
        top: 0;
        /* Sticks to the top */
        z-index: 10000;
        /* Ensures it stays on top of other content */
        transition: all 0.3s ease;
    }

.navbar.scrolled {
        padding: 10px 0;
        /* Adjust the padding for a smaller navbar */
        background-color: #000;
        /* Change background color if needed */
    }

/* 
        .navbar img {
            height: 60px;
            transition: height 0.3s ease;
        } */

.navbar.scrolled img {
        height: 20px;
        /* Smaller logo height on scroll */
    }

/* Mobile styles */
    @media (max-width: 768px) {
        .navbar {
            padding: 8px;
            /* Initial padding for mobile */
        }

.navbar.scrolled {
            padding: 10px 0;
            /* Smaller padding when scrolled */
        }

}

.nav-item button {

border: none !important;
        /* border-radius: 100% !important; */
        background-color: transparent;
        outline: none !important;
    }

.nav-item button span {
        /* display: flex; */
        /* position: relative; */
        /* right: 5px; */
        align-items: center;
        justify-items: center;
        /* border-radius: 100%; */
        background-color: transparent !important;
    }

/* button:focus {
            outline: 1px dotted;
            outline: 5px auto -webkit-focus-ring-color;
        } */

#theme-icon img {
        fill: white;
        /* Change the color to white */
    }

/* .dropdown-menu.show {
         display: block;
         right: 50px;
         position: absolute;
         padding: 10px;
         display: block;
     } */

#toggle-mode {
        text-decoration: none;
        /* Prevent underline or other hover styles */
        cursor: pointer;
        /* Optional: Make it look like a clickable button */
    }

.dropdown-item {
        display: block;
        width: 100%;
        padding: 0.1rem 1rem !important;
        clear: both;
        font-weight: 400;
        color: var(--bs-dropdown-link-color);
        text-align: inherit;
        text-decoration: none;
        white-space: nowrap;
        background-color: transparent;
        border: 0;
        border-radius: var(--bs-dropdown-item-border-radius, 0);
    }

#toggle-mode,
    .dropdown-item:hover {
        color: none;
        /* Ensure text color doesn't change on hover */
        background-color: transparent;
        /* Prevent any background color change on hover */
    }

.dropdown-item:focus,
    .dropdown-item:hover {
        color: var(--bs-dropdown-link-hover-color);
        background-color: none !important;
    }

body.light-mode #toggle-mode #mode-text {
        color: #141414;
        /* Ensure the text color remains consistent */
    }

body.dark-mode #toggle-mode #mode-text {
        color: white;
        /* Ensure the text color remains consistent */
    }

.dropdown-menu .dropdown-menu-end li:hover {
        color: none;
        background-color: none;

}

.avatar {
        width: 40px;
        height: 40px;
        /* padding-top: 5px; */
        border-radius: 50%;
        border: 0.02px solid whitesmoke;
        overflow: hidden;
    }

.avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.dropdown-menu .dropdown-menu-end {
        padding: 10px !important;
        display: block;
        position: fixed !important;
        top: 68% !important;
        right: 0% !important;
    }

svg {
        width: 24px;
        height: 24px;
    }

.fa-bookmark {
        margin-left: 6px;
        margin-right: 6px;
    }

/* Mobile size adjustment */
    /* @media (max-width: 768px) {
        svg {
            width: 18px;
            height: 18px;
        }
    } */

@media screen and (max-width:540px) {
        .dropdown-menu .dropdown-menu-end {
            padding: 10px !important;
            display: block;
            position: fixed !important;
            top: 6% !important;
            right: 10% !important;
        }

.dropdown-item {
            display: block;
            width: 100%;
            font-size: 14px !important;
            padding: 0.1rem 0.8rem !important;
            clear: both;
            font-weight: 400;
            color: var(--bs-dropdown-link-color);
            text-align: inherit;
            text-decoration: none;
            white-space: nowrap;
            background-color: transparent;
            border: 0;
            border-radius: var(--bs-dropdown-item-border-radius, 0);
        }

.notDisInMob {
            display: none;
        }

}
</style>

<? require_once '../assets/php/db_config.php' ?>

<div class="end-navbar">
            <div class="nav-item dropdown " style="display:flex;">
                <a href="/account.php" class="nav-link dropdown-toggle" id="" role="button" aria-expanded="false">
                    <span id="settings-text">
                        <div class="avatar">
                            <img src="<?= viewProfilePic($creamdb, $gUserId) ?>" alt="Default Image" onerror="this.onerror=null; this.src='/data/profilePic/default.png';">
                        </div>
                    </span>
                </a>

</div>
        </div>
    </div>
</nav>

<script>
    $(document).ready(function() {
        const isMobile = () => $(window).width() <= 768;

// Handle dropdown toggle
        $('.dropdown-toggle').on('click', function(e) {
            e.preventDefault();
            const $dropdownMenu = $(this).next('.dropdown-menu');

// Toggle visibility
            $dropdownMenu.toggle();

// Close other open dropdowns
            $('.dropdown-menu').not($dropdownMenu).hide();
        });

// Close dropdown when clicking outside
        $(document).on('click', function(e) {
            if (!$(e.target).closest('.nav-item.dropdown').length) {
                $('.dropdown-menu').hide();
            }
        });

// Adjust on window resize
        $(window).resize(function() {
            if (!isMobile()) {
                $('.dropdown-menu').hide(); // Ensure dropdowns are hidden on resize
            }
        });
    });
</script>

$('#toggle-mode').click(function() {
            $('body').toggleClass('dark-mode light-mode');

if ($('body').hasClass('light-mode')) {
                localStorage.setItem('mode', 'light');
                $('#theme-icon').html('<img src="/assets/img/moon.png" width="20px" height="20px" alt="Light Mode">');
                $('#mode-text').text('Dark ');
            } else {
                localStorage.setItem('mode', 'dark');
                $('#theme-icon').html('<img src="/assets/img/sun.png" width="20px" height="20px" alt="Dark Mode">');
                $('#mode-text').text('Light ');
            }
        });
    });
</script>

// Function to check if it's mobile view (you can adjust the breakpoint)
    function isMobile() {
        return window.innerWidth <= 768;
    }
    window.addEventListener('scroll', function() {
        if (isMobile()) { // Only apply the effect on mobile
            let currentScroll = window.scrollY;

if (currentScroll > lastScrollTop) {
                navbar.style.transform = 'translateY(-100%)';
            } else {
                navbar.style.transform = 'translateY(0)';
            }

lastScrollTop = currentScroll <= 0 ? 0 : currentScroll;
        }
    });

// You can also check if window is resized and reapply the logic
    window.addEventListener('resize', function() {
        if (!isMobile()) {
            // Reset navbar position when the screen size goes above mobile view
            navbar.style.transform = 'translateY(0)';
        }
    });
</script>