Skip to content
Snippets Groups Projects
Commit ebac0096 authored by Ludwig Forsberg's avatar Ludwig Forsberg
Browse files

Added website

parent b5eaebbc
No related branches found
No related tags found
No related merge requests found
*__pycache__
\ No newline at end of file
body {
background-color: black;
}
* {
margin: 0;
color: white;
font-family: 'Inter', sans-serif;
}
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-database" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="white" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<ellipse cx="12" cy="6" rx="8" ry="3"></ellipse>
<path d="M4 6v6a8 3 0 0 0 16 0v-6"></path>
<path d="M4 12v6a8 3 0 0 0 16 0v-6"></path>
</svg>
\ No newline at end of file
<!DOCTYPE html>
<title>NL to SparQL</title>
<head>
<link
rel="stylesheet"
href="{{ url_for('static', filename='css/style.css') }}"
/>
<link
href="https://fonts.googleapis.com/css2?family=Dancing+Script:wght@500&family=Noto+Sans&family=Orbitron&display=swap"
rel="stylesheet"
/>
<link rel="icon" href="{{ url_for('static', filename='database.svg') }}" type="image/svg+xml">
</head>
<body>
<h1 class="header">
<span class="span1">Natural Language</span><span class="span2">to</span
><span class="span3">SparQL</span>
</h1>
<div class="container">
<div class="indata">
<div class="wrapper">
<input
id="input"
class="input"
placeholder="Enter a question"
type="text"
/>
<span class="underline"></span>
</div>
<button onclick="ask()">Ask</button>
</div>
<div class="output">
<span id="answer_label" class="label"></span>
<ul id="answer_list"></ul>
</div>
</div>
</body>
<script>
function ask() {
let answer_label = document.getElementById("answer_label");
answer_label.innerHTML = "";
let answer_list = document.getElementById("answer_list");
answer_list.innerHTML = "";
let input = document.getElementById("input");
let question = input.value;
input.value = "";
fetch("/ask", {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json",
},
body: JSON.stringify({ question: question }),
})
.then((response) => response.json())
.then((response) => {
answer_label.innerHTML = `Answer:`;
response.forEach((answer) => {
var li = document.createElement("li");
li.appendChild(document.createTextNode(answer));
answer_list.appendChild(li);
});
});
}
</script>
<style>
body {
width: 100%;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
}
.container {
flex: 1;
display: flex;
flex-direction: column;
gap: 2rem;
margin-top: 2rem;
}
.wrapper {
display: flex;
flex-direction: column;
align-items: stretch;
flex: 1;
}
.label {
font-size: 2rem;
}
.input {
background-color: transparent;
border: none;
border-bottom: 2px solid #555;
font-size: 2rem;
outline: none;
}
.underline {
border-bottom: 2px solid white;
width: 0;
margin: -2px auto 0 auto;
transition: all 0.2s ease-in;
}
input:focus ~ .underline {
width: 100%;
}
.indata {
display: flex;
gap: 1rem;
align-items: center;
}
button {
background-color: transparent;
transition: all 0.2s ease-out;
color: #ccc;
padding: 0.5rem;
font-size: 1.5rem;
border-radius: 0.2rem;
}
button:hover {
background-color: white;
color: black;
}
button:active {
transform: translateY(10%);
}
ul {
list-style-type: none;
padding: 0;
}
li {
padding: 0.5rem 0;
font-size: 1.25rem;
border-bottom: 1px solid #555;
}
.header {
font-size: 4rem;
margin-top: 1rem;
}
.span1 {
font-family: "Dancing Script", cursive;
}
.span2 {
font-size: 3rem;
padding: 0 1rem;
font-weight: normal;
}
.span3 {
font-family: monospace, "Inter", sans-serif;
}
</style>
from flask import Flask, render_template, request
import random
app = Flask(__name__)
@app.route("/")
def index():
return render_template('index.html')
answers = [
"Ludwig",
"Sebastian",
"Max",
"Albin1",
"Albin2",
"red",
"blue",
"green",
"125",
"789",
"010",
]
@app.route('/ask', methods=['POST'])
def login():
if request.method == 'POST':
return random.choices(answers, k=random.randint(1, 100))
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment