katara / static /index.html
Daniel Marques
feat: add prompt template
fe4b5f1
raw
history blame
No virus
5.17 kB
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- Bootstrap CSS -->
<link rel="icon" type="image" href="static\social_icons\favicon.png" />
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
crossorigin="anonymous"
/>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
crossorigin="anonymous"
></script>
<title>localGPT</title>
</head>
<style>
@import url("https://fonts.googleapis.com/css2?family=Play:wght@400;700&display=swap");
body {
background-image: linear-gradient(90deg, #09203f, #0057ff);
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
}
.container {
padding: 15px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
max-width: 1000px;
margin: 0 auto;
}
.titlegpt {
font-size: 9vw;
color: white;
font-family: "Play", sans-serif;
}
.search {
width: 100%;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),
0 0 8px rgba(255, 0, 0, 0.6);
background-color: #fff;
padding: 4px;
border-radius: 5px;
}
::placeholder {
color: rgb(110, 104, 104);
opacity: 1;
}
.search-2 {
position: relative;
width: 100%;
}
.search-2 input {
height: 45px;
border: none;
width: 100%;
padding-left: 100px;
padding-right: 200px;
}
.search-2 input:focus {
border-color: none;
box-shadow: none;
outline: none;
}
.search-2 i {
position: absolute;
top: 12px;
left: -10px;
font-size: 24px;
color: #eee;
}
.search-2 button {
position: absolute;
right: 100px;
top: 0px;
border: none;
height: 45px;
background-color: #ff0059;
color: #fff;
width: 90px;
border-radius: 4px;
}
.search-2 button:hover {
background: #ff0059;
color: #ffffff;
transition: all 0.2s ease;
cursor: pointer;
}
.search-2 .upload_button {
position: absolute;
right: 1px;
top: 0px;
border: none;
height: 45px;
background-color: #ff0059;
color: #fff;
width: 90px;
border-radius: 4px;
}
.cancel_button {
border: none;
height: 45px;
background-color: gray;
color: #fff;
width: 90px;
border-radius: 4px;
}
.cancel_button:hover {
background: rgb(114, 113, 113);
color: #ffffff;
transition: all 0.2s ease;
cursor: pointer;
}
.default_button {
border: none;
height: 45px;
background-color: #ff0059;
color: #fff;
width: 90px;
border-radius: 4px;
}
.default_button:hover {
background: #ff0059;
color: #ffffff;
transition: all 0.2s ease;
cursor: pointer;
}
.upload_button:hover {
background: #ff0059;
color: #ffffff;
transition: all 0.2s ease;
cursor: pointer;
}
.search-2 .tutorial_button {
position: absolute;
left: 1px;
top: 0px;
border: none;
height: 45px;
background-color: #ff0059;
color: #fff;
width: 90px;
border-radius: 4px;
}
.tutorial_button:hover {
background: #ff0059;
color: #ffffff;
transition: all 0.2s ease;
cursor: pointer;
}
.form-control:focus {
border-color: #bc13cf;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),
0 0 8px rgba(255, 0, 0, 0.6);
}
@media (max-width: 800px) {
.search-2 i {
left: 4px;
}
.search-2 input {
padding-left: 34px;
}
.search-2 button {
height: 37px;
top: 5px;
}
.search-2 .tutorial_button {
height: 37px;
top: 5px;
}
.search-2 .upload_button {
height: 37px;
top: 5px;
}
.search-2 input {
height: 45px;
border: none;
width: 100%;
padding-left: 100px;
padding-right: 200px;
}
.default_button {
height: 37px;
}
.cancel_button {
height: 37px;
}
}
.accordion-button:focus {
z-index: 3;
border-color: #ff0059;
box-shadow: 0 0 0 0.25rem rgba(153, 50, 168, 0.25);
}
.accordion-button:not(.collapsed) {
color: #ff0059;
background-color: #f5b3cb;
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.125);
}
</style>
<body>
<div class="container">
<div class="titlegpt">KARATA LLA</div>
</div>
</body>
</html>