Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
@syedajannatulferdous121
syedajannatulferdous121 authored Nov 7, 2024
1 parent 6265f7f commit 10d8f49
Show file tree
Hide file tree
Showing 6 changed files with 2,124 additions and 0 deletions.
363 changes: 363 additions & 0 deletions content/project/OUTLIER_DETECTION/OutliersAnalysis.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,363 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<title>MEDINYM</title>
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="" name="keywords">
<meta content="" name="description">

<!-- Favicon -->
<link href="img/favicon.ico" rel="icon">

<!-- Google Web Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Heebo:wght@400;500;600&family=Inter:wght@700;800&display=swap" rel="stylesheet">

<!-- Icon Font Stylesheet -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css" rel="stylesheet">

<!-- Libraries Stylesheet -->
<link href="lib/animate/animate.min.css" rel="stylesheet">
<link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">

<!-- Customized Bootstrap Stylesheet -->
<link href="css/bootstrap.min.css" rel="stylesheet">

<!-- Template Stylesheet -->
<link href="css/style.css" rel="stylesheet">
</head>

<body>
<div class="container-xxl bg-white p-0">
<!-- Spinner Start -->
<div id="spinner" class="show bg-white position-fixed translate-middle w-100 vh-100 top-50 start-50 d-flex align-items-center justify-content-center">
<div class="spinner-border text-primary" style="width: 3rem; height: 3rem;" role="status">
<span class="sr-only">Loading...</span>
</div>
</div>
<!-- Spinner End -->


<!-- Navbar Start -->
<nav class="navbar navbar-expand-lg bg-white navbar-light shadow sticky-top p-0">
<a href="index.html" class="navbar-brand d-flex align-items-center text-center py-0 px-4 px-lg-5">
<img src="img/sample 71.png" alt="Logo" class="me-2" style="height: 70px;">
</a>
<button type="button" class="navbar-toggler me-4" data-bs-toggle="collapse" data-bs-target="#navbarCollapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<div class="navbar-nav ms-auto p-4 p-lg-0">
<a href="index.html" class="nav-item nav-link">Home</a>
<a href="about.html" class="nav-item nav-link">About</a>

<div class="nav-item dropdown">
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false" id="servicesDropdown">
Services
</a>
<div class="dropdown-menu dropdown-menu-end p-3 shadow-lg rounded-3 animated fadeIn" aria-labelledby="servicesDropdown" style="min-width: 200px; overflow: hidden;">
<a href="OutliersAnalysis.html" class="dropdown-item enhanced-dropdown-item">
<i class="fa fa-chart-line me-2"></i> Outliers Analysis
</a>
<a href="De-identification.html" class="dropdown-item enhanced-dropdown-item">
<i class="fa fa-user-shield me-2"></i> De-identification
</a>
<a href="Anonymization.html" class="dropdown-item enhanced-dropdown-item">
<i class="fa fa-user-secret me-2"></i> Anonymization
</a>
</div>
</div>
<a href="contact.html" class="nav-item nav-link">Contact</a>
</div>
<a href="features.html" class="btn btn-primary rounded-0 py-4 px-lg-5 d-none d-lg-block">Upcoming Features<i class="fa fa-arrow-right ms-3"></i></a>
</div>
</nav>
<!-- Navbar End -->

<!-- Styles for Enhanced Navbar and Dropdown -->
<style>
/* Navbar Link Styles with Glow Effect */
.navbar-nav .nav-link {
color: #333;
font-weight: 500;
transition: color 0.3s ease, text-shadow 0.3s ease;
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
color: #00B074;
text-shadow: 0px 4px 8px rgba(0, 176, 116, 0.5);
}

/* Enhanced Dropdown Styles */
#servicesDropdown {
position: relative;
}
.dropdown-menu {
animation: enhancedFadeIn 0.3s ease-in-out forwards;
opacity: 0;
transform: scale(0.95);
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.2);
}
.show > .dropdown-menu {
opacity: 1;
transform: scale(1);
}
@keyframes enhancedFadeIn {
from {
opacity: 0;
transform: scale(0.95);
}
to {
opacity: 1;
transform: scale(1);
}
}

/* Enhanced Dropdown Item Styles */
.enhanced-dropdown-item {
display: flex;
align-items: center;
gap: 8px;
color: #333;
background: transparent;
transition: color 0.3s ease, background-color 0.3s ease;
font-weight: 500;
padding: 10px 15px;
border-radius: 8px;
position: relative;
}
.enhanced-dropdown-item::before {
content: "";
position: absolute;
width: 0;
height: 100%;
background: rgba(0, 176, 116, 0.2);
border-radius: 8px;
transition: width 0.3s ease;
z-index: -1;
}
.enhanced-dropdown-item:hover::before {
width: 100%;
}
.enhanced-dropdown-item:hover {
color: #00B074;
text-shadow: 0px 4px 8px rgba(0, 176, 116, 0.5);
}

/* Icons */
.enhanced-dropdown-item i {
color: #00B074;
transition: color 0.3s ease;
}
.enhanced-dropdown-item:hover i {
color: #028a5e;
}
</style>

<!-- Header End -->
<div class="container-xxl py-5 bg-dark page-header mb-5">
<div class="container my-5 pt-5 pb-4">
<h1 class="display-3 text-white mb-3 animated slideInDown">Outliers Analysis</h1>
<nav aria-label="breadcrumb">
<ol class="breadcrumb text-uppercase">
<li class="breadcrumb-item"><a href="index.html">Home</a></li>
<li class="breadcrumb-item"><a href="#">Services</a></li>
<li class="breadcrumb-item text-white active" aria-current="page">Outliers Analysis</li>
</ol>
</nav>
</div>
</div>
<!-- Header End -->


<!-- Outliers Analysis Start -->
<div class="container-xxl py-5 bg-dark text-light">
<div class="container">
<div class="row g-5 align-items-center">
<div class="col-lg-6 wow fadeInLeft" data-wow-delay="0.1s">
<div class="row g-0 about-bg rounded overflow-hidden shadow-lg">
<div class="col-6 text-start">
<img class="img-fluid w-100 rounded-start" src="img/gi1.jpg" alt="General Information Image 1">
</div>
<div class="col-6 text-start">
<img class="img-fluid rounded" src="img/gi2.jpg" style="width: 85%; margin-top: 15%;" alt="General Information Image 2">
</div>
<div class="col-6 text-end">
<img class="img-fluid rounded" src="img/gi4.jpg" style="width: 85%;" alt="General Information Image 3">
</div>
<div class="col-6 text-end">
<img class="img-fluid w-100 rounded-end" src="img/gi3.jpg" alt="General Information Image 4">
</div>
</div>
</div>
<div class="col-lg-6 wow fadeInRight" data-wow-delay="0.5s">
<h1 class="mb-4 display-4 text-primary text-uppercase" style="text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.6);">General Information</h1>
<p class="mb-4 fs-5 text-light" style="line-height: 1.8; font-weight: 300;">Outliers Analysis in the MEDINYM project involves backend processing of uploaded data, resulting in a structured table where each row represents a processed input document. This analytical tool offers users the capability to apply filters to the data, specifically highlighting the rarest terms present in each document and identifying documents containing such "rare" terms. By pinpointing outliers based on uncommon terms, this analysis assists in identifying unique patterns or anomalies within the dataset, ultimately contributing to a more comprehensive understanding of medical data and supporting informed decision-making in healthcare research and practice.</p>
</div>
</div>
</div>
</div>
<!-- Outliers Analysis End -->

<!-- Outliers Analysis Start -->
<div class="container-xxl py-5" style="background: #1a2a6c; background: linear-gradient(to right, #fdbb2d, #22c1c3); color: #fff;">
<div class="container-xxl py-5 bg-gradient">
<div class="container">
<div class="row g-5 align-items-center">
<div class="col-lg-6 wow fadeInLeft" data-wow-delay="0.5s">
<h1 class="mb-4 display-4 text-success text-uppercase" style="text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.4); ">Outliers Analysis</h1>
<p class="mb-4 fs-5 text-dark" style="line-height: 1.8; font-weight: 300;">Outliers Analysis in the MEDINYM project involves backend processing of uploaded data, resulting in a structured table where each row represents a processed input document. This analytical tool offers users the capability to apply filters to the data, specifically highlighting the rarest terms present in each document and identifying documents containing such "rare" terms. By pinpointing outliers based on uncommon terms, this analysis assists in identifying unique patterns or anomalies within the dataset, ultimately contributing to a more comprehensive understanding of medical data and supporting informed decision-making in healthcare research and practice.</p>
<div class="d-flex flex-column flex-md-row">
<a class="btn btn-outline-primary btn-lg py-3 px-5 mb-2 mb-md-0 me-md-2 animate__animated animate__pulse animate__infinite infinite" href="http://127.0.0.1:8086/" style="border-radius: 30px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); color: #fff; background: linear-gradient(45deg, #66CDAA, #00CED1); border-color: transparent;">Find Outlier Documents</a>
<a class="btn btn-outline-success btn-lg py-3 px-5 animate__animated animate__pulse animate__infinite infinite" href="http://127.0.0.1:8088/" style="border-radius: 30px; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); color: #fff; background: linear-gradient(45deg, #00B074, #90EE90); border-color: transparent;">Find Outlier Words</a>
</div>
</div>
<div class="col-lg-6 wow fadeInRight" data-wow-delay="0.1s">
<div class="row g-0 about-bg rounded overflow-hidden shadow-lg">
<div class="col-6 text-start">
<img class="img-fluid w-100 rounded-start" src="img/Outliers1.avif" alt="Outliers Image 1">
</div>
<div class="col-6 text-end">
<img class="img-fluid rounded" src="img/Outliers2.jpg" style="width: 100%; margin-top: 15%;" alt="Outliers Image 2">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Outliers Analysis End -->

<!-- Additional Styles and Animations -->
<style>
.bg-gradient {
background: linear-gradient(135deg, #71b7e6, #9b59b6);
color: white;
}
.wow {
visibility: hidden;
}
.animate__animated.animate__pulse.animate__infinite.infinite {
animation-duration: 1.5s;
}
.display-4 {
font-size: 2.5rem;
font-weight: bold;
letter-spacing: 2px;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
}
.shadow-lg {
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.btn-outline-primary, .btn-outline-success {
border-width: 2px;
border-radius: 50px;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
transition: all 0.3s ease-in-out;
}
.btn-lg {
font-size: 1.2rem;
transition: all 0.3s ease-in-out;
}
.btn-lg:hover {
transform: scale(1.05);
background-color: rgba(255, 255, 255, 0.1);
}
</style>

<!-- WOW.js Animation Library Initialization -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js"></script>
<script>
new WOW().init();
</script>




<!-- Footer Start -->
<div class="container-fluid bg-dark text-white-50 footer pt-5 mt-5 wow fadeIn" data-wow-delay="0.1s">
<div class="container py-5">
<div class="row g-5">
<div class="col-lg-3 col-md-6">
<h5 class="text-white mb-4">Company</h5>
<a class="btn btn-link text-white-50" href="">About Us</a>
<a class="btn btn-link text-white-50" href="">Contact Us</a>
<a class="btn btn-link text-white-50" href="">Our Services</a>
<a class="btn btn-link text-white-50" href="">Privacy Policy</a>
<a class="btn btn-link text-white-50" href="">Terms & Condition</a>
</div>
<div class="col-lg-3 col-md-6">
<h5 class="text-white mb-4">Quick Links</h5>
<a class="btn btn-link text-white-50" href="">About Us</a>
<a class="btn btn-link text-white-50" href="">Contact Us</a>
<a class="btn btn-link text-white-50" href="">Our Services</a>
<a class="btn btn-link text-white-50" href="">Privacy Policy</a>
<a class="btn btn-link text-white-50" href="">Terms & Condition</a>
</div>
<div class="col-lg-3 col-md-6">
<h5 class="text-white mb-4">Contact</h5>
<p class="mb-2"><i class="fa fa-map-marker-alt me-3"></i>123 Street, Berlin, Germany</p>
<p class="mb-2"><i class="fa fa-phone-alt me-3"></i>+49 111 1111111</p>
<p class="mb-2"><i class="fa fa-envelope me-3"></i>[email protected]</p>
<div class="d-flex pt-2">
<a class="btn btn-outline-light btn-social" href=""><i class="fab fa-twitter"></i></a>
<a class="btn btn-outline-light btn-social" href=""><i class="fab fa-facebook-f"></i></a>
<a class="btn btn-outline-light btn-social" href=""><i class="fab fa-youtube"></i></a>
<a class="btn btn-outline-light btn-social" href=""><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
<div class="col-lg-3 col-md-6">
<h5 class="text-white mb-4">Newsletter</h5>
<p>Stay Protected, Stay Informed: Join Our Newsletter!</p>
<div class="position-relative mx-auto" style="max-width: 400px;">
<input class="form-control bg-transparent w-100 py-3 ps-4 pe-5" type="text" placeholder="Your email">
<button type="button" class="btn btn-primary py-2 position-absolute top-0 end-0 mt-2 me-2">SignUp</button>
</div>
</div>
</div>
</div>
<div class="container">
<div class="copyright">
<div class="row">
<div class="col-md-6 text-center text-md-start mb-3 mb-md-0">
&copy; <a class="border-bottom" href="index.html">MEDINYM</a>, All Right Reserved.


Designed By <a class="border-bottom" href="https://www.dfki.de/web">DFKI</a>
</div>
<div class="col-md-6 text-center text-md-end">
<div class="footer-menu">
<a href="">Home</a>
<a href="">Cookies</a>
<a href="">Help</a>
<a href="">FQAs</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Footer End -->


<!-- Back to Top -->
<a href="#" class="btn btn-lg btn-primary btn-lg-square back-to-top"><i class="bi bi-arrow-up"></i></a>
</div>

<!-- JavaScript Libraries -->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<script src="lib/wow/wow.min.js"></script>
<script src="lib/easing/easing.min.js"></script>
<script src="lib/waypoints/waypoints.min.js"></script>
<script src="lib/owlcarousel/owl.carousel.min.js"></script>

<!-- Template Javascript -->
<script src="js/main.js"></script>
</body>

</html>
Loading

0 comments on commit 10d8f49

Please sign in to comment.