ui improvements.
This commit is contained in:
Bryce Covert
355
resources/public/css/main.css
Normal file
355
resources/public/css/main.css
Normal file
@@ -0,0 +1,355 @@
|
||||
form.dz { border: 2px dashed lightgray;}
|
||||
|
||||
html,body {
|
||||
font-family: 'Open Sans', serif;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
@keyframes scaleUp {
|
||||
from { opacity: 0; transform: translateY(10px); transform-origin: top center; }
|
||||
}
|
||||
@keyframes appear {
|
||||
from { opacity: 0; }
|
||||
}
|
||||
@keyframes slideIn {
|
||||
from {
|
||||
-webkit-transform: translateY(-100%);
|
||||
transform: translateY(-100%);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes slideInFromBelow {
|
||||
from {
|
||||
-webkit-transform: translateY(25%);
|
||||
transform: translateY(25%);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes moveToTop {
|
||||
from { }
|
||||
to { -webkit-transform: translateY(-100%); transform:
|
||||
translateY(-100%); }
|
||||
}
|
||||
|
||||
@keyframes flashWarning {
|
||||
from {
|
||||
background-color: #00d1b2;
|
||||
|
||||
}
|
||||
to {
|
||||
background-color: inherit;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes flashPrimary {
|
||||
from {
|
||||
background-color: #00d1b2;
|
||||
|
||||
}
|
||||
to {
|
||||
|
||||
background-color: inherit;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
tbody tr.live-removed {
|
||||
animation: flashWarning 1.0s ease both;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
tbody tr.live-added {
|
||||
animation: flashPrimary 1.0s ease both;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
.left-nav {
|
||||
width: 300px;
|
||||
}
|
||||
.nav.is-dark {
|
||||
background-color: #232B2D;
|
||||
color: #F6F7F7;
|
||||
}
|
||||
.nav.is-dark .nav-item a, .nav.is-dark a.nav-item {
|
||||
color: #F6F7F7;
|
||||
}
|
||||
.nav.is-dark .nav-item a.button.is-default {
|
||||
color: #F6F7F7;
|
||||
background-color: transparent;
|
||||
border-width: 2px;
|
||||
}
|
||||
.nav.menu {
|
||||
border-bottom: 1px solid #e1e1e1;
|
||||
}
|
||||
.nav.menu .nav-item .icon-btn {
|
||||
border: 3px solid #B7C6C9;
|
||||
border-radius: 90px;
|
||||
padding: 5px 7px;
|
||||
color: #B7C6C9;
|
||||
}
|
||||
.nav.menu .nav-item.is-active .icon-btn {
|
||||
color: #2EB398;
|
||||
border: 3px solid #2EB398;
|
||||
}
|
||||
.slideInFromBelow {
|
||||
animation: slideInFromBelow 1.5s ease both;
|
||||
}
|
||||
|
||||
.modal {
|
||||
animation: appear .7s ease both;
|
||||
}
|
||||
.inbox-messages {
|
||||
animation: scaleUp .3s ease both;
|
||||
}
|
||||
.nav.menu .nav-item .icon-btn .fa {
|
||||
font-size: 20px;
|
||||
color: #B7C6C9;
|
||||
}
|
||||
.nav.menu .nav-item.is-active .icon-btn .fa {
|
||||
color: #2EB398;
|
||||
}
|
||||
|
||||
|
||||
nav.navbar .navbar-item.is-active {
|
||||
background-color: #f5f5f5;
|
||||
color: #363636;
|
||||
}
|
||||
.aside {
|
||||
display:block;
|
||||
background-color: #F9F9F9;
|
||||
border-right: 1px solid #DEDEDE;
|
||||
}
|
||||
.messages {
|
||||
display:block;
|
||||
background-color: #fff;
|
||||
border-right: 1px solid #DEDEDE;
|
||||
}
|
||||
.message {
|
||||
display:block;
|
||||
background-color: #fff;
|
||||
}
|
||||
.aside .compose {
|
||||
height: 95px;
|
||||
margin:0 -10px;
|
||||
padding: 25px 30px;
|
||||
}
|
||||
.aside .compose .button {
|
||||
color: #F6F7F7;
|
||||
}
|
||||
.aside .compose .button .compose {
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.aside .main {
|
||||
padding: 40px;
|
||||
color: #6F7B7E;
|
||||
}
|
||||
.aside .title {
|
||||
color: #6F7B7E;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.aside .main .item {
|
||||
display: block;
|
||||
padding: 10px 0;
|
||||
color: #6F7B7E;
|
||||
}
|
||||
.aside .main .item.is-active {
|
||||
background-color: #F1F1F1;
|
||||
margin: 0 -50px;
|
||||
padding-left: 50px;
|
||||
}
|
||||
.aside .main .item:is-active,.aside .main .item:hover {
|
||||
background-color: #F2F2F2;
|
||||
margin: 0 -50px;
|
||||
padding-left: 50px;
|
||||
}
|
||||
.aside .main .icon {
|
||||
font-size: 19px;
|
||||
padding-right: 30px;
|
||||
color: #A0A0A0;
|
||||
}
|
||||
.aside .main .name {
|
||||
font-size: 15px;
|
||||
color: #5D5D5D;
|
||||
font-weight: 500;
|
||||
}
|
||||
.messages {
|
||||
padding: 40px 20px;
|
||||
}
|
||||
.message {
|
||||
padding: 40px 20px;
|
||||
}
|
||||
.messages .action-buttons {
|
||||
padding: 0;
|
||||
margin-top: -20px;
|
||||
}
|
||||
.message .action-buttons {
|
||||
padding: 0;
|
||||
margin-top: -5px;
|
||||
}
|
||||
.action-buttons .control.is-grouped {
|
||||
display: inline-block;
|
||||
margin-right: 30px;
|
||||
}
|
||||
.action-buttons .control.is-grouped:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.action-buttons .control.is-grouped .button:first-child {
|
||||
border-radius: 5px 0 0 5px;
|
||||
}
|
||||
.action-buttons .control.is-grouped .button:last-child {
|
||||
border-radius: 0 5px 5px 0;
|
||||
}
|
||||
.action-buttons .control.is-grouped .button {
|
||||
margin-right: -5px;
|
||||
border-radius: 0;
|
||||
}
|
||||
.pg {
|
||||
display: inline-block;
|
||||
top:10px;
|
||||
}
|
||||
.action-buttons .pg .title {
|
||||
display: block;
|
||||
margin-top: 0;
|
||||
padding-top: 0;
|
||||
margin-bottom: 3px;
|
||||
font-size:12px;
|
||||
color: #AAAAA;
|
||||
}
|
||||
.action-buttons .pg a{
|
||||
font-size:12px;
|
||||
color: #AAAAAA;
|
||||
text-decoration: none;
|
||||
}
|
||||
.is-grouped .button {
|
||||
background-image: linear-gradient(#F8F8F8, #F1F1F1);
|
||||
}
|
||||
.is-grouped .button .fa {
|
||||
font-size: 15px;
|
||||
color: #AAAAAA;
|
||||
}
|
||||
.inbox-messages .card {
|
||||
width: 100%;
|
||||
}
|
||||
.inbox-messages strong {
|
||||
color: #5D5D5D;
|
||||
}
|
||||
.inbox-messages .msg-check {
|
||||
padding: 0 20px;
|
||||
}
|
||||
.inbox-messages .msg-subject {
|
||||
padding: 10px 0;
|
||||
color: #5D5D5D;
|
||||
}
|
||||
.inbox-messages .msg-attachment {
|
||||
float:right;
|
||||
}
|
||||
.inbox-messages .msg-snippet {
|
||||
padding: 5px 20px 0px 5px;
|
||||
}
|
||||
.inbox-messages .msg-subject .fa {
|
||||
font-size: 14px;
|
||||
padding:3px 0;
|
||||
}
|
||||
.inbox-messages .msg-timestamp {
|
||||
float: right;
|
||||
padding: 0 20px;
|
||||
color: #5D5D5D;
|
||||
}
|
||||
.message-preview .avatar {
|
||||
display: inline-block;
|
||||
}
|
||||
.message-preview .top .address {
|
||||
display: inline-block;
|
||||
padding: 0 20px;
|
||||
}
|
||||
.avatar img {
|
||||
width: 40px;
|
||||
border-radius: 50px;
|
||||
border: 2px solid #999;
|
||||
padding: 2px;
|
||||
}
|
||||
.address .name {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.address .email {
|
||||
font-weight: bold;
|
||||
color: #B6C7D1;
|
||||
}
|
||||
.card.is-active {
|
||||
background-color:#F5F5F5;
|
||||
}
|
||||
.table { table-layout: fixed }
|
||||
.table td {text-overflow: ellipsis; overflow: hidden; white-space: nowrap; padding: 9px; }
|
||||
.table td.expandable {text-overflow: ellipsis; overflow: visible; white-space: nowrap; padding: 9px; }
|
||||
|
||||
.typeahead {
|
||||
position:relative;
|
||||
overflow:visible;
|
||||
}
|
||||
|
||||
.modal {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.modal-card-body {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.typeahead-menu {
|
||||
position:absolute;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
z-index: 10000;
|
||||
overflow: auto;
|
||||
float: left;
|
||||
min-width: 160px;
|
||||
padding: 5px 0;
|
||||
margin: 2px 0 0;
|
||||
list-style: none;
|
||||
font-size: 14px;
|
||||
text-align: left;
|
||||
background-color: #ffffff;
|
||||
border: 1px solid #cccccc;
|
||||
border: 1px solid rgba(0, 0, 0, 0.15);
|
||||
border-radius: 4px;
|
||||
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
|
||||
/* background-clip: padding-box; */
|
||||
|
||||
}
|
||||
.modal-card {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.typeahead-suggestion {
|
||||
display: block;
|
||||
overflow: visible;
|
||||
padding: 3px 20px;
|
||||
clear: both;
|
||||
font-weight: normal;
|
||||
line-height: 1.42857143;
|
||||
color: #333333;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.typeahead-suggestion:hover,
|
||||
.typeahead-suggestion:focus,
|
||||
.typeahead-menu:not(:hover) .typeahead-highlighted
|
||||
{
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
background-color: #00d1b2;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@@ -11,365 +11,7 @@
|
||||
<link rel="stylesheet" href="/css/bulma-calendar.min.css" />
|
||||
<link rel="stylesheet" href="/css/bulma-badge.min.css" />
|
||||
<link rel="stylesheet" href="/finance-font/style.css" />
|
||||
|
||||
<style>
|
||||
form.dz { border: 2px dashed lightgray;}
|
||||
|
||||
html,body {
|
||||
font-family: 'Open Sans', serif;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
@keyframes scaleUp {
|
||||
from { opacity: 0; transform: translateY(10px); transform-origin: top center; }
|
||||
}
|
||||
@keyframes appear {
|
||||
from { opacity: 0; }
|
||||
}
|
||||
@keyframes slideIn {
|
||||
from {
|
||||
-webkit-transform: translateY(-100%);
|
||||
transform: translateY(-100%);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes slideInFromBelow {
|
||||
from {
|
||||
-webkit-transform: translateY(25%);
|
||||
transform: translateY(25%);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes moveToTop {
|
||||
from { }
|
||||
to { -webkit-transform: translateY(-100%); transform:
|
||||
translateY(-100%); }
|
||||
}
|
||||
|
||||
@keyframes flashWarning {
|
||||
from {
|
||||
background-color: #00d1b2;
|
||||
|
||||
}
|
||||
to {
|
||||
background-color: inherit;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes flashPrimary {
|
||||
from {
|
||||
background-color: #00d1b2;
|
||||
|
||||
}
|
||||
to {
|
||||
|
||||
background-color: inherit;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
tbody tr.live-removed {
|
||||
animation: flashWarning 1.0s ease both;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
tbody tr.live-added {
|
||||
animation: flashPrimary 1.0s ease both;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
.left-nav {
|
||||
width: 300px;
|
||||
}
|
||||
.nav.is-dark {
|
||||
background-color: #232B2D;
|
||||
color: #F6F7F7;
|
||||
}
|
||||
.nav.is-dark .nav-item a, .nav.is-dark a.nav-item {
|
||||
color: #F6F7F7;
|
||||
}
|
||||
.nav.is-dark .nav-item a.button.is-default {
|
||||
color: #F6F7F7;
|
||||
background-color: transparent;
|
||||
border-width: 2px;
|
||||
}
|
||||
.nav.menu {
|
||||
border-bottom: 1px solid #e1e1e1;
|
||||
}
|
||||
.nav.menu .nav-item .icon-btn {
|
||||
border: 3px solid #B7C6C9;
|
||||
border-radius: 90px;
|
||||
padding: 5px 7px;
|
||||
color: #B7C6C9;
|
||||
}
|
||||
.nav.menu .nav-item.is-active .icon-btn {
|
||||
color: #2EB398;
|
||||
border: 3px solid #2EB398;
|
||||
}
|
||||
.slideInFromBelow {
|
||||
animation: slideInFromBelow 1.5s ease both;
|
||||
}
|
||||
|
||||
.modal {
|
||||
animation: appear .7s ease both;
|
||||
}
|
||||
.inbox-messages {
|
||||
animation: scaleUp .3s ease both;
|
||||
}
|
||||
.nav.menu .nav-item .icon-btn .fa {
|
||||
font-size: 20px;
|
||||
color: #B7C6C9;
|
||||
}
|
||||
.nav.menu .nav-item.is-active .icon-btn .fa {
|
||||
color: #2EB398;
|
||||
}
|
||||
|
||||
|
||||
nav.navbar .navbar-item.is-active {
|
||||
background-color: #f5f5f5;
|
||||
color: #363636;
|
||||
}
|
||||
.aside {
|
||||
display:block;
|
||||
background-color: #F9F9F9;
|
||||
border-right: 1px solid #DEDEDE;
|
||||
}
|
||||
.messages {
|
||||
display:block;
|
||||
background-color: #fff;
|
||||
border-right: 1px solid #DEDEDE;
|
||||
}
|
||||
.message {
|
||||
display:block;
|
||||
background-color: #fff;
|
||||
}
|
||||
.aside .compose {
|
||||
height: 95px;
|
||||
margin:0 -10px;
|
||||
padding: 25px 30px;
|
||||
}
|
||||
.aside .compose .button {
|
||||
color: #F6F7F7;
|
||||
}
|
||||
.aside .compose .button .compose {
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
}
|
||||
.aside .main {
|
||||
padding: 40px;
|
||||
color: #6F7B7E;
|
||||
}
|
||||
.aside .title {
|
||||
color: #6F7B7E;
|
||||
font-size: 12px;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.aside .main .item {
|
||||
display: block;
|
||||
padding: 10px 0;
|
||||
color: #6F7B7E;
|
||||
}
|
||||
.aside .main .item.is-active {
|
||||
background-color: #F1F1F1;
|
||||
margin: 0 -50px;
|
||||
padding-left: 50px;
|
||||
}
|
||||
.aside .main .item:is-active,.aside .main .item:hover {
|
||||
background-color: #F2F2F2;
|
||||
margin: 0 -50px;
|
||||
padding-left: 50px;
|
||||
}
|
||||
.aside .main .icon {
|
||||
font-size: 19px;
|
||||
padding-right: 30px;
|
||||
color: #A0A0A0;
|
||||
}
|
||||
.aside .main .name {
|
||||
font-size: 15px;
|
||||
color: #5D5D5D;
|
||||
font-weight: 500;
|
||||
}
|
||||
.messages {
|
||||
padding: 40px 20px;
|
||||
}
|
||||
.message {
|
||||
padding: 40px 20px;
|
||||
}
|
||||
.messages .action-buttons {
|
||||
padding: 0;
|
||||
margin-top: -20px;
|
||||
}
|
||||
.message .action-buttons {
|
||||
padding: 0;
|
||||
margin-top: -5px;
|
||||
}
|
||||
.action-buttons .control.is-grouped {
|
||||
display: inline-block;
|
||||
margin-right: 30px;
|
||||
}
|
||||
.action-buttons .control.is-grouped:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.action-buttons .control.is-grouped .button:first-child {
|
||||
border-radius: 5px 0 0 5px;
|
||||
}
|
||||
.action-buttons .control.is-grouped .button:last-child {
|
||||
border-radius: 0 5px 5px 0;
|
||||
}
|
||||
.action-buttons .control.is-grouped .button {
|
||||
margin-right: -5px;
|
||||
border-radius: 0;
|
||||
}
|
||||
.pg {
|
||||
display: inline-block;
|
||||
top:10px;
|
||||
}
|
||||
.action-buttons .pg .title {
|
||||
display: block;
|
||||
margin-top: 0;
|
||||
padding-top: 0;
|
||||
margin-bottom: 3px;
|
||||
font-size:12px;
|
||||
color: #AAAAA;
|
||||
}
|
||||
.action-buttons .pg a{
|
||||
font-size:12px;
|
||||
color: #AAAAAA;
|
||||
text-decoration: none;
|
||||
}
|
||||
.is-grouped .button {
|
||||
background-image: linear-gradient(#F8F8F8, #F1F1F1);
|
||||
}
|
||||
.is-grouped .button .fa {
|
||||
font-size: 15px;
|
||||
color: #AAAAAA;
|
||||
}
|
||||
.inbox-messages .card {
|
||||
width: 100%;
|
||||
}
|
||||
.inbox-messages strong {
|
||||
color: #5D5D5D;
|
||||
}
|
||||
.inbox-messages .msg-check {
|
||||
padding: 0 20px;
|
||||
}
|
||||
.inbox-messages .msg-subject {
|
||||
padding: 10px 0;
|
||||
color: #5D5D5D;
|
||||
}
|
||||
.inbox-messages .msg-attachment {
|
||||
float:right;
|
||||
}
|
||||
.inbox-messages .msg-snippet {
|
||||
padding: 5px 20px 0px 5px;
|
||||
}
|
||||
.inbox-messages .msg-subject .fa {
|
||||
font-size: 14px;
|
||||
padding:3px 0;
|
||||
}
|
||||
.inbox-messages .msg-timestamp {
|
||||
float: right;
|
||||
padding: 0 20px;
|
||||
color: #5D5D5D;
|
||||
}
|
||||
.message-preview .avatar {
|
||||
display: inline-block;
|
||||
}
|
||||
.message-preview .top .address {
|
||||
display: inline-block;
|
||||
padding: 0 20px;
|
||||
}
|
||||
.avatar img {
|
||||
width: 40px;
|
||||
border-radius: 50px;
|
||||
border: 2px solid #999;
|
||||
padding: 2px;
|
||||
}
|
||||
.address .name {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.address .email {
|
||||
font-weight: bold;
|
||||
color: #B6C7D1;
|
||||
}
|
||||
.card.is-active {
|
||||
background-color:#F5F5F5;
|
||||
}
|
||||
.table { table-layout: fixed }
|
||||
.table td {text-overflow: ellipsis; overflow: hidden; white-space: nowrap; padding: 9px; }
|
||||
.table td.expandable {text-overflow: ellipsis; overflow: visible; white-space: nowrap; padding: 9px; }
|
||||
|
||||
.typeahead {
|
||||
position:relative;
|
||||
overflow:visible;
|
||||
|
||||
}
|
||||
|
||||
.modal {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.modal-card-body {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.typeahead-menu {
|
||||
position:absolute;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
z-index: 10000;
|
||||
overflow: visible;
|
||||
float: left;
|
||||
min-width: 160px;
|
||||
padding: 5px 0;
|
||||
margin: 2px 0 0;
|
||||
list-style: none;
|
||||
font-size: 14px;
|
||||
text-align: left;
|
||||
background-color: #ffffff;
|
||||
border: 1px solid #cccccc;
|
||||
border: 1px solid rgba(0, 0, 0, 0.15);
|
||||
border-radius: 4px;
|
||||
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
|
||||
/* background-clip: padding-box; */
|
||||
|
||||
}
|
||||
.modal-card {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.typeahead-suggestion {
|
||||
display: block;
|
||||
overflow: visible;
|
||||
padding: 3px 20px;
|
||||
clear: both;
|
||||
font-weight: normal;
|
||||
line-height: 1.42857143;
|
||||
color: #333333;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.typeahead-suggestion:hover,
|
||||
.typeahead-suggestion:focus,
|
||||
.typeahead-menu:not(:hover) .typeahead-highlighted
|
||||
{
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
background-color: #00d1b2;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
</style>
|
||||
<link rel="stylesheet" href="/css/main.css" />
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@@ -31,6 +31,7 @@
|
||||
(re-frame/reg-event-fx
|
||||
::change-expense-accounts-saving
|
||||
(fn [{:keys [db]} [_ on-success id ]]
|
||||
|
||||
(let [{:keys [id expense-accounts]} (get-in db [::change-expense-accounts :invoice])]
|
||||
{:graphql
|
||||
{:token (-> db :user)
|
||||
@@ -49,7 +50,7 @@
|
||||
[:expense_accounts [:amount :id :location :expense_account_id
|
||||
[:expense_account [:id :name [:parent [:id :name]]]]]]
|
||||
[:client [:name :id :locations]]
|
||||
[:payments [:amount [:payment [:amount :s3_url :check_number ]]]]
|
||||
[:payments [:amount :id [:payment [:amount :s3_url :check_number ]]]]
|
||||
]]}]}
|
||||
:on-success on-success}})))
|
||||
|
||||
|
||||
@@ -201,7 +201,7 @@
|
||||
[:div.dropdown-menu {:role "menu"}
|
||||
[:div.dropdown-content
|
||||
(for [payment payments]
|
||||
(if (:s3-url (:payment payment))
|
||||
(if (:s3-url (:payment payment))
|
||||
^{:key (:id payment)}
|
||||
[:a.dropdown-item {:href (:s3-url (:payment payment)) :target "_new"} [:i.fa.fa-money-check] [:span.icon [:i.fa.fa-money]] (str " " (:check-number (:payment payment)) " (" (gstring/format "$%.2f" (:amount payment) ) ")")]
|
||||
|
||||
|
||||
@@ -19,16 +19,15 @@
|
||||
[:li.menu-item
|
||||
[:a.item {:href (bidi/path-for routes/routes :unpaid-invoices)
|
||||
:class [(active-when ap = :unpaid-invoices)]}
|
||||
[:span {:class "icon icon-accounting-document" :style {"font-size" "25px"}}]
|
||||
[:span {:class "icon icon-accounting-document" :style {:font-size "25px"}}]
|
||||
[:span {:class "name"} "Unpaid Invoices"]]]
|
||||
[:li.menu-item
|
||||
[:a.item {:href (bidi/path-for routes/routes :paid-invoices)
|
||||
:class [(active-when ap = :paid-invoices)]}
|
||||
|
||||
[:span {:class "icon icon-accounting-invoice-mail" :style {"font-size" "25px"}}]
|
||||
[:span {:class "icon icon-accounting-invoice-mail" :style {:font-size "25px"}}]
|
||||
|
||||
[:span {:class "name"} "Paid Invoices"]]]]
|
||||
]
|
||||
[:span {:class "name"} "Paid Invoices"]]]]]
|
||||
[:div
|
||||
rest]
|
||||
[:div {:class "compose has-text-centered"}
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
valid-matches (get-valid-matches matches not-found-description not-found-value text)]
|
||||
[:div.typeahead
|
||||
(if @selected
|
||||
[:div.input {:class class
|
||||
^{:key "typeahead"} [:div.input {:class class
|
||||
:tab-index "0"
|
||||
:on-key-up (fn [e]
|
||||
(if (= 8 (.-keyCode e))
|
||||
@@ -42,9 +42,8 @@
|
||||
[:div.tags.has-addons
|
||||
[:span.tag text]
|
||||
[:a.tag.is-delete {:on-click (fn [] (select [nil "" nil]))}]]]]
|
||||
[:input.input {:type "text"
|
||||
^{:key "typeahead"} [:input.input {:type "text"
|
||||
:class class
|
||||
:field field
|
||||
:value text
|
||||
:auto-focus auto-focus
|
||||
:on-blur (fn [e]
|
||||
@@ -54,35 +53,36 @@
|
||||
(#{"" nil} text)
|
||||
nil
|
||||
|
||||
(seq valid-matches)
|
||||
(do (select (first valid-matches))
|
||||
@highlighted
|
||||
(do (select @highlighted)
|
||||
true)
|
||||
|
||||
:else
|
||||
(do (select [nil ""])
|
||||
true)))
|
||||
:on-key-up (fn [e]
|
||||
:on-key-down (fn [e]
|
||||
(condp = (.-keyCode e)
|
||||
; up
|
||||
38 (do
|
||||
(when-let [new-match (->> valid-matches
|
||||
(take-while #(not= (first %) @highlighted))
|
||||
(take-while #(not= % @highlighted))
|
||||
(last))]
|
||||
(reset! highlighted new-match))
|
||||
true)
|
||||
;; dwon
|
||||
40 (do
|
||||
(when-let [new-match (->> valid-matches
|
||||
(drop-while #(not= (first %) @highlighted))
|
||||
(drop-while #(not= % @highlighted))
|
||||
(drop 1)
|
||||
(first))]
|
||||
(reset! highlighted new-match))
|
||||
true)
|
||||
13 (when @highlighted
|
||||
(select @highlighted)
|
||||
false)
|
||||
true)
|
||||
)
|
||||
13 (do (.preventDefault e)
|
||||
(when @highlighted
|
||||
|
||||
(select @highlighted)
|
||||
false))
|
||||
true))
|
||||
:on-change (fn [e]
|
||||
(let [new-matches (get-valid-matches matches not-found-description not-found-value (.. e -target -value))]
|
||||
(reset! highlighted (first new-matches)))
|
||||
|
||||
@@ -170,7 +170,6 @@
|
||||
(re-frame/reg-event-fx
|
||||
::print-checks
|
||||
(fn [{:keys [db]} [_ bank-account-id type]]
|
||||
(println type)
|
||||
(let [invoice-amounts (by :id :outstanding-balance (get-in db [::invoice-page :invoices]))]
|
||||
|
||||
{:db (-> db
|
||||
@@ -786,13 +785,15 @@
|
||||
|
||||
(defn unpaid-invoices-page []
|
||||
[side-bar-layout {:side-bar [invoices-side-bar {}
|
||||
[:p.menu-label "Vendor"]
|
||||
[:div
|
||||
[vendor-filter]]
|
||||
[:p.menu-label "Invoice #"]
|
||||
[:div
|
||||
[invoice-number-filter]
|
||||
]]
|
||||
^{:key "extra-filter"}
|
||||
[:div
|
||||
[:p.menu-label "Vendor"]
|
||||
[:div [vendor-filter]]
|
||||
[:p.menu-label "Invoice #"]
|
||||
[:div
|
||||
[invoice-number-filter]
|
||||
]]
|
||||
]
|
||||
:main [unpaid-invoices-content]
|
||||
:bottom [vendor-dialog {:vendor @(re-frame/subscribe [::subs/user-editing-vendor])
|
||||
:save-event [::events/save-vendor]
|
||||
|
||||
Reference in New Issue
Block a user