Updated quotes page and started profile page

This commit is contained in:
Benjamyn Love 2023-03-20 09:26:16 +11:00
parent dbcdb61680
commit 717ad174e2
11 changed files with 214 additions and 49 deletions

View File

@ -15,10 +15,7 @@ def index():
@login_required
def profile():
return render_template(
'profile.html',
name=current_user.name,
google_id=current_user.google_id,
is_admin=current_user.administrator
'profile.html'
)

View File

@ -78,3 +78,6 @@ $input-color: $nexi-black;
// $table-background-color: $primary;
// $table-striped-row-even-background-color: $nexi-lighter-black;
// $table-color: $nexi-white;
$button-border-color: $nexi-darker-red;
$button-border-width: 1px;

View File

@ -37,3 +37,10 @@
.dark-toggle-animation {
transition: background 500ms;
}
.dark-position {
position: fixed;
bottom: 2em;
right: 2em;
}

49
priceybot2/sass/flex.scss Normal file
View File

@ -0,0 +1,49 @@
.fcontainer {
display: flex;
flex-direction: column;
}
.innercontainer {
display: flex;
flex-direction: row;
background-color: #E4E4E4;
border-radius: 1em;
}
.innercontainer-dark {
display: flex;
flex-direction: row;
background-color: #353535;
border-radius: 1em;
}
.fquote {
display: flex;
flex-grow: 8;
}
.fbuttons {
display: flex;
align-self: flex-end;
}
.del-button {
border-color: #F44336 !important;
color: #F44336 !important;
}
.sel-button {
border-color: #353535 !important;
color: #353535 !important;
}
.del-button-dark {
border-color: #F44336 !important;
color: #F44336 !important;
}
.sel-button-dark {
border-color: #f8fafb !important;
color: #f8fafb !important;
}

View File

@ -3,6 +3,7 @@
// Our scss files
@import "branding";
@import "dark-mode";
@import "flex";
// Import after our branding so colors work.
@import "../node_modules/bulma/bulma.sass";

View File

@ -20,6 +20,51 @@
.dark-toggle-animation {
transition: background 500ms; }
.dark-position {
position: fixed;
bottom: 2em;
right: 2em; }
.fcontainer {
display: flex;
flex-direction: column; }
.innercontainer {
display: flex;
flex-direction: row;
background-color: #E4E4E4;
border-radius: 1em; }
.innercontainer-dark {
display: flex;
flex-direction: row;
background-color: #353535;
border-radius: 1em; }
.fquote {
display: flex;
flex-grow: 8; }
.fbuttons {
display: flex;
align-self: flex-end; }
.del-button {
border-color: #F44336 !important;
color: #F44336 !important; }
.sel-button {
border-color: #353535 !important;
color: #353535 !important; }
.del-button-dark {
border-color: #F44336 !important;
color: #F44336 !important; }
.sel-button-dark {
border-color: #f8fafb !important;
color: #f8fafb !important; }
/*! bulma.io v0.9.4 | MIT License | github.com/jgthms/bulma */
/* Bulma Utilities */
.button, .input, .textarea, .select select, .file-cta,
@ -428,7 +473,7 @@ a.box:active {
.button {
background-color: white;
border-color: #D2D2D2;
border-color: #EB302D;
border-width: 1px;
color: #363636;
cursor: pointer;

View File

@ -55,18 +55,27 @@ function applyTheme(theme) {
// Find elements and update class.
switch (theme) {
case 'dark':
primaryElements = Array.from(document.querySelectorAll('.is-primary-invert'));
test = Array('.is-primary-invert|is-primary', '.sel-button|sel-button-dark' , '.innercontainer|innercontainer-dark')
test.forEach((t) => {
let c = t.split('|')
primaryElements = Array.from(document.querySelectorAll(c[0]));
primaryElements.forEach((element) => {
element.classList.remove('is-primary-invert');
element.classList.add('is-primary');
element.classList.remove(c[0].split('.')[1]);
element.classList.add(c[1]);
});
})
break;
case 'light':
primaryElements = Array.from(document.querySelectorAll('.is-primary'));
test = Array('.is-primary|is-primary-invert', '.sel-button-dark|sel-button' , '.innercontainer-dark|innercontainer')
test.forEach((t) => {
let c = t.split('|')
primaryElements = Array.from(document.querySelectorAll(c[0]));
primaryElements.forEach((element) => {
element.classList.remove('is-primary');
element.classList.add('is-primary-invert');
element.classList.remove(c[0].split('.')[1]);
element.classList.add(c[1]);
});
})
break;
}
}

View File

@ -28,7 +28,7 @@
</div>
<div class="navbar-end">
{% if space_list is defined %}
<div class="select is-primary navbar-item m-4 p-4" >
<div class="select is-primary is-normal is-rounded m-4" >
<select name="space" id="space_option">
<option selected="selected" value="NaN">Please selelct a space!</option>
{% for i in space_list %}
@ -74,7 +74,7 @@
<div class="hero-foot">
<label class="is-pulled-right p-4">
<input name="dark-mode-toggle" class="dark-toggle" onclick="darkLight()" type="checkbox">
<input name="dark-mode-toggle" class="dark-toggle dark-position" onclick="darkLight()" type="checkbox">
</label>
</div>
</section>

View File

@ -1,9 +1,23 @@
{% extends "base.html" %}
{% block content %}
<h1 class="title">
Welcome, {{ name }}! <p/>
Your google ID is {{ google_id }} <p/>
Admin?: {{ "yes" if is_admin else "no" }} <p/>
</h1>
<div class="fcontainer is-primary has-text-left" style="flex-direction: column; align-content: flex-start">
<div style="display: flex; flex-grow: 2;">
<img src="https://benjamyn.love/frannodders.gif" width="256" height="256">
</div>
<div style="display: flex; flex-grow: 8; flex-direction: column;">
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
</div>
<!-- <p class="fquote">Welcome, {{ current_user.name }}!</p>
<p class="fquote">Your google ID is {{ current_user.google_id }}</p>
<p class="fquote">Admin?: {{ "yes" if current_user.administrator else "no" }}</p> -->
</div>
{% endblock %}

View File

@ -21,30 +21,20 @@
}
</script>
<div >
<h3 class="title">Quotes</h3>
<div >
{% with messages = get_flashed_messages() %}
{% if messages %}
<div class="notification is-danger">
{{ messages[0] }}
</div>
{% endif %}
{% endwith %}
<table class="table">
{% for quote in quotes %}
<tr>
<td class=" is-primary" style="text-align: left">
{{ quote[0] }}
</td>
{% if current_user.administrator %}
<td class="is-primary"><button class="is-primary button" onclick='sendquote({{ quote[1] }})' type="submit">Send</button></td>
{% endif %}
</tr>
{% endfor %}
</table>
<div class="fcontainer" >
{% for i in quotes %}
<div class=" has-text-left m-1 innercontainer p-4">
<div class="fquote" id="quote_{{ i[1] }}">
{{ i[0] }}
</div>
<div class="fbuttons">
<button class="button is-primary is-outlined m-1 sel-button" {% if not current_user.administrator %} disabled title="Administrator Privs required" {% endif %} onclick="sendquote({{ i[1] }})">Send</button>
<button class="button is-primary is-outlined m-1 del-button" {% if not current_user.administrator %} disabled title="Administrator Privs required" {% endif %} onclick="sendquote({{ i[1] }})">Delete</button>
</div>
</div>
{% endfor %}
</div>
{% endblock %}

View File

@ -0,0 +1,50 @@
{% extends "base.html" %}
{% block content %}
<script>
function sendquote(id) {
select = document.getElementById("space_option");
space_id = select[select.selectedIndex].value;
space_name = select[select.selectedIndex].text;
if (space_id === "NaN") {
alert("Please select a space");
return
}
let confirmation = confirm(`Send quote to ${space_name}`)
if (confirmation === true) {
let send_url = "{{ url_for('chatbot.send_quote', space='AAAAAA', _external=True) }}"
send_url = send_url.replace("AAAAAA",space_id)
fetch(send_url, {method: "POST",headers: {"Content-Type": "application/json"},body: JSON.stringify({"quote_id": id})})
.then((response) => console.log(response))
}
}
</script>
<div >
<h3 class="title">Quotes</h3>
<div >
{% with messages = get_flashed_messages() %}
{% if messages %}
<div class="notification is-danger">
{{ messages[0] }}
</div>
{% endif %}
{% endwith %}
<table class="table">
{% for quote in quotes %}
<tr>
<td class=" is-primary" style="text-align: left">
{{ quote[0] }}
</td>
{% if current_user.administrator %}
<td class="is-primary"><button class="is-primary button" onclick='sendquote({{ quote[1] }})' type="submit">Send</button></td>
{% endif %}
</tr>
{% endfor %}
</table>
</div>
</div>
{% endblock %}