denicaturkusumaw
/
TIF_E41201756
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
TIF_E41201756/templates/index.html

441 lines
17 KiB
HTML
Raw Blame History

<!--
=========================================================
* Soft UI Design System - v1.0.9
=========================================================
* Product Page: https://www.creative-tim.com/product/soft-ui-design-system
* Copyright 2023 Creative Tim (https://www.creative-tim.com)
* Coded by www.creative-tim.com
=========================================================
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. -->
<!DOCTYPE html>
<html lang="en" itemscope itemtype="http://schema.org/WebPage">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="apple-touch-icon" sizes="76x76" href="./static/assets/home/img/apple-icon.png">
<link rel="icon" type="image/png" href="./static/assets/home/img/favicon.png">
<title>
Essential Thrombocythemia Detection System
</title>
<!-- Fonts and icons -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" rel="stylesheet" />
<!-- Nucleo Icons -->
<link href="./static/assets/home/css/nucleo-icons.css" rel="stylesheet" />
<link href="./static/assets/home/css/nucleo-svg.css" rel="stylesheet" />
<!-- Font Awesome Icons -->
<script src="https://kit.fontawesome.com/42d5adcbca.js" crossorigin="anonymous"></script>
<link href="./static/assets/home/css/nucleo-svg.css" rel="stylesheet" />
<!-- CSS Files -->
<link id="pagestyle" href="./static/assets/home/css/soft-design-system.css?v=1.0.9" rel="stylesheet" />
<!-- Nepcha Analytics (nepcha.com) -->
<!-- Nepcha is a easy-to-use web analytics. No cookies and fully compliant with GDPR, CCPA and PECR. -->
<script defer data-site="YOUR_DOMAIN_HERE" src="https://api.nepcha.com/js/nepcha-analytics.js"></script>
</head>
<body class="index-page">
<!-- Navbar Light -->
<nav
class="navbar navbar-expand-lg navbar-light bg-white z-index-3 py-3">
<div class="container">
<a class="navbar-brand" rel="tooltip" title="" data-placement="bottom" target="_blank">
Essential Thrombocythemia
</a>
<!-- <a href="https://www.creative-tim.com/product/soft-ui-design-system-pro#pricingCard" class="btn btn-sm bg-gradient-primary btn-round mb-0 ms-auto d-lg-none d-block">Start Nowm</a> -->
<button class="navbar-toggler shadow-none ms-2" type="button" data-bs-toggle="collapse" data-bs-target="#navigation" aria-controls="navigation" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon mt-2">
<span class="navbar-toggler-bar bar1"></span>
<span class="navbar-toggler-bar bar2"></span>
<span class="navbar-toggler-bar bar3"></span>
</span>
</button>
<div class="collapse navbar-collapse w-100 pt-3 pb-2 py-lg-0" id="navigation">
<ul class="navbar-nav navbar-nav-hover mx-auto">
<li class="nav-item mx-2">
<a class="nav-link ps-2 d-flex justify-content-between cursor-pointer align-items-center" role="button" href="#home">
Home
<!-- <img src="../../static/assets/home/img/down-arrow-dark.svg" alt="down-arrow" class="nav-link"> -->
</a>
</li>
<li class="nav-item mx-2">
<a class="nav-link ps-2 d-flex justify-content-between cursor-pointer align-items-center" role="button" href="#feature">
Feature
<!-- <img src="../../static/assets/home/img/down-arrow-dark.svg" alt="down-arrow" class="arrow ms-1"> -->
</a>
</li>
<li class="nav-item mx-2">
<a class="nav-link ps-2 d-flex justify-content-between cursor-pointer align-items-center" role="button" href="#about">
About
<!-- <img src="../../static/assets/home/img/down-arrow-dark.svg" alt="down-arrow" class="arrow ms-1"> -->
</a>
</li>
<li class="nav-item mx-2">
<a class="nav-link ps-2 d-flex justify-content-between cursor-pointer align-items-center" role="button" href="#contact">
Contact
<!-- <img src="../../static/assets/home/img/down-arrow-dark.svg" alt="down-arrow" class="arrow ms-1"> -->
</a>
</li>
</ul>
<ul class="navbar-nav d-lg-block d-none">
<li class="nav-item">
<a href="/classification" class="btn btn-sm bg-gradient-primary btn-round mb-0 me-1 ftco-animate" role="button">Start Now</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- End Navbar -->
</div></div></div>
<!--header-->
<header class="header-2" id="home">
<div class="page-header min-vh-75 relative" style="background-image: url('./static/assets/home/img/bg/blood.jpg')">
<span class="mask bg-gradient-primary"></span>
<div class="container">
<div class="row">
<div class="col-lg-7 text-center mx-auto">
<h1 class="text-white pt-3 mt-n5">Essential Thrombocythemia Detection Disease</h1>
<p class="lead text-white mt-3">Empowering Pathologists with Advanced <br/> Image Based Diagnostics </p>
<div class="row">
<div class="col-lg-7 align-items-center mx-auto">
<a href="/classification" class="btn btn-sm bg-gradient-dark btn-round mb-0 me-1" role="button">Get Started</a>
</div>
</div>
</div>
</div>
</div>
<div class="position-absolute w-100 z-index-1 bottom-0">
<svg class="waves" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 40" preserveAspectRatio="none" shape-rendering="auto">
<defs>
<path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z" />
</defs>
<g class="moving-waves">
<use xlink:href="#gentle-wave" x="48" y="-1" fill="rgba(255,255,255,0.40" />
<use xlink:href="#gentle-wave" x="48" y="3" fill="rgba(255,255,255,0.35)" />
<use xlink:href="#gentle-wave" x="48" y="5" fill="rgba(255,255,255,0.25)" />
<use xlink:href="#gentle-wave" x="48" y="8" fill="rgba(255,255,255,0.20)" />
<use xlink:href="#gentle-wave" x="48" y="13" fill="rgba(255,255,255,0.15)" />
<use xlink:href="#gentle-wave" x="48" y="16" fill="rgba(255,255,255,0.95" />
</g>
</svg>
</div>
</div>
</header>
<div></div>
<!-- End header-->
<!-- -------- START Features w/ title and 3 infos -------- -->
<section class="py-6 pt-7" id="feature">
<div class="container">
<div class="row">
<div class="col-lg-6 mx-auto text-center pb-4">
<!-- <h4 class="text-gradient text-primary">Social Analytics</h4> -->
<h2 class="text-gradient text-primary">Our Feature</h2>
<p class="lead">Menyediakan fitur identifikasi terkait abnormalitas sel darah melalui deteksi gambar masukkan yang menghasilkan prediksi </p>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-6">
<div class="p-3 text-center">
<div class="icon icon-shape bg-gradient-primary shadow mx-auto">
<i class="ni ni-single-02"></i>
</div>
<h5 class="mt-4">Image Detection</h5>
<p>pengguna dapat melakukan identifikasi menggunakan data gambar(gambar hasil pemeriksaan sel darah) dengan format jpg/jpeg</p>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="p-3 text-center">
<div class="icon icon-shape bg-gradient-info shadow mx-auto">
<i class="ni ni-email-83"></i>
</div>
<h5 class="mt-4">Result</h5>
<p>Hasil identifikasi berupa hasil prediksi dengan tingkat akurasi, probabilitas terdekat dan penjelasan mengenai hasil deteksi</p>
</div>
</div>
<div class="col-lg-4 col-md-6 mx-md-auto">
<div class="p-3 text-center">
<div class="icon icon-shape bg-gradient-warning shadow mx-auto">
<i class="ni ni-atom"></i>
</div>
<h5 class="mt-4">Unlimited to Use</h5>
<p>Tidak ada batasan penggunaan sistem deteksi ini, sehingga pengguna akan lebih terbantu</p>
</div>
</div>
</div>
</div>
</section>
<!-- -------- END Features w/ title and 3 infos -------- -->
<!-- About Us-->
<section class="my-5 py-5" id="about">
<div class="container">
<div class="row">
<div class="row justify-content-center text-center my-sm-5">
<div class="col-lg-6">
<h2 class="text-dark mb-0">About Us</h2>
<h4 class="text-primary text-gradient">Essential Thrombocythemia Detection Disease</h4>
<p class="lead">Kami menyediakan sistem identifikasi abnormalitas sel darah dalam hal ini Trombosit, melalui gambar hasil pemeriksaan darah lengkap (citra mikroskopis)
dengan tujuan untuk mengetahui apakah sel tersebut termasuk dalam Trombosit Normal, Giant Trombosit atau Leukosit. </p>
</div>
</div>
</div>
</div>
</section>
<!-- End of About Us-->
<!-- Footer-->
<footer class="footer pt-5 mt-5" id="contact">
<hr class="horizontal dark mb-5">
<div class="container">
<div class=" row">
<div class="col-md-3 mb-4 ms-auto">
<div>
<h6 class="text-gradient text-primary font-weight-bolder">ET Detection Disease</h6>
</div>
<div>
<h6 class="mt-3 mb-2 opacity-8">Social</h6>
<ul class="d-flex flex-row ms-n3 nav">
<li class="nav-item">
<a class="nav-link pe-1" href="https://www.facebook.com/CreativeTim/" target="_blank">
<i class="fab fa-facebook text-lg opacity-8"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link pe-1" href="https://twitter.com/creativetim" target="_blank">
<i class="fab fa-twitter text-lg opacity-8"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link pe-1" href="https://dribbble.com/creativetim" target="_blank">
<i class="fab fa-dribbble text-lg opacity-8"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link pe-1" href="https://github.com/creativetimofficial" target="_blank">
<i class="fab fa-github text-lg opacity-8"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link pe-1" href="https://www.youtube.com/channel/UCVyTG4sCw-rOvB9oHkzZD1w" target="_blank">
<i class="fab fa-youtube text-lg opacity-8"></i>
</a>
</li>
</ul>
</div>
</div>
<div class="col-md-2 col-sm-6 col-6 mb-4">
<div>
<h6 class="text-gradient text-primary text-sm">Company</h6>
<ul class="flex-column ms-n3 nav">
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/presentation" target="_blank">
About Us
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/templates/free" target="_blank">
Freebies
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/templates/premium" target="_blank">
Premium Tools
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/blog" target="_blank">
Blog
</a>
</li>
</ul>
</div>
</div>
<div class="col-md-2 col-sm-6 col-6 mb-4">
<div>
<h6 class="text-gradient text-primary text-sm">Resources</h6>
<ul class="flex-column ms-n3 nav">
<li class="nav-item">
<a class="nav-link" href="https://iradesign.io/" target="_blank">
Illustrations
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/bits" target="_blank">
Bits & Snippets
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/affiliates/new" target="_blank">
Affiliate Program
</a>
</li>
</ul>
</div>
</div>
<div class="col-md-2 col-sm-6 col-6 mb-4">
<div>
<h6 class="text-gradient text-primary text-sm">Help & Support</h6>
<ul class="flex-column ms-n3 nav">
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/contact-us" target="_blank">
Contact Us
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/knowledge-center" target="_blank">
Knowledge Center
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://services.creative-tim.com/?ref=ct-soft-ui-footer" target="_blank">
Custom Development
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/sponsorships" target="_blank">
Sponsorships
</a>
</li>
</ul>
</div>
</div>
<div class="col-md-2 col-sm-6 col-6 mb-4 me-auto">
<div>
<h6 class="text-gradient text-primary text-sm">Legal</h6>
<ul class="flex-column ms-n3 nav">
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/terms" target="_blank">
Terms &amp; Conditions
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/privacy" target="_blank">
Privacy Policy
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.creative-tim.com/license" target="_blank">
Licenses (EULA)
</a>
</li>
</ul>
</div>
</div>
<div class="col-12">
<div class="text-center">
<p class="my-4 text-sm">
All rights reserved. Copyright © <script>document.write(new Date().getFullYear())</script> Soft UI Design System by <a href="https://www.creative-tim.com" target="_blank">Creative Tim</a>.
</p>
</div>
</div>
</div>
</div>
</footer>
<!-- End Footer-->
<!-- Core JS Files -->
<script src="./static/assets/home/js/core/popper.min.js" type="text/javascript"></script>
<script src="./static/assets/home/js/core/bootstrap.min.js" type="text/javascript"></script>
<script src="./static/assets/home/js/plugins/perfect-scrollbar.min.js"></script>
<!-- Plugin for TypedJS, full documentation here: https://github.com/inorganik/CountUp.js -->
<script src="./static/assets/home/js/plugins/countup.min.js"></script>
<script src="./static/assets/home/js/plugins/choices.min.js"></script>
<script src="./static/assets/home/js/plugins/prism.min.js"></script>
<script src="./static/assets/home/js/plugins/highlight.min.js"></script>
<!-- Plugin for Parallax, full documentation here: https://github.com/dixonandmoe/rellax -->
<script src="./static/assets/home/js/plugins/rellax.min.js"></script>
<!-- Plugin for TiltJS, full documentation here: https://gijsroge.github.io/tilt.js/ -->
<script src="./static/assets/home/js/plugins/tilt.min.js"></script>
<!-- Plugin for Selectpicker - ChoicesJS, full documentation here: https://github.com/jshjohnson/Choices -->
<script src="./static/assets/home/js/plugins/choices.min.js"></script>
<!-- Plugin for Parallax, full documentation here: https://github.com/wagerfield/parallax -->
<script src="./static/assets/home/js/plugins/parallax.min.js"></script>
<!-- Control Center for Soft UI Kit: parallax effects, scripts for the example pages etc -->
<!-- Google Maps Plugin -->
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDTTfWur0PDbZWPr7Pmq8K3jiDp0_xUziI"></script>
<script src="./static/assets/home/js/soft-design-system.min.js?v=1.0.9" type="text/javascript"></script>
<script type="text/javascript">
if (document.getElementById('state1')) {
const countUp = new CountUp('state1', document.getElementById("state1").getAttribute("countTo"));
if (!countUp.error) {
countUp.start();
} else {
console.error(countUp.error);
}
}
if (document.getElementById('state2')) {
const countUp1 = new CountUp('state2', document.getElementById("state2").getAttribute("countTo"));
if (!countUp1.error) {
countUp1.start();
} else {
console.error(countUp1.error);
}
}
if (document.getElementById('state3')) {
const countUp2 = new CountUp('state3', document.getElementById("state3").getAttribute("countTo"));
if (!countUp2.error) {
countUp2.start();
} else {
console.error(countUp2.error);
};
}
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink