Skip to content

add base css and layout #69

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
LeanKhan merged 1 commit into from
Mar 15, 2021
Merged

add base css and layout #69

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 9 additions & 8 deletions app/routes.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,11 +25,8 @@ def to_json_array(collection):

@app.route("/")
def index():
# get all elections that have this status. pending
status = Status.query.get(1)
elections = Election.query.with_parent(
status).all() # all elections in the system
return render_template("index.html", title="Home Page", elections=elections)

return render_template("index.html", title="Home Page")


@app.route("/login-complete")
Expand Down Expand Up @@ -58,11 +55,15 @@ def login_complete():
return redirect(url_for('dashboard'))


@app.route("/dashboard")
@app.route("/home")
@login_required
def dashboard():
elections = current_user.elections.all() # all user elections
return render_template("dashboard.html", title="User Dashboard", elections=elections)
# get all elections that have this status. pending
status = Status.query.get(1)
elections = Election.query.with_parent(
status).all() # all elections in the system
user_elections = current_user.elections.all() # all user elections
return render_template("dashboard.html", title="User Home", elections=elections, user_elections=user_elections)


@app.route("/elections/new", methods=['GET', 'POST'])
Expand Down
9 changes: 9 additions & 0 deletions app/static/css/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
body {
/* color: grey; */
background-color: #e1e1e1;
}

header {
background-color: #5792cf !important;
color: white;
}
42 changes: 31 additions & 11 deletions app/templates/dashboard.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,34 +2,54 @@

{% block content %}
<div>
<h2>Hello, {{ current_user.get_name()[0].capitalize() }} </h2>
<ul>
<li><a href="{{ url_for('new_election') }}"><button>New Election</button></a></li>
<div class="d-flex justify-content-between mt-3">
<div>
You have {{ user_elections.count('') }} elections
</div>

</ul>
<div>
<a href="{{ url_for('new_election') }}"><button class="btn btn-success">New Election + </button></a></li>
</div>
</div>

<h3>Your elections</h3>

{% if elections %}
<table style="border: 2px solid lightblue;background-color: khaki;">
<h4>Your elections</h4>
{% if user_elections %}
<table class="table table-striped table-hover" style="border: 2px solid lightblue;background-color: khaki;">
<thead>
<th>
Id
Name
</th>
<th>
Status
</th>
<th>
Actions
</th>
</thead>
{% for election in user_elections %}
{% include "partials/election_record.html" %}
{% endfor %}
</table>
{% endif %}

<h4>Upcoming elections</h4>

<table class="table table-striped table-hover" style="border: 1px solid gold">
<thead>

<th>
Name
</th>
<th>
Status
</th>
<th>
Actions
Action
</th>
</thead>
{% for election in elections %}
{% include "partials/election_record.html" %}
{% endfor %}
</table>
{% endif %}
</div>
{% endblock %}
39 changes: 15 additions & 24 deletions app/templates/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,31 +1,22 @@
{% extends "layouts/base.html" %}

{% block content %}
<div>
<h4>This is the home page!</h4>
<div class="container text-center py-4">
<h2>EVoting</h2>

{% if current_user.is_authenticated and elections %}
<h3>Upcoming elections</h3>
<p>
Yarnnsss
</p>

<table style="border: 1px solid gold">
<thead>
<th>
Id
</th>
<th>
Name
</th>
<th>
Status
</th>
<th>
Action
</th>
</thead>
{% for election in elections %}
{% include "partials/election_record.html" %}
{% endfor %}
</table>
{% endif %}
<div class="d-flex align-items-center">
{% if current_user.is_authenticated %}
<a class=" mx-auto" href="{{ url_for('dashboard') }}">
<button class="btn btn-info">Go to Dashboard</button>
</a>
{% else %}
<button class="btn btn-info mx-auto" onclick="login()">Login</button>
{% endif %}

</div>
</div>
{% endblock %}
41 changes: 19 additions & 22 deletions app/templates/layouts/base.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,12 @@
<title>Welcome to E-Voting</title>
{% endif %}

<!-- styles -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous" />
<link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}" />
<!-- styles -->

<!-- External Scripts -->
<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.min.js" defer></script>
<script src="https://unpkg.com/htmx.org@1.2.1"
Expand All @@ -20,27 +26,13 @@
</head>

<body class="{{ styles }}">
<div>
Evoting: <a href="{{ url_for('index') }}">Home</a>, {% if current_user.is_authenticated %}
<a href="{{ url_for('dashboard') }}">Dashboard</a>
{% endif %}
{% if current_user.is_anonymous %}
<div>
<button onclick="login()">Login</button>
</div>
{% else %}
<div>
<button onclick="logout()">Logout</button>
</div>
{% endif %}

{% if current_user.is_authenticated %}
<div>
Hello, {{ current_user.get_name()[0].capitalize() }}
</div>
{% endif %}
</div>
<hr>
{% if request.endpoint != 'index' %}
<!-- Header Partial -->
{% include "partials/header.html" %}
<!-- Header -->
{% endif %}

{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages%}
{% for category, message in messages %}
Expand All @@ -50,7 +42,9 @@
{% endfor %}
{% endif %}
{% endwith %}
{% block content %}{% endblock %}
<div class="container">
{% block content %}{% endblock %}
</div>

<script src="https://auther.mybubbl.me/js/auth.js?v=0.2.0"></script>
<script>
Expand Down Expand Up @@ -114,7 +108,10 @@

</script>
{% endif %}

<!-- Boostrap JS -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
</body>

</html>
25 changes: 18 additions & 7 deletions app/templates/partials/election_record.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,18 +1,29 @@
<tr>
<td>
{{ election.id }}
<a class="link" href="{{ url_for('election', link=election.link) }}">
{{ election.name }}
</a>
</td>
<td>
<span class="badge rounded-pill bg-info">
{{ election.status.name }}
</span>
</td>
<td>{{ election.name }}</td>
<td>{{ election.status.name }}</td>
<td>
{%if election.owner.id == current_user.id %}
<a href="{{ url_for('update_election', link=election.link) }}">Edit</a>
<a href="{{ url_for('update_election', link=election.link) }}">
<span class="badge bg-secondary">
edit
</span>
</a>
{% endif %}

<a href="{{ url_for('election', link=election.link) }}">View</a>

{% if election.status.name == 'started' %}
<a href="{{ url_for('voting_pass_link', link=election.link) }}">Vote</a>
<a href="{{ url_for('voting_pass_link', link=election.link) }}">
<button class="btn btn-primary shadow-sm">
Vote!
</button>
</a>
{% endif %}
</td>
</tr>
38 changes: 38 additions & 0 deletions app/templates/partials/header.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
<header>
<div class="container">
{% if current_user.is_authenticated %}

<div class="d-flex justify-content-between pt-5">
<h1 id="name_tag">
Hi, {{ current_user.get_name()[0].capitalize() }}
</h1>

<div>
{% if current_user.is_anonymous %}
<div>
<button class="btn btn-outline-danger btn-sm" onclick="login()">Login</button>
</div>
{% else %}
<div>
<button class="btn btn-outline-danger btn-sm" onclick="logout()">Logout</button>
</div>
{% endif %}
</div>
</div>
{% endif %}

<ul class="nav">
<li class="nav-item">
<a class="nav-link ps-0 text-white" aria-current="page" href="{{ url_for('index') }}">Home</a>
</li>
{% if current_user.is_authenticated %}
<li class="nav-item">
<a class="nav-link text-white" href="{{ url_for('dashboard') }}">Dashboard</a>
</li>
{% endif %}
</ul>
<!-- nav -->
</div>

<hr class="my-1">
</header>