Add borders and update colours & icons

This commit is contained in:
Corban-Lee Jones 2024-04-26 11:46:50 +01:00
parent 15e4d4c503
commit 726b8f8c3f
2 changed files with 16 additions and 12 deletions

View File

@ -10,12 +10,12 @@
{% block content %}
<div class="container h-100">
<div class="d-flex flex-nowrap h-100">
<div class="d-flex flex-column flex-shrink-0 bg-body-tertiary py-3" style="width: 4.5rem">
<div class="d-flex flex-nowrap h-100 border-start border-end">
<div class="d-flex flex-column flex-shrink-0 bg-body-tertiary py-3 border-end" style="width: 4.5rem">
<ul id="serverList" class="nav nav-pills nav-flush flex-column mb-auto text-center">
<li class="nav-item"><hr class="my-2"></li>
<!-- <li class="nav-item"><hr class="my-3"></li> -->
<li class="nav-item">
<button type="button" id="newServerBtn" class="btn btn-outline-primary rounded-circle" style="width: 46px; height: 46px;">
<button type="button" id="newServerBtn" class="btn btn-outline-primary rounded-circle mt-1" style="width: 46px; height: 46px;">
<i class="bi bi-plus-lg fs-5"></i>
</button>
</li>
@ -26,7 +26,7 @@
select a server
</div>
<div id="selectedServerContainer" class="row" style="display: none;">
<div class="col-12 bg-body-tertiary">
<div class="col-12 bg-body-tertiary border-bottom">
<div class="px-3 py-4 d-flex justify-content-start align-items-center">
<img src="..." alt="Selected Server Icon" class="rounded-3 selected-server-icon">
<div class="ms-3">
@ -36,11 +36,15 @@
</div>
</div>
<div class="col-12 bg-body-tertiary">
<div class="d-flex px-3 py-4">
<button type="button" id="tableAddRowBtn" class="btn btn-success me-2">Add New</button>
<button type="button" id="tableDeleteSelectedBtn" class="btn btn-danger me-auto" disabled>Delete Selected</button>
<button type="button" id="tableButton" class="btn btn-outline-primary">See Selected</button>
<div class="col-12">
<div class="d-flex px-3 pt-4 pb-2 justify-content-end">
<button type="button" id="tableAddRowBtn" class="btn btn-primary me-3">
<i class="bi bi-plus-lg"></i>
</button>
<button type="button" id="tableDeleteSelectedBtn" class="btn btn-danger" disabled>
<i class="bi bi-trash3"></i>
</button>
<!-- <button type="button" id="tableButton" class="btn btn-outline-primary">See Selected</button> -->
</div>
</div>

View File

@ -1,9 +1,9 @@
{% load static %}
<div class="container">
<div class="navbar navbar-expand-lg bg-body-secondary">
<div class="navbar navbar-expand-lg bg-body-secondary border-start border-end border-bottom">
<div class="container">
<a href="#" class="navbar-brand">
<a href="/" class="navbar-brand">
<img src="{% static '/images/pyrss_logo.webp' %}" alt="Logo" width="50" class="d-inline-block">
</a>
<button type="button" class="navbar-toggler" data-bs-toggle="offcanvas" data-bs-target="#navCollapse" aria-controls="navCollapse" aria-label="Toggle navigation">