Skip to content

Commit

Permalink
chore(UI): style table head and rows
Browse files Browse the repository at this point in the history
  • Loading branch information
@chidimo
chidimo committed May 16, 2019
1 parent 0f0c05a commit b9bdbb7
Show file tree
Hide file tree
Showing 3 changed files with 145 additions and 62 deletions.
178 changes: 120 additions & 58 deletions UI/admin.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,17 +20,46 @@

<nav class="menu">
<ul class="base_ul">

<li><a href="loan.new.html"><button id="sign_in" class="button_1">Apply for loan</button></a></li>

<li>
<div class="micro_image_wrapper">
<img src="./img/chidi.jpg" alt="">
</div>
<ul class="sub_menu">
<p class="username">email@address.com</p>
<hr>
<li><a href="profile.edit.html">Edit profile</a></li>
<hr>
<li><a href="authentication.html">Logout</a></li>
<a id="profile_dropdown" href="#" class="">
<span class="micro_avatar_wrapper">
<img class="micro_avatar" src="./img/chidi.jpg" alt="">
</span>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 17 8.59"
class="icon">
<path
d="M16.5.5L9.2 7.8a.99.99 0 0 1-1.39 0L.5.5"
fill="none"
stroke="#686b6e"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10">
</path>
</svg>
</a>

<ul id="sub_menu">
<div class="submenu_username">
<a href="./dashboard.html">
<div>first name last name</div>
</a>
</div>
<hr class="submenu_hr">
<li>
<a href="profile.edit.html">
<div class="sub_routes">Edit profile</div>
</a>
</li>
<hr class="submenu_hr">
<li>
<a href="authentication.html">
<div class="sub_routes">Logout</div>
</a>
</li>
</ul>
</li>
</ul>
Expand All @@ -46,7 +75,7 @@ <h2 id="page_heading">

<div class="user_card card">
<div class="user_photo">
<img src="https://via.placeholder.com/150" alt="">
<img src="./img/chidi.jpg" alt="">
</div>
<hr class="card_divider">

Expand All @@ -60,62 +89,95 @@ <h3>Orji Chidi <span style="color:green">&#x2714</span></h3>
<h3>Recent Loans</h3>
<div class="table_wrapper">
<table>
<tr>
<th>S/N</th>
<th>Application date</th>
<th>Status</th>
<th>Amount</th>
</tr>

<tr>
<td>1</td>
<td><time datetime="2019-01-01 08:00">01-01-2019</time></td>
<td>Pending</td>
<td>nil</td>
</tr>
<thead>
<tr>
<th>S/N</th>
<th>Application date</th>
<th>Status</th>
<th>Amount</th>
</tr>
</thead>

<tr>
<td>2</td>
<td><time datetime="2019-01-01 08:00">01-01-2019</time></td>
<td style="color:green">Approved</td>
<td>50,000</td>
</tr>

<tr>
<td>3</td>
<td><time datetime="2019-01-01 08:00">01-01-2019</time></td>
<td style="color:red">Rejected</td>
<td>nil</td>
</tr>
<tbody>
<tr>
<td>
<a href="./loan.html">
<div class="item_link">1</div>
</a>
</td>
<td><time datetime="2019-01-01 08:00">01-01-2019</time></td>
<td>Pending</td>
<td>nil</td>
</tr>

<tr>
<td>
<a href="./loan.html">
<div class="item_link">2</div>
</a>
</td>
<td><time datetime="2019-01-01 08:00">01-01-2019</time></td>
<td style="color:green">Approved</td>
<td>50,000</td>
</tr>

<tr>
<td>
<a href="./loan.html">
<div class="item_link">3</div>
</a>
</td>
<td><time datetime="2019-01-01 08:00">01-01-2019</time></td>
<td style="color:red">Rejected</td>
<td>nil</td>
</tr>
</tbod>
</table>
</div>
<p><a href="loans.html" class="see_more">See All Loans</a></p>

<h3>Recent Users</h3>
<div class="table_wrapper">
<table>
<tr>
<th>S/N</th>
<th>Name</th>
<th>Status</th>
</tr>
<tr>
<td>1</td>
<td>Jackie Chan</td>
<td style="color:green">Verified</td>
</tr>

<tr>
<td>2</td>
<td>Marcus Rashford</td>
<td style="color:green">Verified</td>
</tr>
<thead>
<tr>
<th>S/N</th>
<th>Name</th>
<th>Status</th>
</tr>
</thead>

<tr>
<td>3</td>
<td>Jose Mourinho</td>
<td style="color:red">Not Verified</td>
</tr>
<tbody>
<tr>
<td>
<a href="./user.html">
<div class="item_link">1</div>
</a>
</td>
<td>Jackie Chan</td>
<td style="color:green">Verified</td>
</tr>

<tr>
<td>
<a href="./user.html">
<div class="item_link">2</div>
</a>
</td>
<td>Marcus Rashford</td>
<td style="color:green">Verified</td>
</tr>

<tr>
<td>
<a href="./user.html">
<div class="item_link">3</div>
</a>
</td>
<td>Jose Mourinho</td>
<td style="color:red">Not Verified</td>
</tr>
</tbody>
</table>
</div>
<p><a href="users.html" class="see_more">See All Users</a></p>
Expand Down
11 changes: 10 additions & 1 deletion UI/css/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -136,7 +136,16 @@ td div.item_link {
width: 25px;
border-radius: 50%;
height: 25px;
margin: 0;
margin: auto;
}

thead tr {
background: #333A56;
color: #ffffff;
}

tr:nth-of-type(2) {
background: #ffffff;
}

td a {
Expand Down
18 changes: 15 additions & 3 deletions UI/dashboard.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -103,21 +103,33 @@ <h3>Loans</h3>

<tbody>
<tr>
<td>1</td>
<td>
<a href="./user.html">
<div class="item_link">1</div>
</a>
</td>
<td><time datetime="2019-01-01 08:00">01-01-2019</time></td>
<td>Pending</td>
<td> - </td>
</tr>

<tr>
<td>2</td>
<td>
<a href="./user.html">
<div class="item_link">2</div>
</a>
</td>
<td><time datetime="2019-01-01 08:00">01-01-2019</time></td>
<td style="color:green">Approved</td>
<td>50,000</td>
</tr>

<tr>
<td>3</td>
<td>
<a href="./user.html">
<div class="item_link">3</div>
</a>
</td>
<td><time datetime="2019-01-01 08:00">01-01-2019</time></td>
<td style="color:red">Rejected</td>
<td> - </td>
Expand Down

0 comments on commit b9bdbb7

Please sign in to comment.