gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

stylize search results

Browse Source
This commit is contained in:
Quincy Larson
2015-05-01 23:05:37 -07:00
parent f376460755
commit 0f0adac85c
2 changed files with 71 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
public/css/main.less
View File

@ -939,6 +939,21 @@ iframe.iphone {
} }
} }
.news-box-search {
@media (min-width: 768px) {
margin-top: -50px;
}
@media (max-width: 767px) {
padding: 5px;
border-color: @brand-info;
border-width: 1px;
border-style: solid;
border-radius: 5px;
width: 100%;
float: left;
}
}
.story-headline { .story-headline {
font-size: 20px; font-size: 20px;
margin-left: 14px; margin-left: 14px;
@ -976,6 +991,10 @@ hr {
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
} }
.dotted-underline {
border-bottom: dashed 1px @brand-success;
}
#cal-heatmap { #cal-heatmap {
width: 361px; width: 361px;
} }

64
views/stories/news-nav.jade
View File

@ -12,7 +12,9 @@
span span
a.btn.btn-success.btn-big.btn-block.btn-responsive(href='/news/' class="#{ (page !== 'hot') ? '' : 'hidden' }") All a.btn.btn-success.btn-big.btn-block.btn-responsive(href='/news/' class="#{ (page !== 'hot') ? '' : 'hidden' }") All
.spacer .spacer
.spacer
#search-results #search-results
.spacer .spacer
#story-list #story-list
ul#stories ul#stories
@ -40,30 +42,68 @@ script.
} }
}) })
.fail(function (xhr, textStatus, errorThrown) { .fail(function (xhr, textStatus, errorThrown) {
$('#search-results').empty();
var div = document.createElement("div");
$(div).html("<h3 class='negative-35 text-center text-warning dotted-underline'><em>No Results Found</em></h3>");
$(div).appendTo($('#search-results'));
}) })
.done(function (data, textStatus, xhr) { .done(function (data, textStatus, xhr) {
$('#search-results').empty();
for (var i = 0; i < data.length; i++) { for (var i = 0; i < data.length; i++) {
var div = document.createElement('div'); var div = document.createElement('div');
var linkedName = getLinkedName(data[i].storyLink); var linkedName = getLinkedName(data[i].storyLink);
var rank = data[i].rank; var rank = data[i].rank;
$(div).html( $(div).html(
"<div class='row text-left'>" + "<div class='visible-xs row'>" +
"<div class='col-xs-4 col-sm-2 col-md-1'>" + "<div class='visible-xs col-sm-1 col-md-1'>" +
"<a href='" + data[i].link + "' target='_blank'>" + "<a href='" + data[i].link + "'>" +
"<img src='" + data[i].author.picture + "' class='img-responsive mobile-story-image'/>" + "<img class='mobile-story-image img-responsive' src='" + (!!data[i].image ? data[i].image : data[i].author.picture) + "'/>" +
"</a>" +
"</div>" + "</div>" +
"<div class='col-xs-8 col-sm-10 col-md-11 text-center'>" + "<div class='visible-xs'>" +
"<div class='story-headline'>" + "<div class='col-xs-12 text-center'>" +
"<a href='/stories/" + linkedName + "'>" rank + (rank > 1 ? " points" : " point") + " · posted " +
+ data[i].storyLink + moment(data[i].timePosted).fromNow() +
"</a><br>" + " by " +
"<a href='/" + data[i].author.username + "'>@" + data[i].author.username +
"</a> " +
"</div>" + "</div>" +
"Posted " + "<div class='col-xs-12'>" +
moment(data[i].timePosted).fromNow() + "<br>" +
" by <a href='/" + data[i].author.username + "'>@" + data[i].author.username + "</a> " + "<a class='btn btn-no-shadow btn-primary btn-block btn-primary-ghost' href='/news/" + linkedName + "'>discuss</a>" +
"</div>" +
"</div>" +
"</div>" +
"<div class='hidden-xs row media-stories'>" +
"<div class='media'>" +
"<div class='media-left'>" +
"<a href='/'" + data[i].author.username + "'>" +
"<img class='img-news' src='" + data[i].author.picture + "'/>" +
"</a>" +
"</div>" +
"<h2 class='media-body'>" +
"<div class='media-body-wrapper'>" +
"<div class='story-headline'>" +
"<a href='" + data[i].link + "' target='_blank'>" +
data[i].headline +
"</a>" +
"</div>" +
"<div class='story-byline col-xs-12 wrappable'>" +
"<a class='btn btn-no-shadow btn-primary btn-xs btn-primary-ghost' href='/news/" + linkedName + "'>discuss</a> · " +
rank + (rank > 1 ? " points" : " point") + " · posted " +
moment(data[i].timePosted).fromNow() +
" by <a href='/" + data[i].author.username + "'>@" + data[i].author.username +
"</a> " +
"</div>" +
"</div>" +
"</h2>" +
"</div>" + "</div>" +
"</div>") "</div>")
$(div).addClass('story-list news-box-search')
$(div).appendTo($('#search-results')); $(div).appendTo($('#search-results'));
} }
var hr = document.createElement("div");
$(hr).html("<h3 class='negative-35 text-center text-success dotted-underline'><em>End search results</em></h3>")
$(hr).appendTo($('#search-results'));
}); });
} }