OXIESEC PANEL

Name	Size	Modified	Perms
📁 ..	-	03/04/2025 08:32:49 AM	rwxr-xr-x
📁 .vscode	-	03/03/2025 08:23:04 AM	rwxr-xr-x
📁 assets	-	03/03/2025 08:31:58 AM	rwxr-xr-x
📄 dashboard.html	17.82 KB	03/03/2025 08:18:51 AM	rw-r--r--
📄 dashboard.zip	3.39 KB	03/03/2025 08:18:51 AM	rw-r--r--
📁 forms	-	05/19/2025 10:07:13 AM	rwxr-xr-x
📄 index_test.html	15.16 KB	03/03/2025 08:18:51 AM	rw-r--r--
📄 login.html	1.39 KB	03/03/2025 08:18:51 AM	rw-r--r--
📁 services	-	03/03/2025 08:28:33 AM	rwxr-xr-x
📄 signup.html	2.12 KB	03/03/2025 08:18:51 AM	rw-r--r--

Editing: dashboard.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>MashiniHomeDesigns Dashboard</title>
    
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet">
    
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" rel="stylesheet">
    
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f5f6f7;
            margin: 0;
            padding: 0;
        }
        .header {
            background-color: #20242899;
            color: #fff;
            padding: 20px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            position: fixed;
            width: 100%;
            top: 0;
            left: 0;
            z-index: 1000;
        }
        .header .navbar-brand {
            color: #fff;
            font-size: 28px;
            font-weight: bold;
        }
        .header .navbar-nav {
            margin-right: auto; /* Pushes items to the left */
        }
        .header .navbar-nav .nav-link {
            color: #fff;
            padding: 10px 15px;
        }
        .header .navbar-nav .nav-link:hover {
            background-color: #20242899;
            border-radius: 5px;
        }
        .header .login-btn {
            background-color: #28a745; /* Green color */
            color: #fff;
            border-radius: 24px;
            padding: 10px 20px;
            font-size: 16px;
            border: none;
            cursor: pointer;
            transition: background-color 0.3s ease;
        }
        .header .login-btn:hover {
            background-color: #218838; /* Darker green */
        }

.hero-section {
            position: relative;
            overflow: hidden;
            color: #fff; /* Adjust text color if needed */
        }
        
        .hero-background {
            background: url('https://archello.s3.eu-central-1.amazonaws.com/images/2019/04/11/Modern-Individual-House-P15-1.1554995947.8275.jpg') no-repeat center center;
            background-size: cover;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 3.5; /* Adjust this value to your preferred opacity */
        }
        
        .container {
            position: relative; /* Ensure text stays on top of the background */
            z-index: 1;
            padding: 106px 15px; /* Adjust padding as needed */
            opacity: 3.5;
        }
        
        .row {
            text-align: center;
        }

.hero-section {
            background: url('https://archello.s3.eu-central-1.amazonaws.com/images/2019/04/11/Modern-Individual-House-P15-1.1554995947.8275.jpg') no-repeat center center;
            filter: blur(1);
            background-size: cover;
            height: 400px;
            display: flex;
            align-items: center;
            color: #282626;
            text-align: center;
            padding: 20px;
            margin-top: 108px; /* Adjust for header height */
        }
        .hero-section h1 {
            font-size: 48px;
            margin-bottom: 20px;
            
        }
        .hero-section p {
            font-size: 20px;
            margin-bottom: 30px;
        }
        .hero-section .btn {
            background-color: #fff;
            color: #007bff;
            padding: 10px 20px;
            border: none;
            border-radius: 5px;
            font-size: 18px;
        }
        .hero-section .btn:hover {
            background-color: #e2e6ea;
        }
        .main-content {
            padding: 30px;
            margin-top: 20px; /* Space below hero section */
        }
        .data-cards {
            margin-bottom: 30px;
        }
        .data-card {
            border-radius: 15px;
            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
            background-color: #fff;
            padding: 20px;
            text-align: center;
        }
        .data-card h5 {
            font-size: 24px;
            margin-bottom: 15px;
        }
        .data-card p {
            font-size: 18px;
        }
        .chart-container {
            background-color: #ffffff;
            border-radius: 15px;
            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
            padding: 30px;
            margin-bottom: 30px;
        }
        .chart-container h5 {
            font-size: 24px;
            margin-bottom: 20px;
        }
        .recent-activities {
            background-color: #ffffff;
            border-radius: 15px;
            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
            padding: 30px;
            margin-bottom: 30px;
        }
        .recent-activities h5 {
            font-size: 24px;
            margin-bottom: 20px;
        }
        .activity-item {
            display: flex;
            align-items: center;
            margin-bottom: 20px;
        }
        .activity-item img {
            width: 60px;
            height: 60px;
            border-radius: 50%;
            margin-right: 15px;
        }
        .activity-item p {
            margin: 0;
            font-size: 18px;
        }
        .previous-works, .case-studies {
            margin-bottom: 30px;
        }
        .previous-works img, .case-studies img {
            width: 100%;
            border-radius: 15px;
        }
        .case-studies .video-container {
            position: relative;
            padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
            height: 0;
            overflow: hidden;
            border-radius: 15px;
            margin-bottom: 20px;
        }
        .case-studies .video-container iframe {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }
        .footer {
            background-color: #20242899;
            color: #fff;
            padding: 20px 0;
            text-align: center;
            position: relative;
        }
        @media (max-width: 768px) {
            .hero-section h1 {
                font-size: 36px;
            }
            .hero-section p {
                font-size: 18px;
            }
            .hero-section .btn {
                font-size: 16px;
                padding: 8px 16px;
            }
            .data-card {
                padding: 15px;
            }
            .chart-container, .recent-activities {
                padding: 20px;
            }
        }
        @media (max-width: 576px) {
            .header .navbar-brand {
                font-size: 24px;
            }
            .header .navbar-nav .nav-link {
                font-size: 14px;
            }
            .hero-section h1 {
                font-size: 28px;
            }
            .hero-section p {
                font-size: 16px;
            }
            .hero-section .btn {
                font-size: 14px;
                padding: 6px 12px;
            }
            .data-card h5 {
                font-size: 20px;
            }
            .data-card p {
                font-size: 16px;
            }
            .activity-item p {
                font-size: 16px;
            }
        }
    </style>
</head>
<body>
    
    <header class="header">
        <nav class="navbar navbar-expand-lg navbar-light">
            <a class="navbar-brand" href="#">MashiniHomeDesigns</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav">
                    <li class="nav-item"><a class="nav-link" href="#">Home</a></li>
                    <li class="nav-item"><a class="nav-link" href="#">About Us</a></li>
                    <li class="nav-item"><a class="nav-link" href="#">Services</a></li>
                    <li class="nav-item"><a class="nav-link" href="#">Membership</a></li>
                    <li class="nav-item"><a class="nav-link" href="#">Blog</a></li>
                    <li class="nav-item"><a class="nav-link" href="#">Contact Us</a></li>
                    <li class="nav-item"><a class="nav-link" href="#">FAQ</a></li>
                </ul>
                <button class="login-btn">Login <i class="fas fa-user"></i></button>
            </div>
        </nav>
    </header>

<section class="hero-section">
        <div class="hero-background">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-lg-10 col-md-10 col-sm-12">
                        <h1 class="display-4">Empowering the Informal Entrepreneurial Workforce</h1>
                        <p class="lead">Join today to transform the face of residential construction in Bangalore.</p>
                        <a href="#" class="btn btn-primary btn-lg">Explore our Works</a>
                    </div>
                </div>
            </div>
        </div>
    </section>

<div class="container main-content">
        
        <div class="data-cards row">
            <div class="col-md-4 col-sm-12 mb-2">
                <div class="data-card">
                    <h5>Total Projects</h5>
                    <p><i class="fas fa-users fa-3x"></i> 1,234 Projects</p>
                </div>
            </div>
            <div class="col-md-4 col-sm-12 mb-2">
                <div class="data-card">
                    <h5>Active Projects</h5>
                    <p><i class="fas fa-project-diagram fa-3x"></i> 56 ongoing projects</p>
                </div>
            </div>
            <div class="col-md-4 col-sm-12 mb-2">
                <div class="data-card">
                    <h5>Upcoming Events</h5>
                    <p><i class="fas fa-calendar-alt fa-3x"></i> 12 scheduled events</p>
                </div>
            </div>
        </div>

<div class="row">
            <div class="col-md-6 col-sm-12">
                <div class="chart-container">
                    <h5>Monthly Projects Growth</h5>
                    <canvas id="memberGrowthChart"></canvas>
                </div>
            </div>
            <div class="col-md-6 col-sm-12">
                <div class="recent-activities">
                    <h5>Recent Activities</h5>
                    <div class="activity-item">
                        <img src="https://static.vecteezy.com/system/resources/previews/000/378/728/original/star-vector-icon.jpg" alt="Activity 1">
                        <p>New member joined: John Doe</p>
                    </div>
                    <div class="activity-item">
                        <img src="https://static.vecteezy.com/system/resources/previews/000/378/728/original/star-vector-icon.jpg" alt="Activity 2">
                        <p>Project completed: ABC Construction</p>
                    </div>
                    <div class="activity-item">
                        <img src="https://static.vecteezy.com/system/resources/previews/000/378/728/original/star-vector-icon.jpg" alt="Activity 3">
                        <p>Upcoming workshop: Advanced Training</p>
                    </div>
                </div>
            </div>
        </div>

<section class="previous-works">
            <h2>Executive in the Spotlight</h2>
            <div class="row">
                <div class="col-md-4 col-sm-12">
                    <img src="https://www.rennteam-stuttgart.de/wp-content/uploads/2016/08/SebastianWelscherNEW.jpg" alt="Profile 1">
                    <h4>Name:</h4>
                    <p>Modern Residential Complex, Bangalore: A state-of-the-art housing development with eco-friendly features and modern amenities.</p>
                </div>
                <div class="col-md-4 col-sm-12">
                    <img src="https://images.pexels.com/photos/220453/pexels-photo-220453.jpeg?cs=srgb&dl=pexels-pixabay-220453.jpg&fm=jpg" alt="Profile 2">
                    <h4>Name:</h4>
                    <p>Luxury Apartment Building: Elegant design and high-end finishes, designed to provide a premium living experience.</p>
                </div>
            </div>
        </section>

<section class="previous-works">
            <h2>Previous Works</h2>
            <div class="row">
                <div class="col-md-4 col-sm-12">
                    <img src="https://cdn.decorilla.com/online-decorating/wp-content/uploads/2018/10/modern-living-room-neutral-walls.jpg" alt="Project 1">
                    <p>Modern Residential Complex, Bangalore: A state-of-the-art housing development with eco-friendly features and modern amenities.</p>
                </div>
                <div class="col-md-4 col-sm-12">
                    <img src="https://www.rentcafe.com/blog/wp-content/uploads/sites/62/2016/06/50-Columbus-full.jpg" alt="Project 2">
                    <p>Luxury Apartment Building: Elegant design and high-end finishes, designed to provide a premium living experience.</p>
                </div>
                <div class="col-md-4 col-sm-12">
                    <img src="https://images.dailyhive.com/vancitybuzz/uploads/2015/10/Den-900x580.jpg" alt="Project 3">
                    <p>Community Center Revamp: Revitalizing local spaces to foster community engagement and provide new facilities.</p>
                </div>
                <div class="col-md-4 col-sm-12">
                  <img src="https://mir-s3-cdn-cf.behance.net/project_modules/1400_opt_1/7d4a19130748677.6186db7d78df5.jpg" alt="Project 1">
                  <p>Modern Residential Complex, Bangalore: A state-of-the-art housing development with eco-friendly features and modern amenities.</p>
              </div>
              <div class="col-md-4 col-sm-12">
                  <img src="https://img.freepik.com/premium-photo/front-view-modern-architecture-beautiful-house-exterior-wallpaper-ai-generated-art_848903-2660.jpg" alt="Project 2">
                  <p>Luxury Apartment Building: Elegant design and high-end finishes, designed to provide a premium living experience.</p>
              </div>
              <div class="col-md-4 col-sm-12">
                  <img src="https://media.designcafe.com/wp-content/uploads/2020/07/22202124/independent-house-interior-design-with-living-room.jpg" alt="Project 3">
                  <p>Community Center Revamp: Revitalizing local spaces to foster community engagement and provide new facilities.</p>
              </div>
            </div>
        </section>

<section class="case-studies">
            <h2>Case Studies</h2>
            <div class="row">
                <div class="col-md-6 col-sm-12">
                    <div class="video-container">
                        <iframe src="https://www.youtube.com/embed/dQw4w9WgXcQ" title="Case Study Video" allowfullscreen></iframe>
                    </div>
                    <p><strong>Case Study: Innovative Construction Techniques</strong></p>
                    <p>Explore how our team used cutting-edge technology and sustainable methods to deliver exceptional results in our latest project.</p>
                </div>
                <div class="col-md-6 col-sm-12">
                    <img src="https://th.bing.com/th/id/OIP.BijpUYfVJRnSRoLHi4ks3gHaFS?rs=1&pid=ImgDetMain" alt="Case Study Image">
                    <p><strong>Case Study: Community Impact Project</strong></p>
                    <p>Read about our community-focused initiatives that have made a significant positive impact on local neighborhoods and residents.</p>
                </div>
            </div>
        </section>
    </div>

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
    
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <script>
        // Chart.js example script
        var ctx = document.getElementById('memberGrowthChart').getContext('2d');
        var memberGrowthChart = new Chart(ctx, {
            type: 'line',
            data: {
                labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
                datasets: [{
                    label: 'Projects',
                    data: [12, 19, 3, 5, 2, 3, 7, 10, 5, 8, 12, 15],
                    backgroundColor: 'rgba(0, 123, 255, 0.2)',
                    borderColor: 'rgba(0, 123, 255, 1)',
                    borderWidth: 2,
                    fill: true
                }]
            },
            options: {
                scales: {
                    y: {
                        beginAtZero: true
                    }
                },
                plugins: {
                    legend: {
                        display: true
                    }
                }
            }
        });
    </script>
</body>
</html>