Spaces:
Running
Running
File size: 4,258 Bytes
04f52eb 7f4c230 04f52eb 8b465d7 7f4c230 04f52eb 8b465d7 04f52eb 8ba08fb 04f52eb 8ba08fb 04f52eb 8ba08fb 04f52eb 16e0078 04f52eb b71a4c2 04f52eb 70cfac3 04f52eb f43e31f 70cfac3 f43e31f 04f52eb 70cfac3 04f52eb f43e31f 70cfac3 f43e31f f240807 c12a5b3 e2e7cb5 f240807 0a00b44 83cc493 0a00b44 b40b27f 0a00b44 dc7ddf0 9621361 dc7ddf0 0a00b44 04f52eb 7f4c230 8ba08fb 04f52eb fd3e71a e3067b8 fd3e71a 093deba acecba6 fd3e71a 31b8d5d f240807 7412a34 834f640 04f52eb 7a8934e 0a00b44 621a743 fd3e71a 04f52eb |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<title>Welcome to My AI Projects</title>
<style>
body {
font-family: 'Roboto', sans-serif;
margin: 0;
padding: 0;
background-color: #f0f0f0;
}
.header {
background-color: #007bff;
color: white;
padding: 20px;
text-align: center;
border-bottom: 5px solid #0056b3;
}
.header a {
color: #ff9900;
}
.container {
max-width: 1100px;
margin: auto;
padding: auto;
}
.card {
border-radius: 15px;
margin-bottom: 20px;
border: none;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1);
transition: all 0.3s ease;
}
.card:hover {
box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.5);
transform: scale(1.03);
}
.card .btn {
border-radius: 15px;
background-color: #007bff;
color: white;
transition: all 0.3s ease;
}
.card .btn:hover {
box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.5);
background-color: #0056b3;
}
.tab-pane {
height: auto;
overflow: auto;
}
.tab-pane iframe {
width: 100%;
height: 100%;
}
footer {
background-color: #343a40;
color: #fff;
text-align: center;
padding: 10px;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
font-size: 1em;
opacity: 0.6;
transition: opacity 0.5s ease-in-out;
}
footer:hover {
opacity: 1;
}
</style>
</head>
<body>
<header class="header">
<h1 class="title">Welcome to My AI Projects <span class="subtitle">(Stay tuned for exciting updates!)</span></h1>
<p>This is an introductory website, aimed at helping more people use AI. If there is any website that is not working, please <a href="https://huggingface.co/spaces/ngoctuanai/project/discussions" target="_blank">contact me</a>.</p>
</header>
<div class="container">
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="ai-chat-tab" data-toggle="tab" href="#ai-chat" role="tab" aria-controls="ai-chat" aria-selected="true">AI Chat</a>
</li>
<li class="nav-item">
<a class="nav-link" id="ai-drawing-tab" data-toggle="tab" href="#ai-drawing" role="tab" aria-controls="ai-drawing" aria-selected="false">AI Drawing (Coming Soon)</a>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="ai-chat" role="tabpanel" aria-labelledby="ai-chat-tab">
<iframe src="ai-chat.html" frameborder="0" style="width:100%; height:100%;"></iframe>
</div>
<div class="tab-pane fade" id="ai-drawing" role="tabpanel" aria-labelledby="ai-drawing-tab">
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="ai-drawing" role="tabpanel" aria-labelledby="ai-drawing-tab">
<iframe src="ai-drawing.html" frameborder="0" style="width:100%; height:100%;"></iframe>
</div>
<div class="tab-pane fade" id="ai-drawing" role="tabpanel" aria-labelledby="ai-drawing-tab">
</div>
</div>
</div>
<footer>
* 2024 ngoctuanai *
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</body>
</html> |