Skip to content
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

Jump to bottom

Updated Bootstrap theming and reworked the UI #51

Merged
merged 3 commits into from
Jul 7, 2023
Merged

Updated Bootstrap theming and reworked the UI #51

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
5e0a5df
changing styles
joshjtaylor Jul 7, 2023
64be4a0
Merge remote-tracking branch 'origin/main' into jtaylor/ui-styling
joshjtaylor Jul 7, 2023
1dd8717
Updated bootstrap theming + complete UI overhaul
joshjtaylor Jul 7, 2023
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
12 changes: 8 additions & 4 deletions chirps/account/templates/account/profile.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,18 @@

{% block content %}

<h1 class="display-1"><i class="fa-regular fa-circle-user"></i> Account Settings</h1>
<h1 class="text-success">Account Settings</h1>
<hr>

<div class="form-group">
<form method="POST" action="{% url 'profile'%}">
{% csrf_token %}
{{ form }}
<button class="btn btn-success" type="submit">Save</button>
<div>
{% csrf_token %}
{{ form }}
</div>
<div class="mt-3 d-flex">
<button class="btn btn-success ml-auto mr-0" type="submit">Save</button>
</div>
</form>
</div>

Expand Down
7 changes: 1 addition & 6 deletions chirps/base_app/static/css/bootstrap.min.css
View file
Open in desktop

Large diffs are not rendered by default.

11 changes: 6 additions & 5 deletions chirps/base_app/templates/base.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,12 @@
</head>

<body>
<div class="container">
{% include 'header.html' %}
{% block content%}{%endblock%}
{% include 'footer.html' %}

<div>
{% include 'header.html' %}
<div class="container mt-3">
{% block content%}{%endblock%}
</div>
{% include 'footer.html' %}
</div>
<script src="{% static '/js/htmx-1.9.2.min.js' %}"></script>
<script src="{% static '/js/fa/all.min.js' %}"></script>
Expand Down
2 changes: 1 addition & 1 deletion chirps/base_app/templates/header.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{% load static %}
<div>
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<nav class="navbar navbar-light navbar-expand-lg bg-light w-100">
<div class="container-fluid">
<a class="navbar-brand" href="/"><img src="{% static 'account/chirps_logo.png' %}" width="32"></a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
Expand Down
15 changes: 8 additions & 7 deletions chirps/plan/templates/plan/dashboard.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,25 +3,26 @@

{% block content %}

<h1 class="display-1"><i class="fa-solid fa-map"></i> Plans</h1>
<h1 class="text-success">Plans</h1>
<!-- <a class="btn btn-primary" href="{% url 'plan_create' %}">New Plan</a> -->
<hr>

<div class="accordion" id="plan_templates">
{% for template in templates %}
<div class="accordion-item">
<h2 class="accordion-header">
<div class="accordion-header">
<button class="accordion-button collapsed" type="button"
data-bs-toggle="collapse" data-bs-target="#collapse-{{template.id}}"
aria-expanded="false" aria-controls="collapse-{{template.id}}">
{{template.name}}
<div class="d-flex">
<h5 class="ml-0 mr-3 my-auto">{{template.name}}</h5>
<small class="ml-0 mr-auto my-auto">{{template.description}}</small>
</div>
</button>
</h2>
</div>
<div id="collapse-{{template.id}}" class="accordion-collapse collapse">
<div class="accordion-body">
{{template.description}}

<h5 class="display-5">Rules</h4>
<h5>Rules</h4>
<table class="table">
<thead>
<tr>
Expand Down
16 changes: 9 additions & 7 deletions chirps/scan/templates/scan/create.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,21 +3,23 @@

{% block content %}

<div class="row">
<div class="col-md-6 offset-md-3">
<h1 class="text-center text-dark mt-5 display-1">New Scan</h1>
<div class="card my-5">
<div class="card-body cardbody-color p-lg-5">
<div>
<h1 class="text-success">New Scan</h1>
<hr>
<div class="card my-4">
<div class="card-body cardbody-color p-4">
<div class="form-group">
<form method="POST" action="{% url 'scan_create' %}">
{% csrf_token %}
{{ scan_form }}
<button class="btn btn-primary mt-2" type="submit">Create</button>
<div class="d-flex mt-3">
<a class="btn btn-danger ml-auto mr-0" type="button" href="{% url 'scan_dashboard' %}">Cancel</a>
<button class="btn btn-primary ml-2 mr-0" type="submit">Create</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>


Expand Down
10 changes: 6 additions & 4 deletions chirps/scan/templates/scan/dashboard.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,12 @@
{% block title %}Scans{% endblock %}

{% block content %}
<h1 class="display-1"><i class="fa-solid fa-magnifying-glass"></i> Scans</h1> <a class="btn btn-primary"
href="{% url 'scan_create' %}">New Scan</a>
<hr>
<table class="table">
<div class="d-flex">
<h1 class="my-auto ml-0 mr-auto text-success">Scans</h1>
<a class="btn btn-primary my-auto ml-auto mr-0" href="{% url 'scan_create' %}">New Scan</a>
</div>

<table class="table mt-3">
<thead>
<tr>
<th scope="col">#</th>
Expand Down
27 changes: 25 additions & 2 deletions chirps/target/templates/target/create.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,30 @@

{% block content %}

<div class="row">
<div>
<h1 class="text-success">New Target</h1>
<hr>
<div class="card my-4">
<div class="card-body cardbody-color p-4">
<div class="form-group">
<div class="d-flex">
<img width=48 class="rounded ml-0 mr-3 my-auto" src="{{target.model.logo_url}}">
<h2 class="ml-0 mr-auto my-auto">{{ target.model.html_name }}</h2>
</div>
<form class="my-3" method="POST" action="{% url 'target_create' target.model.html_name %}">
{% csrf_token %}
{{ form }}
<div class="d-flex mt-3">
<a class="btn btn-danger ml-auto mr-0" type="button" href="{% url 'target_dashboard' %}">Cancel</a>
<button class="btn btn-success ml-2 mr-0" type="submit">Create</button>
</div>
</form>
</div>
</div>
</div>
</div>

<!-- <div class="row">
<div class="col-md-6 offset-md-3">
<h1 class="text-center text-dark mt-5 display-1">New Target</h1>
<div class="card my-5">
Expand All @@ -22,6 +45,6 @@ <h2 class="display-4">{{ target.model.html_name }}</h2>
</div>
</div>
</div>
</div>
</div> -->

{% endblock %}
105 changes: 50 additions & 55 deletions chirps/target/templates/target/dashboard.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,62 +2,57 @@
{% block title %}Targets{% endblock %}

{% block content %}

<h1 class="display-1"><i class="fa-solid fa-bullseye"></i> Targets</h1>

<div>
<nav class="navbar">
<div class="container-fluid">
<a class="navbar-brand" href="#"></a>

<div class="btn-group">
<button type="button" class="btn btn-success">Create</button>
<button type="button" class="btn btn-success dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false">
<span class="visually-hidden">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu">
<li><h6 class="dropdown-header">Target</h6></li>
<li><hr class="dropdown-divider"></li>
{% for target in available_targets %}
<li><a class="dropdown-item" href="{% url 'target_create' target.model.html_name %}">{{target.model.html_name}}</a></li>
{% endfor %}
</ul>
<div>
<div class="d-flex">
<div class="ml-0 mr-auto my-auto">
<h1 class="text-success">Targets</h1>
</div>
<div class="ml-auto mr-0 my-auto">
<div class="dropdown"></div>
<button class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown">Create</button>
<div class="dropdown-menu">
{% for target in available_targets %}
<a class="dropdown-item" href="{% url 'target_create' target.model.html_name %}">{{target.model.html_name}}</a>
{% endfor %}
</div>
</div>
</div>
</div>
<hr>

{% for target in user_targets %}

<div class="card my-4">
<div class="d-flex card-header">
<img width=48 class="rounded float-end my-auto ml-0 mr-3" src="{{target.logo_url}}">
<h5 class="my-auto ml-0 mr-auto">{{ target.name }}</h5>
</div>
<!-- <h5 class="card-header"><img width=48 class="rounded float-end" src="{{target.logo_url}}">{{ target.name }}</h5> -->
<div class="card-body">
<p class="card-text">

{% if target.html_name == 'Mantium' %}
Application ID: {{ target.app_id }}
{% elif target.html_name == 'Redis' %}
Host: {{ target.host }}<br/>
Port: {{ target.port }}<br/>
Database Name: {{ target.database_name }}<br/>
Username: {{ target.username }}
{% endif %}
{% if target.html_name == 'Pinecone' %}
API Key: {{ target.decrypted_api_key }}<br/>
Environment: {{ target.environment }}<br/>
Index Name: {{ target.index_name }}<br/>
Project Name: {{ target.project_name }}
{% endif %}
</p>
<div class="d-flex">
<a href="{% url 'target_delete' target.id %}" class="btn btn-danger ml-auto mr-0">Delete</a>
<a href="#" class="btn btn-primary ml-2 mr-0 disabled">Edit</a>
</div>
</div>

</div>
</nav>
</div>


<hr>

{% for target in user_targets %}

<div class="card m-5">
<h5 class="card-header"><img width=64 class="rounded float-end" src="{{target.logo_url}}">{{ target.name }}</h5>
<div class="card-body">
<p class="card-text">

{% if target.html_name == 'Mantium' %}
Application ID: {{ target.app_id }}
{% elif target.html_name == 'Redis' %}
Host: {{ target.host }}<br/>
Port: {{ target.port }}<br/>
Database Name: {{ target.database_name }}<br/>
Username: {{ target.username }}
{% endif %}
{% if target.html_name == 'Pinecone' %}
API Key: {{ target.decrypted_api_key }}<br/>
Environment: {{ target.environment }}<br/>
Index Name: {{ target.index_name }}<br/>
Project Name: {{ target.project_name }}
{% endif %}
</p>
<a href="#" class="btn btn-primary disabled">edit</a>
<a href="{% url 'target_delete' target.id %}" class="btn btn-danger">delete</a>
</div>
</div>

{% endfor %}

{% endfor %}
</div>
{% endblock %}