warning-cutoff / index.html
rguo123's picture
Update index.html
75fad33
raw
history blame
1.58 kB
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>OBELICS Interactive Map</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
display: flex;
flex-direction: column; /* This will stack the children vertically */
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
padding: 0;
color: #333;
}
.iframe-container {
border: 1px solid #ccc;
border-radius: 10px;
overflow: hidden;
width: 80%;
height: 80%;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
iframe {
width: 100%;
height: 100%;
border: none;
}
body > p {
width: 80%;
text-align: center;
margin-bottom: 20px; /* Add some space between the paragraph and the iframe container */
}
</style>
</head>
<body>
<p>This is an embedded interactive visualization of (a subset of) <a href="https://huggingface.co/datasets/HuggingFaceM4/OBELICS" target="_blank">OBELICS</a> powered by <a href="https://home.nomic.ai/" target="_blank">Nomic AI</a>. You will find the original map <a href="https://atlas.nomic.ai/map/f2fba2aa-3647-4f49-a0f3-9347daeee499/ee4a84bd-f125-4bcc-a683-1b4e231cb10f" target="_blank">here</a>.</p>
<div class="iframe-container">
<iframe src="https://atlas.nomic.ai/map/f2fba2aa-3647-4f49-a0f3-9347daeee499/ee4a84bd-f125-4bcc-a683-1b4e231cb10f" allow="clipboard-read; clipboard-write"
title="Nomic Atlas"></iframe>
</div>
</body>
</html>