commit ab88dbd0e1bb949d22919dd4be5630a9d2708da3
parent 759d8509ffebe79aeb5bc52b241a703f995d3343
Author: Brennen T. Mazur <brennen@madis.cool>
Date: Thu, 12 Jan 2023 15:42:24 -0700
Added adaptive navigation
Diffstat:
15 files changed, 128 insertions(+), 61 deletions(-)
diff --git a/app.py b/app.py
@@ -68,11 +68,11 @@ def admin():
@app.route("/hours")#modify to take userid ex. /hours<userid> for "admin"
def hours():#userid goes into call to db to get user[] -> then returns formatted table (punchclock/index.html
- return render_template ('punchclock/index.html',ORGNAME=OrganizationName)
+ return render_template ('dashboard/punchclock/index.html',ORGNAME=OrganizationName)
@app.route("/fleet")
def fleet():
- return render_template('fleet/index.html',ORGNAME=OrganizationName)
+ return render_template('dashboard/fleet/index.html',ORGNAME=OrganizationName)
@app.route("/admin/roles")
def roles():
@@ -82,6 +82,10 @@ def roles():
def agreement():
return render_template('admin/agreement/index.html',ORGNAME=OrganizationName)
+@app.route("/docs")
+def knowlegebase():
+ return render_template('knowlegebase/index.html',ORGNAME=OrganizationName)
+
# @app.route("/login",methods = ['POST', 'GET'])
# def login():
# if request.method == 'POST':
diff --git a/static/css/main.css b/static/css/main.css
@@ -26,6 +26,46 @@ a,a.visited,a.hover {
color:#000;
}
+/********** NAVIGATION **********/
+header {
+ align-items:center;
+ justify-items:center;
+ display:grid;
+ gap:0.5rem;
+ padding:0rem 1.5rem 0rem 1.5rem;
+ margin:1rem 0rem 0rem 0rem;
+ width:auto;
+ height:3em;
+ grid-template-columns: min-content auto min-content min-content;
+ grid-template-areas: "logo navi doc logout";
+ align-self:center;
+ #logo {
+ grid-area:logo;
+ align-self:center;
+ }
+ #navi {
+ grid-area:navi;
+ justify-content:center;
+ height:100%;
+ display:grid;
+
+ grid-auto-flow:column;
+ grid-auto-columns:max-content;
+ gap:0.5rem;
+ place-self:center;
+
+ }
+ #doc {
+ grid-area:doc;
+ align-self:center;
+ }
+ #logout {
+ grid-area:logout;
+ justify-self:end;
+ align-self:center;
+ }
+}
+
/********** LOGIN PAGE **********/
.login-grid {
display: grid;
diff --git a/static/imgs/modlogo-for-foot.svg b/static/imgs/modlogo-for-foot.svg
@@ -1,6 +1,4 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
<svg
version="1.1"
id="svg48"
diff --git a/static/imgs/question-mark-inside-a-circle-svgrepo-com.svg b/static/imgs/question-mark-inside-a-circle-svgrepo-com.svg
@@ -0,0 +1,10 @@
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg fill="#000000" height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 29.536 29.536" xml:space="preserve">
+
+<g id="SVGRepo_bgCarrier" stroke-width="0"/>
+
+<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
+
+<g id="SVGRepo_iconCarrier"> <g> <path d="M14.768,0C6.611,0,0,6.609,0,14.768c0,8.155,6.611,14.767,14.768,14.767s14.768-6.612,14.768-14.767 C29.535,6.609,22.924,0,14.768,0z M14.768,27.126c-6.828,0-12.361-5.532-12.361-12.359c0-6.828,5.533-12.362,12.361-12.362 c6.826,0,12.359,5.535,12.359,12.362C27.127,21.594,21.594,27.126,14.768,27.126z"/> <path d="M14.385,19.337c-1.338,0-2.289,0.951-2.289,2.34c0,1.336,0.926,2.339,2.289,2.339c1.414,0,2.314-1.003,2.314-2.339 C16.672,20.288,15.771,19.337,14.385,19.337z"/> <path d="M14.742,6.092c-1.824,0-3.34,0.513-4.293,1.053l0.875,2.804c0.668-0.462,1.697-0.772,2.545-0.772 c1.285,0.027,1.879,0.644,1.879,1.543c0,0.85-0.67,1.697-1.494,2.701c-1.156,1.364-1.594,2.701-1.516,4.012l0.025,0.669h3.42 v-0.463c-0.025-1.158,0.387-2.162,1.311-3.215c0.979-1.08,2.211-2.366,2.211-4.321C19.705,7.968,18.139,6.092,14.742,6.092z"/> <g> </g> <g> </g> <g> </g> <g> </g> <g> </g> <g> </g> <g> </g> <g> </g> <g> </g> <g> </g> <g> </g> <g> </g> <g> </g> <g> </g> <g> </g> </g> </g>
+
+</svg>
diff --git a/templates/admin/layout.html b/templates/admin/layout.html
@@ -2,6 +2,8 @@
{% block title %}Management{% endblock %}
+{% block navigation %}<a href="/dashboard"><div id="dashboard">Dashboard</div></a>{% endblock %}
+
{% block content %}
<section class="admin-grid">
<!--functioncall checking role for admin. while loop return permissioned 'widgets' -->
diff --git a/templates/admin/roles/index.html b/templates/admin/roles/index.html
@@ -1,6 +1,9 @@
{% extends 'base.html' %}
+
{% block title %}Employees/Crew/Roles{% endblock %}
+{% block navigation %}<a id="navi" href="/admin"><div id="back"><Back</div></a>{% endblock %}
+
{% block content %}
<table> <tr><th>Name</th><th>Role</th><th>Active Employee</th></tr>
<tr>
diff --git a/templates/base.html b/templates/base.html
@@ -6,9 +6,11 @@
<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}">
</head>
<body>
- <nav>
- <!-- functioncall for inserting <a> for permissive pages -->
- </nav>
+ <header>
+ <div id="logo"><a href="/">LogoSvg</a></div> <!-- should direct to login,dashboard/admin, or main organization webpage? -->
+ {% block navigation %}{% endblock %} <!-- Above function call adds admin if permissive -->
+ <div id="doc"><a href="/docs"><svg fill="var(--accent)" height="2rem" width="2rem" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 29.536 29.536" xml:space="preserve"><g stroke-linecap="round" stroke-linejoin="round"/><path d="M14.768,0C6.611,0,0,6.609,0,14.768c0,8.155,6.611,14.767,14.768,14.767s14.768-6.612,14.768-14.767 C29.535,6.609,22.924,0,14.768,0z M14.768,27.126c-6.828,0-12.361-5.532-12.361-12.359c0-6.828,5.533-12.362,12.361-12.362 c6.826,0,12.359,5.535,12.359,12.362C27.127,21.594,21.594,27.126,14.768,27.126z"/> <path d="M14.385,19.337c-1.338,0-2.289,0.951-2.289,2.34c0,1.336,0.926,2.339,2.289,2.339c1.414,0,2.314-1.003,2.314-2.339 C16.672,20.288,15.771,19.337,14.385,19.337z"/> <path d="M14.742,6.092c-1.824,0-3.34,0.513-4.293,1.053l0.875,2.804c0.668-0.462,1.697-0.772,2.545-0.772 c1.285,0.027,1.879,0.644,1.879,1.543c0,0.85-0.67,1.697-1.494,2.701c-1.156,1.364-1.594,2.701-1.516,4.012l0.025,0.669h3.42 v-0.463c-0.025-1.158,0.387-2.162,1.311-3.215c0.979-1.08,2.211-2.366,2.211-4.321C19.705,7.968,18.139,6.092,14.742,6.092z"/></svg></a></div>
+ </header>
<section class="appview">
{% block content %} {% endblock %}
@@ -16,7 +18,7 @@
</section>
<footer>
- Engineered with ❤ for {{ ORGNAME }} - Sawtooth Systems
+ Engineered with ❤ for {{ ORGNAME }} with Sawtooth Systems
</footer>
</body>
</html>
diff --git a/templates/activeusers/widget.html b/templates/dashboard/activeusers/widget.html
diff --git a/templates/fleet/widget.html b/templates/dashboard/fleet/widget.html
diff --git a/templates/dashboard/layout.html b/templates/dashboard/layout.html
@@ -2,13 +2,15 @@
{% block title %}Dashboard{% endblock %}
+{% block navigation %}<div id="navi"><a href="/admin">Admin</a></div><a href="/"><div id="logout">Logout</div></a>{% endblock %}
+
{% block content %}
<section class="base-grid">
<!-- TODO: function call for permissive ACCESS, returns array of strings -->
<!-- For loop takes getWidget()'s -> [] iterates through to include Accessabe widgets, else deny's request -->
{%- for x in ['punchclock','activeusers','fleet'] %}
- {% include x~'/widget.html' %}
+ {% include '/dashboard/'~x~'/widget.html' %}
{%- else %}
{{ 'You do not have permission to access this page' }}<!--reroute to login page on no access? -->
{%- endfor %}
diff --git a/templates/dashboard/punchclock/index.html b/templates/dashboard/punchclock/index.html
@@ -0,0 +1,54 @@
+{% extends 'base.html' %}
+
+{% block title %}Hours{% endblock %}
+
+{% block navigation %}<a href="/dashboard"><div id="back">< Back</div></a>{% endblock %}
+
+{% block content %}
+ <section class="hours-grid">
+ <h3>username</h3><!-- abstract to 'welcome' function more like python var insert. IF logged in user has permission allow this username section to be a dropdown for modifying user time sheets. -->
+ <div><!-- abstract to payPeriod() -->
+ <h6>$payperiod range</h6>
+ </div>
+ <form>
+ <input type="submit" value="Request Changes">
+ <input type="reset">
+ <table><!-- replace w/ function getUserHours(username) -->
+ <tr>
+ <th>Day</th>
+ <th>Project</th>
+ <th>Start</th>
+ <th>Finish</th>
+ <th>Lunch</th>
+ <th>Purdium</th>
+ <th>Add Project</th>
+ <th>Remove Time</th>
+ </tr>
+ <tr><!-- for loop iterating over document entries -->
+ <td><input type="date"value="2023-01-03"min="2023-01-01"max="2023-01-15">or Wednesday Jan 3rd?</td>
+ <td><select><option selected>Project #1</option><option>Project #2</option><option>Project #3</option></select></td>
+ <td><input type="time" value="12:12"/></td>
+ <td><input type="time" value="01:11"/></td>
+ <td><input type="checkbox"></input></td>
+ <td><input type="checkbox"></input></td>
+ <td><button>+</button></td>
+ <td><button>-</button></td>
+ </tr>
+ <tr>
+ <td>Wednesday Jan 2rd</td>
+ <td><select><option>Project #1</option><option selected>Project #2</option><option>Project #3</option></select></td>
+ <td><input type="time" value="12:12"/></td>
+ <td><input type="time" value="01:11"/></td>
+ <td><input type="checkbox"></input></td>
+ <td><input type="checkbox"></input></td>
+ <td><button>+</button></td>
+ <td><button>-</button></td>
+ </tr>
+ <tr><!-- getUserHours(username) if note present returns following tr -->
+ <td></td><!-- date space -->
+ <td>note:<input type="text" value="reason for requested change"/></td>
+ </tr>
+ </table>
+ </form>
+ </section>
+{% endblock %}
diff --git a/templates/punchclock/widget.html b/templates/dashboard/punchclock/widget.html
diff --git a/templates/index.html b/templates/index.html
@@ -1,5 +1,9 @@
{% extends 'base.html' %}
+{% block title %} {{ ORGNAME }} {% endblock %}
+
+{% block navigation %}<div id="nav" href="#"></div><div id="logout"></div>{% endblock %}
+
{% block content %}
<section class="login-grid">
<h2>Page calls getUser()</h2><h6>Returns object of user data for redirection to dashboard, else directs to /login</h6>
diff --git a/templates/knowlegebase/index.html b/templates/knowlegebase/index.html
diff --git a/templates/punchclock/index.html b/templates/punchclock/index.html
@@ -1,52 +0,0 @@
-{% extends 'base.html' %}
-
-{% block title %}Hours{% endblock %}
-
-{% block content %}
- <section class="hours-grid">
- <h3>username</h3><!-- abstract to 'welcome' function more like python var insert. IF logged in user has permission allow this username section to be a dropdown for modifying user time sheets. -->
- <div><!-- abstract to payPeriod() -->
- <h6>$payperiod range</h6>
- </div>
- <form>
- <input type="submit" value="Request Changes">
- <input type="reset">
- <table><!-- replace w/ function getUserHours(username) -->
- <tr>
- <th>Day</th>
- <th>Project</th>
- <th>Start</th>
- <th>Finish</th>
- <th>Lunch</th>
- <th>Purdium</th>
- <th>Add Project</th>
- <th>Remove Time</th>
- </tr>
- <tr><!-- for loop iterating over document entries -->
- <td><input type="date"value="2023-01-03"min="2023-01-01"max="2023-01-15">or Wednesday Jan 3rd?</td>
- <td><select><option selected>Project #1</option><option>Project #2</option><option>Project #3</option></select></td>
- <td><input type="time" value="12:12"/></td>
- <td><input type="time" value="01:11"/></td>
- <td><input type="checkbox"></input></td>
- <td><input type="checkbox"></input></td>
- <td><button>+</button></td>
- <td><button>-</button></td>
- </tr>
- <tr>
- <td>Wednesday Jan 2rd</td>
- <td><select><option>Project #1</option><option selected>Project #2</option><option>Project #3</option></select></td>
- <td><input type="time" value="12:12"/></td>
- <td><input type="time" value="01:11"/></td>
- <td><input type="checkbox"></input></td>
- <td><input type="checkbox"></input></td>
- <td><button>+</button></td>
- <td><button>-</button></td>
- </tr>
- <tr><!-- getUserHours(username) if note present returns following tr -->
- <td></td><!-- date space -->
- <td>note:<input type="text" value="reason for requested change"/></td>
- </tr>
- </table>
- </form>
- </section>
-{% endblock %}