Skip to content

Commit

Permalink
Create leaderboard.html
Browse files Browse the repository at this point in the history
  • Loading branch information
@nwoyecid
nwoyecid authored Aug 23, 2024
1 parent bacdac5 commit 3f8bfcc
Showing 1 changed file with 274 additions and 0 deletions.
274 changes: 274 additions & 0 deletions leaderboard.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,274 @@
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="utf-8">
<!-- Meta tags for social media banners, these should be filled in appropriatly as they are your "business card" -->
<!-- Replace the content tag with appropriate information -->
<meta name="description" content="Endogen">
<meta property="og:title" content="Endogen"/>
<meta property="og:description" content="Endogen"/>
<meta property="og:url" content="https://camma-public.github.io/surgicalimagen"/>


<meta name="twitter:title" content="Endogen">
<meta name="twitter:description" content="Endogen">
<meta name="keywords" content="Endogen">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">


<title>Surgical Text-To-Image Generation</title>
<link rel="icon" type="image/x-icon" href="static/images/favicon.ico">
<link href="https://fonts.googleapis.com/css?family=Google+Sans|Noto+Sans|Castoro"
rel="stylesheet">

<link rel="stylesheet" href="static/css/bulma.min.css">
<link rel="stylesheet" href="static/css/bulma-carousel.min.css">
<link rel="stylesheet" href="static/css/bulma-slider.min.css">
<link rel="stylesheet" href="static/css/fontawesome.all.min.css">
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/jpswalsh/academicons@1/css/academicons.min.css">
<link rel="stylesheet" href="static/css/index.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/core/index.min.css"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://documentcloud.adobe.com/view-sdk/main.js"></script>
<script defer src="static/js/fontawesome.all.min.js"></script>
<script src="static/js/bulma-carousel.min.js"></script>
<script src="static/js/bulma-slider.min.js"></script>
<script src="static/js/index.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three/build/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/core/index.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/tabletop.js/1.5.1/tabletop.min.js"></script>
<title>Endogene Leaderboard</title>

<style>
#more_example {
margin-top: 50px;
width: 80rem;
max-width: 80vw;
border: none;
outline: none;
cursor: pointer;
font-size: 2rem;
color: white;
background-image: url('./static/images/overall.gif');
background-size: cover;
padding-top: 12.25%;
padding-bottom: 12.25%
}

.navbar {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #333;
position: fixed; /* Fixed positioning */
top: 0; /* Stick to the top */
width: 100%; /* Full width */
z-index: 1000; /* Make sure it stays on top of other content */
}

.navbar a, .navbar h1 {
color: white;
text-decoration: none;
padding: 14px 20px;
}

.navbar h1 {
margin: 0;
padding-left: 8px;
}

.navbar-right {
display: flex;
}

.hover-underline-animation {
display: inline-block;
position: relative;
color: #0087ca;
}

.hover-underline-animation::after {
content: '';
position: absolute;
width: 100%;
transform: scaleX(0);
height: 2px;
bottom: 0;
left: 0;
background-color: #0087ca;
transform-origin: bottom right;
transition: transform 0.25s ease-out;
}

.hover-underline-animation:hover::after {
transform: scaleX(1);
transform-origin: bottom left;
}

.team-section {
background: #fff;
text-align: center;
padding: 20px;
}

.team-section h2 {
font-size: 2em;
}

.member-container {
display: flex;
justify-content: center;
flex-wrap: wrap;
padding: 10px;
}

.member {
flex: 0 0 30%; /* each member will take up 30% of the container width */
margin: 10px;
box-sizing: border-box;
}

.member img {
border-radius: 50%; /* Makes the images round */
width: 100px; /* Adjust as needed */
height: 100px; /* Adjust as needed */
margin-bottom: 10px;
display: block; /* Center image in its container */
margin-left: auto;
margin-right: auto;
}

.member p {
margin: 5px 0;
}

.logos {
margin-top: 20px;
}

.logos img {
height: 40px; /* Adjust as needed */
margin: 0 10px;
vertical-align: middle;
}

@keyframes rotate3D {
0% {
transform: perspective(500px) rotateY(0deg);
}
100% {
transform: perspective(500px) rotateY(360deg);
}
}

.rotating-text-3d {
display: inline-block;
/*animation: rotate3D 5s linear infinite;*/
}


</style>
</head>


<body>


<div class="navbar" width="100%">
<a style="font-size: 2rem"
href="index.html">
<div class="rotating-text-3d"><b><i>Endogen</i></b></div>
</a>
<div class="navbar-right">
<a href="index.html#example" class="hover-underline-animation">Samples</a>
<a href="index.html#survey" class="hover-underline-animation">Survey</a>
<a href="index.html#team" class="hover-underline-animation">Team</a>
</div>
</div>


<section class="hero" style="padding-top: 100px">
<div class="hero-body">
<div class="container is-max-desktop">
<div class="columns is-centered">
<div class="column has-text-centered">
<div class="content">
<h1 align="center">Leaderboard</h1> <br />
</div>

<div align="center" style="width:100%">
<br /> <hr />
<iframe align="center" width="1200" height="500" seamless frameborder="0" scrolling="no" src="https://docs.google.com/spreadsheets/d/e/2PACX-1vR4v5xTrjIqKHdbrpb_-9Y6oVHQ8OTl8DMVk010JuAdBABfj0dB604OVdqPlaPbKDR8nKI3CFcdb-0N/pubchart?oid=732103762&amp;format=interactive"></iframe>
</div>

</div>

</div>
<p>Not satisfied with your score? Can you beat the top score? Take the study again <a href="https://camma-public.github.io/endogen/surgical-imagen/survey" style="color:blue">here !</a> It is allowed...</p>
</div>
</div>
</section>

<footer class="footer" id="team">
<div class="container">
<div class="columns is-centered">
<div class="column is-8">
<div class="content">

<h2 class="title is-3"></h2>
<div class="member-container">


<div class="logos" style="padding-bottom: 50px; padding-top: 50px">
<!-- Repeat for each logo -->
<a href="https://camma.unistra.fr/"><img src="static/images/camma.png" alt="CAMMA"/></a>

<a href="https://www.ihu-strasbourg.eu/"><img src="static/images/ihu.png" alt="IHU"/></a>
<a href="https://en.unistra.fr/"><img src="static/images/unistra.png" alt="Unistra"/></a>

<!-- Repeat for other logos -->
</div>
</div>


<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/"><img
alt="Creative Commons License" style="border-width:0"
src="https://i.creativecommons.org/l/by-nc-sa/4.0/88x31.png"/></a><br/>This work is licensed
under a <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">Creative Commons
Attribution-NonCommercial-ShareAlike 4.0 International License</a>.
<br>
<br>

<p>
This page was built using the <a
href="https://github.com/eliahuhorwitz/Academic-project-page-template" target="_blank">Academic
Project Page Template</a>.
<!-- You are free to borrow the of this website, we just ask that you link back to this page in the-->
<!-- footer. <br> This website is licensed under a <a rel="license"-->
<!-- href="http://creativecommons.org/licenses/by-sa/4.0/"-->
<!-- target="_blank">Creative-->
<!-- Commons Attribution-ShareAlike 4.0 International License</a>.-->
</p>

</div>


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


</footer>

<!-- Statcounter tracking code -->

<!-- You can add a tracker to track page visits by creating an account at statcounter.com -->

<!-- End of Statcounter Code -->

</body>
</html>

0 comments on commit 3f8bfcc

Please sign in to comment.