Skip to content

Commit

Permalink
fix(transaction notification): fix transactions notification template (
Browse files Browse the repository at this point in the history
…#305)

* fix(transaction notification): fix transactions notification template

* fix(transaction notification): fixup! fix transactions notification template

* fix(transaction notification): fixup! fixup! fix transactions notification template

* fix(transaction notification): fixup! fixup! fixup! fix transactions notification template
  • Loading branch information
VladislavSokov authored Dec 4, 2023
1 parent 4a1494b commit 0b14c42
Show file tree
Hide file tree
Showing 2 changed files with 111 additions and 20 deletions.
6 changes: 5 additions & 1 deletion app/models/transaction.rb
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,11 @@ def time
end

def signed_amount(account)
sign = from_account == account ? '-' : '+'
sign = negative?(account) ? '-' : '+'
"#{sign}#{amount}"
end

def negative?(account)
from_account == account
end
end
125 changes: 106 additions & 19 deletions app/views/transactions_mailer/transaction_notification.html.erb
Original file line number Diff line number Diff line change
@@ -1,21 +1,108 @@
<h1>New transaction was added in <%= @account.name %>!</h1>
<h3>About transation:</h3>
<p>Amount: <%= @transaction.signed_amount(@account) %> </p>
<p>Description: <%= @transaction.description %> </p>
<p>Current balance: <%= @account.balance %> </p>
<br>
<h3> Last 5 transactions: </h3>
<table>
<tr>
<th>Date</th>
<th>Amount</th>
<th>Description</th>
</tr>
<% @transactions.each do |transaction|%>
<div class="container">
<h1>Transaction added to <%= @account.name %></h1>
<div class="about">
<div>
<b>Amount: </b>
<b class="<%= @transaction.negative?(@account) ? 'negative' : 'positive' %>"><%= @transaction.signed_amount(@account) %></b>
</div>
<b>Description: <%= @transaction.description %></b>
<b>Current balance: <%= @account.balance %></b>
</div>
<h2>Last 5 transactions:</h2>
<table>
<tr>
<th><%= transaction.date %></th>
<th><%= transaction.signed_amount(@account) %></th>
<th><%= transaction.description %></th>
<th>Date</th>
<th>Amount</th>
<th>Description</th>
</tr>
<% end %>
</table>
<% @transactions.each do |transaction|%>
<tr>
<th><%= transaction.date %></th>
<th class="<%= transaction.negative?(@account) ? 'negative' : 'positive' %>"><%= transaction.signed_amount(@account) %></th>
<th><%= transaction.description %></th>
</tr>
<% end %>
</table>
<b><%= link_to "See More details", account_url(@account) %></b>
</div>

<style>
body {
font-family: Arial, sans-serif;
background-color: #FEF9FF;
color: #333;
display: flex;
flex-direction: column;
align-items: center;
}

.container {
background-color: white;
min-width: 60%;
box-shadow: 0 0.1em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);
border-radius: 12px;
margin: 1.5rem;
padding: 5rem;
}

.about {
display: flex;
flex-direction: column;
}

.about b, div {
margin-bottom: 1rem;
}

.negative {
color: hsl(8, 82%, 41%);
}

.positive {
color: hsla(145, 73%, 38%, 1);
}

h1 {
margin-bottom: 3rem;
}

h1, h2 {
color: rebeccapurple;
}

table {
min-width: 100%;
border-collapse: collapse;
margin: 10px 0 30px;
}

th, th {
border: 1px solid #ddd;
padding: 8px;
text-align: left;
min-width: 90px;
}

th:first-child, td:first-child,
th:nth-child(2), td:nth-child(2) {
width: 15%;
}

tr:nth-child(even) {
background-color: #f9f9f9;
}

tr:nth-child(odd) {
background-color: #f2f2f2;
}

a {
color: rebeccapurple;
text-decoration: none;
}

a:hover {
color: #333;
text-decoration: none;
}
</style>

0 comments on commit 0b14c42

Please sign in to comment.