OXIESEC PANEL

Name	Size	Modified	Perms
📁 ..	-	05/19/2025 10:07:13 AM	rwxr-xr-x
📁 PHPMailer	-	05/19/2025 10:07:13 AM	rwxr-xr-x
📄 blockAccount.php	2.23 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 bottom_navbar.php	5.67 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 ch_config.php	9.37 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 ch_db_config.php	3.44 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 common.js	46.89 KB	05/16/2025 04:32:09 AM	rw-r--r--
📄 config.php	9.37 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 db_config.php	3.43 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 db_connect.php	293 bytes	05/19/2025 10:07:13 AM	rw-r--r--
📄 db_gallery.php	294 bytes	05/19/2025 10:07:13 AM	rw-r--r--
📄 delete_account.php	3.5 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 edit_post.php	2.23 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 event_scrollbar.php	4.63 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 footer.php	1.12 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 function.php	23.34 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 getEditContent.php	860 bytes	05/19/2025 10:07:13 AM	rw-r--r--
📄 go_backbar.php	2.32 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 handler.php	3.51 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 indexFooter.php	1.05 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 mail.php	2.67 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 navbar.php	22.77 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 new_social_navbar.php	1.07 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 new_social_sidebar.php	5.59 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 original-function.php	30.55 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 process_data.php	3.87 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 readert_validate.logged.php	481 bytes	05/19/2025 10:07:13 AM	rw-r--r--
📄 report_account.php	1.42 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 report_stream.php	2.08 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 savePost.php	2.38 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 sidebar.php	19.68 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 siginupProcess.php	5.24 KB	05/19/2025 10:07:13 AM	rw-r--r--
📁 simplepie	-	05/19/2025 10:07:13 AM	rwxr-xr-x
📄 stream.php	62.49 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 stream_post_handler.php	3.68 KB	05/19/2025 10:07:13 AM	rw-r--r--
📄 validate.logged.php	1.31 KB	05/19/2025 10:07:13 AM	rw-r--r--

Editing: event_scrollbar.php

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Scrolling Text with Profile</title>
    <style>
        .tubecards {
            display: flex;
            width: 100%;
            justify-content: space-around;
            background-color: transparent;
            gap: 10px;
            overflow-x: hidden;

}

#cards-container {

display: flex;
            gap: 4px;
            overflow-x: hidden;
        }

.custom-scroll-container {
            display: flex;
            align-items: center;
            background-color:#fbecc9 ;
            color: black;
            border-radius: 50px;
            padding: 15px 10px 15px 60px;
            min-width: 300px;
            position: relative;
            overflow: hidden;
            animation: slide-animation 10s linear infinite;
            /* Ensure text is clipped when over profile */
        }

.custom-profile {
            width: 80px;
            height: 40px;
            border-radius: 20PX;
            border: 1px solid white;
            margin-right: 10px;
            position: absolute;
            /* Position the profile over the text */
            left: 10px;
            /* Adjust as needed */
            z-index: 2;
            /* Ensures profile is on top */
        }

.custom-scroll-text-container {
            display: flex;
            align-items: center;
            width: 100%;
            margin-left: 33px;
            /* To leave space for the profile image */
            overflow: hidden;
            /* Hide text overflow where it overlaps with profile */
        }

.custom-scroll-text {
            white-space: nowrap;
            font-size: 18px;
            font-weight: bold;
            color: #072010;
            animation: scroll-animation 8s linear infinite;
        }

@keyframes scroll-animation {
            from {
                transform: translateX(100%);
            }

to {
                transform: translateX(-100%);
            }
        }

@keyframes slide-animation {
            from {
                transform: translateX(0);
            }

to {
                transform: translateX(-100%);
            }
        }
    </style>
    <style>
        /* Default styling for large screens */
        .custom-scroll-container {
            display: block;
            margin: 10px;
        }

/* Responsive layout for small screens */
        @media (max-width: 768px) {
            .custom-scroll-container {
                display: inline-block;
                width: 23%;
                /* Show 4 items side by side with a bit of margin */
                margin: 1%;
            }

}

/* Responsive layout for larger screens */
        @media (min-width: 769px) {
            .custom-scroll-container {
                display: block;
                width: 100%;
                /* Show 1 item per row */
                margin: 10px 0;
            }

.main_screen {
                width: 840px;
            }

.custom-scroll-container {
                display: block;
                width: 190px;
                margin: 10px 0;
            }

#cards-container {

display: flex;
                gap: 10px;
                overflow-x: hidden;
            }
        }
    </style>
</head>

const cardContent = `
                <div class="custom-scroll-text-container">
                    <img src="assets/img/BIFFes.png" class="custom-profile" alt="Profile Picture">
                    <div class="custom-scroll-text">BIFFes 2025</div>
                </div>
            `;
            card.innerHTML = cardContent;   
            container.appendChild(card);
        }
    </script>
</body>

</html>