corbz/ticket-website
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects 1 Releases 1 Wiki Activity

Fixed and restyled PerfectScrollbars

Browse Source
This commit is contained in:
Corban-Lee Jones 2024-01-19 10:02:43 +00:00
parent bb28e2b2dc
commit 187153bb7c
2 changed files with 30 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/static/css/scrollbar.css
View File

@ -57,7 +57,8 @@
.ps .ps__rail-y:focus,
.ps .ps__rail-x.ps--clicking,
.ps .ps__rail-y.ps--clicking {
background-color: #eee;
/* background-color: #eee; */
background-color: var(--bs-tertiary-bg); /* Custom Change */
opacity: 0.9;
}
@ -99,6 +100,7 @@
.ps__rail-y:focus > .ps__thumb-y,
.ps__rail-y.ps--clicking .ps__thumb-y {
background-color: #999;
/* background-color: var(--bs-body); */
width: 11px;
}

54
apps/templates/home/tickets.html
View File

@ -13,14 +13,14 @@
<!-- ### $App Screen Content ### -->
<main class='main-content'>
<div id='mainContent'>
<div class="full-container" style="overflow-x: hidden;">
<div class="full-container" style="overflow: hidden;">
<div class="email-app">
<div class="email-side-nav remain-height ov-h">
<div class="h-100 layers">
<div class="p-20 bg-body-tertiary layer w-100">
<button type="button" class="btn btn-danger c-white w-100" data-bs-toggle="modal" data-bs-target="#ticketModal">New Ticket</button>
</div>
<div class="scrollable pos-r bdT layer w-100 fxg-1 bg-body">
<div class="scrollable pos-r ov-h bdT layer w-100 fxg-1 bg-body">
<ul id="filterSidebar" class="p-20 nav flex-column">
{% if priorities %}
@ -169,7 +169,7 @@
</div>
</div>
</div>
<div class="email-wrapper row remain-height bg-body pos-r scrollable">
<div class="email-wrapper row remain-height bg-body">
<div class="email-list h-100 layers">
<div class="layer w-100">
<div class="bg-body-tertiary peers ai-c p-20 fxw-nw">
@ -210,7 +210,7 @@
</div>
</div>
<div id="ticketsContainer" class="layer w-100 fxg-1 pos-r scrollable">
<div id="ticketsContainer" class="layer w-100 fxg-1 scrollable pos-r ov-h">
<div class="content"></div>
<div class="none-found pos-a top-50 start-50 translate-middle" style="display: none;">
<h6 class="fw-bold">No Tickets Found</h6>
@ -287,31 +287,31 @@
</div>
<div class="email-content h-100 bg-body">
<div class="h-100 scrollable pos-r">
<div class="bgc-grey-100 peers ai-c jc-sb p-20 fxw-nw d-n@md+">
<div class="peer">
<div class="btn-group" role="group">
<button type="button" class="back-to-mailbox btn bgc-white bdrs-2 mR-3 cur-p">
<i class="ti-angle-left"></i>
</button>
<button type="button" class="btn bgc-white bdrs-2 mR-3 cur-p" onclick="javascript:reloadCurrentTicket();">
<i class="fa fa-refresh"></i>
</button>
<button type="button" class="btn bgc-white bdrs-2 mR-3 cur-p">
<i class="ti-more-alt"></i>
</button>
<div class="bg-body-tertiary peers ai-c jc-sb p-20 fxw-nw d-n@md+">
<div class="peer">
<div class="btn-group" role="group">
<button type="button" class="back-to-mailbox btn bg-body bdrs-2 mR-3">
<i class="ti-angle-left"></i>
</button>
<button type="button" class="btn bg-body bdrs-2 mR-3" onclick="javascript:reloadCurrentTicket();">
<i class="fa fa-refresh"></i>
</button>
<button type="button" class="btn bg-body bdrs-2 mR-3">
<i class="ti-more-alt"></i>
</button>
</div>
</div>
</div>
<div class="peer">
<div class="btn-group" role="group">
<button type="button" class="fsz-xs btn bgc-white bdrs-2 mR-3 cur-p" onclick="javascript:changeTicket(false);">
<i class="ti-angle-left"></i>
</button>
<button type="button" class="fsz-xs btn bgc-white bdrs-2 mR-3 cur-p" onclick="javascript:changeTicket(true);">
<i class="ti-angle-right"></i>
</button>
<div class="peer">
<div class="btn-group" role="group">
<button type="button" class="btn bg-body bdrs-2 mR-3" onclick="javascript:changeTicket(false);">
<i class="ti-angle-left"></i>
</button>
<button type="button" class="btn bg-body bdrs-2 mR-3" onclick="javascript:changeTicket(true);">
<i class="ti-angle-right"></i>
</button>
</div>
</div>
</div>
</div>
<div id="ticketContent" class="email-content-wrapper">
<div class="content"></div>
<div class="loading" style="display: none;">
@ -450,7 +450,7 @@
</div>
<div class="peer">
<small class="ticket-content-datetime"></small>
<h5 class="ticket-content-author c-grey-900"></h5>
<h5 class="ticket-content-author"></h5>
<div class="ticket-content-badges"></div>
</div>
</div>