commit 4710e3330cb7bbbb3dec92419c531169d6089ab3
parent 98ffc4055f2eebb3f1c986470e00ed1f6b0781f3
Author: Brennen T. Mazur <brennen@madis.cool>
Date: Wed, 21 Dec 2022 17:09:29 -0700
layout and admin widget modification
Diffstat:
5 files changed, 89 insertions(+), 66 deletions(-)
diff --git a/app.py b/app.py
@@ -29,6 +29,10 @@ def fleet():
def roles():
return render_template('admin/roles/index.html',ORGNAME=OrganizationName)
+@app.route("/admin/agreement")
+def agreement():
+ return render_template('admin/agreement/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
@@ -1,6 +1,23 @@
-html,body {margin:0;padding:0;}
+:root {
+ --zoning:#dcd;
+ --maincolor:#dff;
+ --accent:#f3f;
+ --widgetbg:#f0f0f0/*#4f4f4f*/;
+ --rootbg:#dbcfff;/*#aaeeaa*/
+ --progressfill:var(--maincolor);
+ --totalprogressfill:var(--accent);
+ --progressbg:var(--zoning);
+}
+
+html,body {margin:0;padding:0;background-color:var(--rootbg);}
.appview {margin:0;padding:0;}
+a,a.visited,a.hover {
+ text-decoration:none;
+ color:#000;
+}
+
+/********** LOGIN PAGE **********/
.login-grid {
display: grid;
grid-template-rows: repeat(3, 33vh);
@@ -16,11 +33,55 @@ html,body {margin:0;padding:0;}
grid-column-start: 2;
grid-column-end: 3;
}
-
-.base-grid {
+/********** WIDGETS **********/
+.permissions, .reportswidget, .activeusers, .agreements, .fleet, .punchclock {
+ display: grid;
+ align-items: center;
+ justify-items: center;
+ background-color: var(--widgetbg);
+ border-radius:.5em;
+}
+/********** PRIMARY LAYOUTS **********/
+.base-grid,.admin-grid {
display: grid;
+ grid-gap:1em;
+ margin:1em;
+}
+.base-grid {
grid-template-columns: repeat(2, 1fr);
- gap: 3rem;
- grid-auto-rows: minmax(500px, auto);
+ grid-auto-columns: minmax(500px, auto);
+}
+.admin-grid {
+ grid-template-columns:repeat(5,1fr);
+ grid-auto-rows: auto;
+}
+
+.agreements {
+ grid-row:1/4;
+ grid-column:1/ span 4;
+}
+
+/********** Progress display **********/
+.agreements a {
+ width:100%;
+}
+.progress {
+ margin:.5em 1em;
+ padding:1em;
+ border-radius:.5em;
+ background-color:var(--progressbg);
+ text-align:center;
+}
+.total-progress {
+ margin:1em;
+ height:2em;
+ background-color:var(--totalprogressfill);
+ text-align:center;
+}
+.progress-bar {
+ margin:1em;
+ height:2em;
+ background-color:var(--progressfill);
+ text-align:left;
}
diff --git a/templates/admin/agreements/widget.html b/templates/admin/agreements/widget.html
@@ -1,31 +1,14 @@
-<section class="activeusers">
- <h3>Clocked in Crew List</h3>
- <form>
- <input type="submit" value="Clock Crew Out">
- <table><!-- replace w/ function getUserHours(username) -->
- <tr><!-- FOR EACH clocked in user iterate user ...does each user need to be its own form? -->
- <td><input type="button" onclick="alert('route to /changehours<user1>')" value="user1.name"></td>
- <td><input type="checkbox" name="onCrew" checked><label for="onCrew">On Crew</label></td>
- <td><input type="checkbox" name="perdium"><label for="perdium">Perdium</label></td>
- <td><input type="button" onclick="alert('route to /changehours<user1>')" value="user1.timeIn"></td>
- <td><input type="submit" value="Clock Out"></td>
- </tr>
- <tr><!-- FOR EACH clocked in user iterate user ...does each user need to be its own form? -->
- <td><input type="button" onclick="alert('route to /changehours<user2>')" value="user2.name"></td>
- <td><input type="checkbox" name="onCrew" checked><label for="onCrew">On Crew</label></td>
- <td><input type="checkbox" name="perdium"><label for="perdium">Perdium</label></td>
- <td><input type="button" onclick="alert('route to /changehours<user2>')" value="user2.timeIn"></td>
- <td><input type="submit" value="Clock Out"></td>
- </tr>
- </form>
- <form>
- <tr><!-- clock in clocked out user -->
- <th><select><option value="user3.name" selected>user3.name</option><option value="user4.name">user4.name</option><option value="user5.name">user5.name</option></select></th>
- <td><input type="checkbox" name="onCrew" checked><label for="onCrew">On Crew</label></td>
- <td><input type="checkbox" name="perdium"><label for="perdium">Perdium</label></td>
- <td><input type="time" value="12:12"/></td>
- <td><input type="submit" value="Clock in New Member"></td>
- </tr>
- </table>
- </form>
+<section class="agreements">
+ <h3>Agreements Funding</h3>
+ <a href="/admin/agreement" onClick="alert('route to /admin/agreement<id>')"><div class="progress">Agreement Bid
+ <div class="total-progress" style="width:51.71%;">10342/20000</div>
+ <div class="progress-bar" style="width:5.7%;">Project1:342/6000</div>
+ <div class="progress-bar" style="width:85.71%;">Project2:6000/7000</div>
+ <div class="progress-bar" style="width:57.14%;">Project3:4000/7000</div>
+ </div></a>
+ <a href="/admin/agreement" onClick="alert('route to /admin/agreement<id>')"><div class="progress">Agreement Bid 2
+ <div class="total-progress" style="width:30%;">10000/30000</div>
+ <div class="progress-bar" style="width:28.94%;">Project1:4342/15000</div>
+ <div class="progress-bar" style="width:37.72%;">Project3:5658/15000</div>
+ </div></a>
</section>
diff --git a/templates/admin/reports/widget.html b/templates/admin/reports/widget.html
@@ -1,4 +1,4 @@
-<section class="activeusers">
+<section class="reportswidget">
<h3>Reports</h3>
<input type="button" value="Current Payperiod">
<input type="button" value="Agreements">
diff --git a/templates/admin/roles/widget.html b/templates/admin/roles/widget.html
@@ -1,31 +1,6 @@
-<section class="activeusers">
- <h3>Clocked in Crew List</h3>
- <form>
- <input type="submit" value="Clock Crew Out">
- <table><!-- replace w/ function getUserHours(username) -->
- <tr><!-- FOR EACH clocked in user iterate user ...does each user need to be its own form? -->
- <td><input type="button" onclick="alert('route to /changehours<user1>')" value="user1.name"></td>
- <td><input type="checkbox" name="onCrew" checked><label for="onCrew">On Crew</label></td>
- <td><input type="checkbox" name="perdium"><label for="perdium">Perdium</label></td>
- <td><input type="button" onclick="alert('route to /changehours<user1>')" value="user1.timeIn"></td>
- <td><input type="submit" value="Clock Out"></td>
- </tr>
- <tr><!-- FOR EACH clocked in user iterate user ...does each user need to be its own form? -->
- <td><input type="button" onclick="alert('route to /changehours<user2>')" value="user2.name"></td>
- <td><input type="checkbox" name="onCrew" checked><label for="onCrew">On Crew</label></td>
- <td><input type="checkbox" name="perdium"><label for="perdium">Perdium</label></td>
- <td><input type="button" onclick="alert('route to /changehours<user2>')" value="user2.timeIn"></td>
- <td><input type="submit" value="Clock Out"></td>
- </tr>
- </form>
- <form>
- <tr><!-- clock in clocked out user -->
- <th><select><option value="user3.name" selected>user3.name</option><option value="user4.name">user4.name</option><option value="user5.name">user5.name</option></select></th>
- <td><input type="checkbox" name="onCrew" checked><label for="onCrew">On Crew</label></td>
- <td><input type="checkbox" name="perdium"><label for="perdium">Perdium</label></td>
- <td><input type="time" value="12:12"/></td>
- <td><input type="submit" value="Clock in New Member"></td>
- </tr>
- </table>
- </form>
+<section class="permissions">
+ <h3>Permissions by</h3>
+ <input type="submit" value="Role">
+ <input type="submit" value="Employee">
+ <input type="submit" value="Page"><!-- may not be necessary with role above... -->
</section>
