Improved foursquare trending venues datatable, plus added dynamic show/hide of certain columns depending on the screen size

This commit is contained in:
Sahat Yalkabov
2013-12-04 16:38:02 -05:00
parent 73bcd2df93
commit a2ff239f42
3 changed files with 34 additions and 10 deletions

View File

@ -2,7 +2,7 @@
@import "font-awesome/font-awesome"; @import "font-awesome/font-awesome";
@import "ios7"; @import "ios7";
@import "animate.css"; @import "animate.css";
@import "datatables.css"; //@import "jquery.dataTables.css";
body { body {
padding-top: 60px; padding-top: 60px;

View File

@ -285,13 +285,37 @@ a {
// Datatable ============================================================= // Datatable =============================================================
.dataTables_filter {
float: right;
input {
.form-control;
display: inline-block;
width: inherit;
height: 30px;
margin: 0 0 5px 5px;
&:focus {
border-color: #007aff;
box-shadow: none;
}
}
}
.dataTables_length {
float: left;
}
.dataTable th { .dataTable th {
padding-right: 20px; padding-right: 20px;
position: relative; position: relative;
font-weight: normal; } font-weight: normal;
.dataTable th.sorting {
.sorting {
color: #007aff; color: #007aff;
cursor: pointer; } cursor: pointer;
}
}
.dataTable th.sorting:after, .dataTable th.sorting:before { .dataTable th.sorting:after, .dataTable th.sorting:before {
content: ""; content: "";
width: 0; width: 0;

View File

@ -33,19 +33,19 @@ block content
i.fa.fa-signal i.fa.fa-signal
| Trending Venues | Trending Venues
.panel-body .panel-body
table.dataTable.table.table-hover table.dataTable.table.table-hover.table-condensed
thead thead
tr tr
th Name th Name
th Location th.hidden-xs.hidden-sm Location
th Checkins th.hidden-xs Checkins
th Here Now th Here Now
tbody tbody
for venue in trendingVenues.venues for venue in trendingVenues.venues
tr tr
td= venue.name td= venue.name
td #{venue.location.address}, #{venue.location.city}, #{venue.location.state} td.hidden-xs.hidden-sm #{venue.location.address}, #{venue.location.city}, #{venue.location.state}
td= venue.stats.checkinsCount td.hidden-xs= venue.stats.checkinsCount
td= venue.hereNow.count td= venue.hereNow.count
.panel.panel-default .panel.panel-default