mirror of
https://github.com/samuelclay/NewsBlur.git
synced 2025-09-18 21:50:56 +00:00
Restyling story title, author, date, and tags on ios.
This commit is contained in:
Samuel Clay
parent
d52740b270
commit
8aaae63b05
6 changed files with 71 additions and 759 deletions
|
|
@ -2168,29 +2168,31 @@ background: transparent;
|
|||
|
||||
.NB-feed-story .NB-feed-story-tags {
|
||||
margin: 9px 0 6px;
|
||||
overflow: hidden;
|
||||
line-height: 12px;
|
||||
height: 14px;
|
||||
height: 16px;
|
||||
}
|
||||
.NB-feed-story .NB-feed-story-tags .NB-middot {
|
||||
color: #A0A0A0;
|
||||
font-size: 10px;
|
||||
padding-right: 4px;
|
||||
padding-right: 8px;
|
||||
float: left;
|
||||
font-weight: normal;
|
||||
}
|
||||
.NB-feed-story .NB-feed-story-tag {
|
||||
/* Grey */
|
||||
float: left;
|
||||
cursor: pointer;
|
||||
font-weight: normal;
|
||||
font-size: 9px;
|
||||
padding: 0px 4px 1px;
|
||||
margin: 0 2px 2px;
|
||||
background-color: #D8DEE2;
|
||||
color: #9D9A95;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
|
||||
padding: 1px 5px;
|
||||
margin: -2px 4px 4px 0;
|
||||
background-color: rgba(0, 0, 0, .1);
|
||||
color: #959B8B;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
|
||||
border: 1px solid transparent;
|
||||
border-color: rgba(255, 255, 255, .3) transparent rgba(0, 0, 0, .1);
|
||||
}
|
||||
.NB-feed-story .NB-feed-story-tag:first-child {
|
||||
margin-left: 0;
|
||||
|
|
|
|||
|
|
@ -206,7 +206,7 @@
|
|||
footerString
|
||||
];
|
||||
|
||||
// NSLog(@"\n\n\n\nhtmlString:\n\n\n%@\n\n\n", htmlString);
|
||||
NSLog(@"\n\n\n\nhtmlString:\n\n\n%@\n\n\n", htmlString);
|
||||
NSString *path = [[NSBundle mainBundle] bundlePath];
|
||||
NSURL *baseURL = [NSURL fileURLWithPath:path];
|
||||
|
||||
|
|
@ -282,7 +282,7 @@
|
|||
int authorScore = [[[[appDelegate.activeClassifiers objectForKey:feedId]
|
||||
objectForKey:@"authors"]
|
||||
objectForKey:author] intValue];
|
||||
storyAuthor = [NSString stringWithFormat:@"<a href=\"http://ios.newsblur.com/classify-author/%@\" "
|
||||
storyAuthor = [NSString stringWithFormat:@"<span class=\"NB-middot\">·</span><a href=\"http://ios.newsblur.com/classify-author/%@\" "
|
||||
"class=\"NB-story-author %@\" id=\"NB-story-author\"><div class=\"NB-highlight\"></div>%@</a>",
|
||||
author,
|
||||
authorScore > 0 ? @"NB-story-author-positive" : authorScore < 0 ? @"NB-story-author-negative" : @"",
|
||||
|
|
@ -329,15 +329,13 @@
|
|||
|
||||
NSString *storyHeader = [NSString stringWithFormat:@
|
||||
"<div class=\"NB-header\"><div class=\"NB-header-inner\">"
|
||||
"<div class=\"NB-story-date\">%@</div>"
|
||||
"<div class=\"NB-story-title\">%@</div>"
|
||||
"<div class=\"NB-story-date\">%@</div>"
|
||||
"%@"
|
||||
"%@"
|
||||
"</div></div>",
|
||||
[storyTags length] ?
|
||||
[self.activeStory objectForKey:@"long_parsed_date"] :
|
||||
[self.activeStory objectForKey:@"short_parsed_date"],
|
||||
storyTitle,
|
||||
[self.activeStory objectForKey:@"long_parsed_date"],
|
||||
storyAuthor,
|
||||
storyTags];
|
||||
return storyHeader;
|
||||
|
|
|
|||
|
|
@ -1,593 +0,0 @@
|
|||
/**
|
||||
* Font Size Style
|
||||
*/
|
||||
|
||||
.NB-story {
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.NB-extra-small .NB-story,
|
||||
.NB-extra-small .NB-story-comment {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.NB-small .NB-story,
|
||||
.NB-small .NB-story-comment {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.NB-medium .NB-story,
|
||||
.NB-medium .NB-story-comment {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.NB-large .NB-story,
|
||||
.NB-large .NB-story-comment {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.NB-extra-large .NB-story,
|
||||
.NB-extra-large .NB-story-comment {
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
.NB-san-serif {
|
||||
font-family: Helvetica;
|
||||
}
|
||||
|
||||
.NB-serif {
|
||||
font-family: georgia;
|
||||
}
|
||||
|
||||
/**
|
||||
* iPad Wide Style
|
||||
*/
|
||||
|
||||
.NB-ipad-wide .NB-header {
|
||||
padding: 15px 0 5px;
|
||||
}
|
||||
|
||||
.NB-ipad-wide .NB-header .NB-header-inner {
|
||||
margin: 0px 90px;
|
||||
}
|
||||
|
||||
.NB-ipad-wide .NB-story {
|
||||
margin: 30px 90px;
|
||||
}
|
||||
|
||||
.NB-ipad-wide .NB-share-inner-wrapper {
|
||||
margin: 0 90px;
|
||||
}
|
||||
|
||||
.NB-ipad-wide#story_pane .nb-story-comments-public-teaser,
|
||||
.NB-ipad-wide#story_pane .nb-story-comments-public-header,
|
||||
.NB-ipad-wide#story_pane .NB-story-comments-shares-teaser {
|
||||
padding-left: 90px;
|
||||
padding-right: 90px;
|
||||
}
|
||||
|
||||
.NB-ipad-wide#story_pane .nb-story-comment {
|
||||
padding: 0 90px 2px 150px;
|
||||
}
|
||||
|
||||
.NB-ipad-wide#story_pane .nb-story-comment .nb-user-avatar {
|
||||
left: 88px;
|
||||
}
|
||||
.NB-ipad-wide#story_pane .nb-story-comment .nb-story-comment-reshares .nb-user-avatar {
|
||||
left: 108px;
|
||||
}
|
||||
|
||||
/**
|
||||
* iPad Narrow Style
|
||||
*/
|
||||
|
||||
.NB-ipad-narrow .NB-header {
|
||||
padding: 15px 30px 5px;
|
||||
}
|
||||
|
||||
.NB-ipad-narrow .NB-story {
|
||||
margin: 25px 30px;
|
||||
}
|
||||
|
||||
.NB-ipad-narrow .NB-share-inner-wrapper {
|
||||
margin: 0 30px;
|
||||
}
|
||||
|
||||
.NB-ipad-narrow#story_pane .nb-story-comments-public-teaser,
|
||||
.NB-ipad-narrow#story_pane .nb-story-comments-public-header,
|
||||
.NB-ipad-narrow#story_pane .NB-story-comments-shares-teaser {
|
||||
padding-left: 30px;
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
.NB-ipad-narrow#story_pane .nb-story-comment {
|
||||
padding: 0 30px 2px 90px;
|
||||
}
|
||||
.NB-ipad-narrow#story_pane .NB-story-comment .NB-user-avatar {
|
||||
left: 26px;
|
||||
}
|
||||
.NB-ipad-narrow#story_pane .nb-story-comment .nb-story-comment-reshares .nb-user-avatar {
|
||||
left: 45px;
|
||||
}
|
||||
|
||||
.NB-ipad-narrow#story_pane .NB-story-comment .NB-user-avatar.NB-story-comment-reshare {
|
||||
left: 26px;
|
||||
}
|
||||
|
||||
/**
|
||||
* iPhone Style
|
||||
*/
|
||||
|
||||
.NB-iphone .NB-header {
|
||||
padding: 12px 12px 5px;
|
||||
}
|
||||
|
||||
.NB-iphone .NB-story {
|
||||
margin: 12px 12px;
|
||||
}
|
||||
|
||||
.NB-iphone .NB-share-inner-wrapper {
|
||||
margin: 0 12px;
|
||||
}
|
||||
/*
|
||||
.NB-iphone .NB-story img {
|
||||
max-width: 290px !important;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Universal Style
|
||||
*/
|
||||
|
||||
body {
|
||||
text-rendering: optimizeLegibility;
|
||||
margin: 0;
|
||||
|
||||
-webkit-text-size-adjust: none;
|
||||
font-size: 14px;
|
||||
line-height: 120%;
|
||||
overflow: hidden;
|
||||
font-family: Helvetica;
|
||||
}
|
||||
|
||||
body.NB-iphone {
|
||||
line-height: 110%;
|
||||
}
|
||||
|
||||
.NB-story-author {
|
||||
color: #969696;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
margin: 4px 8px 0px 0;
|
||||
margin-bottom: 8px;
|
||||
text-shadow: 0 1px 0 #F9F9F9;
|
||||
float: left;
|
||||
position: relative;
|
||||
}
|
||||
.NB-story-author-positive {
|
||||
color: #58A353;
|
||||
text-shadow: 0 1px 0 #E9F6E9;
|
||||
}
|
||||
.NB-story-author-negative {
|
||||
color: #B85044;
|
||||
text-shadow: 0 1px 0 #F6E9E9;
|
||||
}
|
||||
.NB-story-tags {
|
||||
overflow: hidden;
|
||||
padding: 5px 2px 2px 2px;
|
||||
margin-bottom: 8px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.NB-story-tag {
|
||||
float: left;
|
||||
text-decoration: none;
|
||||
font-weight: normal;
|
||||
padding: 0px 4px 0px;
|
||||
margin: 0px 4px 4px 0;
|
||||
background-color: #C9CBC6;
|
||||
color: #505050;
|
||||
text-shadow: 0 1px 0 #E0E8DB;
|
||||
-webkit-border-radius: 4px;
|
||||
position: relative;
|
||||
}
|
||||
.NB-story-tag-positive {
|
||||
background-color: #88B383;
|
||||
color: white;
|
||||
text-shadow: 0 1px 0 #588353;
|
||||
}
|
||||
.NB-story-tag-negative {
|
||||
background-color: #C89094;
|
||||
color: white;
|
||||
text-shadow: 0 1px 0 #986064;
|
||||
}
|
||||
.NB-story-tag .NB-highlight,
|
||||
.NB-story-author .NB-highlight,
|
||||
.NB-show-profile .NB-highlight {
|
||||
position: absolute;
|
||||
top: -2px;
|
||||
left: -2px;
|
||||
bottom: -2px;
|
||||
right: -2px;
|
||||
background-color: #000;
|
||||
opacity: .25;
|
||||
border-radius: 4px;
|
||||
display: none;
|
||||
}
|
||||
.NB-story-tag.pressed .NB-highlight,
|
||||
.NB-story-author.pressed .NB-highlight,
|
||||
.pressed .NB-show-profile .NB-highlight,
|
||||
.NB-show-profile.pressed .NB-highlight {
|
||||
display: block;
|
||||
|
||||
}
|
||||
|
||||
.NB-story-date {
|
||||
color: #454D6C;
|
||||
}
|
||||
|
||||
.NB-story-author {
|
||||
font-size: 10px;
|
||||
line-height: 12px
|
||||
}
|
||||
|
||||
.NB-story-tags {
|
||||
line-height: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
.NB-story-tag {
|
||||
font-size: 9px;
|
||||
}
|
||||
|
||||
.NB-story-date {
|
||||
font-size: 11px;
|
||||
line-height: 13px;
|
||||
}
|
||||
|
||||
.NB-story h1,
|
||||
.NB-story h2,
|
||||
.NB-story h3,
|
||||
.NB-story h4,
|
||||
.NB-story h5,
|
||||
.NB-story h6,
|
||||
.NB-story div,
|
||||
.NB-story table,
|
||||
.NB-story span,
|
||||
.NB-story pre,
|
||||
.NB-story code {
|
||||
overflow: auto;
|
||||
clear: both;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.NB-story h1,
|
||||
.NB-story h2,
|
||||
.NB-story h3,
|
||||
.NB-story h4,
|
||||
.NB-story h5,
|
||||
.NB-story h6 {
|
||||
line-height: 140%;
|
||||
}
|
||||
|
||||
.NB-iphone .NB-story h1,
|
||||
.NB-iphone .NB-story h2,
|
||||
.NB-iphone .NB-story h3,
|
||||
.NB-iphone .NB-story h4,
|
||||
.NB-iphone .NB-story h5,
|
||||
.NB-iphone .NB-story h6 {
|
||||
line-height: 120%;
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.NB-story blockquote {
|
||||
background-color: #F0F0F0;
|
||||
border-left: 1px solid #9B9B9B;
|
||||
padding: 10px 20px;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
div + p {
|
||||
margin: 20px 0px 20px 0;
|
||||
}
|
||||
|
||||
.NB-story p {
|
||||
margin: 0px 0px 20px 0;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.NB-story small {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.NB-header {
|
||||
font-size: 22px;
|
||||
line-height: 1.2em;
|
||||
font-weight: 600;
|
||||
background-color: #E0E0E0;
|
||||
border-bottom: 1px solid #A0A0A0;
|
||||
text-shadow: 1px 1px 0 #EFEFEF;
|
||||
overflow: hidden;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.NB-iphone .NB-header {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.NB-story {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.NB-story a.NB-contains-image {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.NB-story div {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
.NB-story img {
|
||||
margin: 20px auto;
|
||||
height: auto !important;
|
||||
width: auto;
|
||||
max-width: 100% !important;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.NB-story img.NB-large-image,
|
||||
.NB-story img.NB-medium-image {
|
||||
margin: 20px auto !important;
|
||||
display: block !important;
|
||||
width: auto;
|
||||
height: auto;
|
||||
display: block;
|
||||
float: none;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.NB-story img.NB-small-image {
|
||||
display: inline-block;
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.NB-feed-story-comments {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.NB-story-title {
|
||||
clear: left;
|
||||
margin: 8px 0 4px;
|
||||
}
|
||||
|
||||
.NB-story-title-positive {
|
||||
color: #58A353;
|
||||
text-shadow: 0 1px 0 #E9F6E9;
|
||||
}
|
||||
.NB-story-title-negative {
|
||||
color: #B85044;
|
||||
text-shadow: 0 1px 0 #F6E9E9;
|
||||
}
|
||||
ins {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
del {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Comments */
|
||||
|
||||
.NB-feed-story-comments {
|
||||
margin: 0 !important;
|
||||
clear: both !important;
|
||||
max-width: none !important;
|
||||
}
|
||||
|
||||
#story_pane .NB-story-comments-shares-teaser.NB-highlighted {
|
||||
-webkit-transition: background-color .6s linear;
|
||||
background-color: #FBE5C7;
|
||||
}
|
||||
|
||||
#story_pane .NB-story-comments-shares-teaser {
|
||||
-webkit-transition: background-color .6s linear;
|
||||
}
|
||||
|
||||
#story_pane .NB-story-comment-reply.NB-highlighted {
|
||||
background-color: #FBE5C7;
|
||||
}
|
||||
|
||||
#story_pane .NB-story-comment.NB-highlighted {
|
||||
-webkit-transition: background-color .6s linear;
|
||||
background-color: #FBE5C7;
|
||||
}
|
||||
|
||||
#story_pane .NB-story-comment-reply,
|
||||
#story_pane .NB-story-comment {
|
||||
-webkit-transition: background-color .6s linear;
|
||||
}
|
||||
#story_pane .NB-story-comment-reply .NB-show-profile {
|
||||
float: left;
|
||||
left: -42px;
|
||||
}
|
||||
.NB-story-comment:last-child {
|
||||
border-bottom: 1px solid #A6A6A6;
|
||||
}
|
||||
|
||||
#story_pane .NB-story-comment .NB-story-comment-content {
|
||||
float: none;
|
||||
}
|
||||
|
||||
.nb-story-comments-label {
|
||||
float: left;
|
||||
margin-right: 2px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.nb-story-share-label {
|
||||
float: right;
|
||||
margin-top: 6px;
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
/* Sharing */
|
||||
|
||||
.NB-share-wrapper {
|
||||
margin-top: 36px;
|
||||
}
|
||||
|
||||
a.NB-show-profile {
|
||||
margin: 0 0 0 2px;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* Disable certain interactions on touch devices */
|
||||
.NB-button,
|
||||
a.NB-show-profile {
|
||||
-webkit-text-size-adjust: none;
|
||||
-webkit-user-select: none;
|
||||
-webkit-highlight: none;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
}
|
||||
|
||||
.NB-header,
|
||||
#NB-share-bar-wrapper {
|
||||
-webkit-user-select: none;
|
||||
-webkit-highlight: none;
|
||||
-webkit-touch-callout: none;
|
||||
}
|
||||
|
||||
.NB-button.NB-share-button {
|
||||
line-height: 20px;
|
||||
font-family: Helvetica, sans-serif;
|
||||
font-size: 14px;
|
||||
color: #606060;
|
||||
float: none;
|
||||
display: block;
|
||||
text-shadow:
|
||||
0px 0px 0px rgba(000,000,000,0),
|
||||
0px 1px 0px rgba(255,255,255,1);
|
||||
}
|
||||
|
||||
.NB-button.NB-share-button a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.NB-share-button.active,
|
||||
.NB-save-button.active {
|
||||
background: #217412;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* Edit, Like, and Reply buttons */
|
||||
|
||||
.NB-button {
|
||||
padding: 0px 0px 4px 4px;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.NB-button.NB-share-button {
|
||||
float: none;
|
||||
padding: 0px 0px 20px 0px;
|
||||
margin-bottom: 0;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.NB-button div {
|
||||
padding: 2px 6px;
|
||||
background: -webkit-gradient(
|
||||
linear, left top, left bottom,
|
||||
from(#F0F0F0),
|
||||
color-stop(0.50, #EBEBEB),
|
||||
color-stop(0.50, #E4E4E4),
|
||||
to(#C0C0C0));
|
||||
|
||||
border-radius: 3px;
|
||||
border: 1px solid #949494;
|
||||
box-shadow: inset 0px 1px 0px rgba(255,255,255,1);
|
||||
}
|
||||
|
||||
.NB-iphone .NB-button div {
|
||||
padding: 0px 5px 0px;
|
||||
}
|
||||
|
||||
.NB-iphone #story_pane .NB-story-comment .NB-story-comment-content {
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
|
||||
.NB-button.NB-share-button div {
|
||||
padding: 8px 0px 8px;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
background: -webkit-gradient(
|
||||
linear, left top, left bottom,
|
||||
from(#42aaff),
|
||||
to(#1e78c1));
|
||||
box-shadow: inset 0 0 0px 1px rgba(255, 255, 255, .6);
|
||||
text-shadow: 0 1px 0 #003366;
|
||||
}
|
||||
|
||||
.NB-button.NB-share-button div span {
|
||||
background: url("data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAACGUlEQVR42o2TTUsbYRSFZ+MvcNn/0EU1rSCCgkSxVRCLFgyiqFSE1tDSpNKoEaQJiAvBryDZGCVQKWIpWIeAFMHWL1qKjUJ3KRQSNUgSJzPR5PieMRMqjuLibAaec+577xkJwJ30p0jqEloXiglpQlmh3F3AaaEogWhnMw6dPTgafIljtx3i262gTSgSKbuPQ8dzxEfsSEw6kHBV4NRThrOVAaSd0o2wX0iJdj9D3PMaJ/1WKF4LtMlHyExf6jw0CO2dZAovCmWOBl4gMeFAyv0AmTyoLVRCXa1H+nsLtMgUktslpsmZ46E+JGedUMcsl2CwCumvTVD22qAcdOjS/vmQ3LVce7PCZMLa+EMdVj/XQflp06G/ezZ8/NYAV6gKUz+GcM8vXTGI8M0c20hW5QYo4XacCnhxox5dK+Wo+1SKmuUSeHdcKJ6VrpwqF3//Cqnh0kIy4djvNoyuVeNJHmwNONDrCyIg/8LjN0sFgyhPlfK/5cL4Zo7NZB2uFWDjh6fonQliXg5jQd7H3JcwDQoNy/LOPBXT9YXlx2YyYXcgpIPe+S10emTCqtAmDdbZMJaEd+apuG0ujG/m2EwmbB9fM0CrsTsaxFhPNozpvDPTuW0ujG/m2EwmbID/G2jsNutJA5aEBjyVnu7T042xrWYGWf4Y7DbryYaxJLwzT8Vtc2FGuplBTog/BrvNerJhLAnvTNDQppnBBZHZrv4ITeFuAAAAAElFTkSuQmCC") no-repeat top right;
|
||||
width: 23px;
|
||||
display: inline-block;
|
||||
height: 16px;
|
||||
margin-bottom: -2px;
|
||||
margin-right: -23px;
|
||||
}
|
||||
|
||||
.NB-iphone .NB-button .NB-story-comment-like-button-wrapper,
|
||||
.NB-button .NB-story-comment-like-button-wrapper {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.NB-button .NB-story-comment-like-button-wrapper span {
|
||||
background: transparent url("data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAAGmSURBVCiRbZG/axRBHMXfzO7tbvYua+IFJQa0sRBs1IiQFIEIgvgDEUSs7CSFCJLaA1MJYjrFI5VgmkBiCDYWNgZJlaB/wgknxOT0Lnt7s7Mz852xOgzxXvne98OXxwMG6PXm3PSbzblbgzJ21Kit3mcT4ye34NyI0AeT87PvxeGcHwVGj0d34lJyJQ6Gz1myDwZ+eLpxOapGp8Y95lVPVM4sDUdjF8kSOmK3sZ81HhpGP4XMfi3e3eqx+tcnzyM/ngVjlzjjlcgvIy1aUEaiHIwg110oynNjzXep0h1OVjeMVTNJWK34Xoh2vous6ECoA7R6TRhSiEvJEFk1Rc40+OOZ+rtU7l9r9ZopA1BoAecsHIBcZ/B4CZ18L8uK9r3a9Y+LHADmry5/TmXrmabCDQUJFEkYKhD6EcgZ9FT77cKNT2sA4PfbO7jMWA3OfBwLxwDmILUAOQ1jSPbv/gHOnvdZiWlXQFulyGrle0GFgUFJOj0ImPgtmhCq+6or/6wbp1TIyzc9imq6oNH/AHJmZS/78fLF7S/fDu20/ah+4UMcJGf7xl8kb9PTscP82wAAAABJRU5ErkJggg==") no-repeat center center;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: block;
|
||||
float: left;
|
||||
margin: 0 6px;
|
||||
}
|
||||
|
||||
.NB-button.selected div {
|
||||
background: #2379bf;
|
||||
background: -webkit-gradient(
|
||||
linear, left top, left bottom,
|
||||
from(#1e78c1),
|
||||
to(#2379bf));
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.NB-button.NB-share-button.selected div{
|
||||
box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.NB-button a {
|
||||
display: inline-block;
|
||||
padding-top: 1px;
|
||||
line-height: 16px;
|
||||
font-family: Helvetica, sans-serif;
|
||||
font-size: 11px;
|
||||
color: #606060;
|
||||
text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
|
||||
.NB-button.NB-share-button a {
|
||||
color: #FFF;
|
||||
text-shadow: none;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.NB-button.selected a {
|
||||
color: rgba(255,255,255,1);
|
||||
text-shadow: none;
|
||||
}
|
||||
|
|
@ -1,95 +0,0 @@
|
|||
$('.NB-story img').each(function () {
|
||||
setImage(this);
|
||||
});
|
||||
|
||||
$('.NB-story img').bind('load', function () {
|
||||
setImage(this);
|
||||
});
|
||||
|
||||
$('a.NB-show-profile').live('click', function () {
|
||||
var offset = $('img', this).offset();
|
||||
console.log(offset);
|
||||
var url = $(this).attr('href') + "/" + offset.left + "/" + (offset.top - window.pageYOffset) + "/" + offset.width + "/" + offset.height;
|
||||
window.location = url;
|
||||
return false;
|
||||
});
|
||||
|
||||
$('.NB-button').live('touchstart', function () {
|
||||
$(this).addClass('selected');
|
||||
});
|
||||
|
||||
$('.NB-button').live('touchend', function (e) {
|
||||
$(this).removeClass('selected');
|
||||
});
|
||||
|
||||
function setImage(img) {
|
||||
var $img = $(img);
|
||||
var width = $(img).width();
|
||||
var height = $(img).height();
|
||||
|
||||
if ($img.attr('src').indexOf('feedburner') != - 1) {
|
||||
$img.attr('class', 'NB-feedburner');
|
||||
} else if (width > 300 && height > 50) {
|
||||
$img.attr('class', 'NB-large-image');
|
||||
if ($img.parent().attr('href')) {
|
||||
$img.parent().addClass('NB-contains-image')
|
||||
}
|
||||
} else if (width > 30 && height > 30) {
|
||||
$img.attr('class', 'NB-medium-image');
|
||||
if ($img.parent().attr('href')) {
|
||||
$img.parent().addClass('NB-contains-image')
|
||||
}
|
||||
} else {
|
||||
$img.attr('class', 'NB-small-image');
|
||||
}
|
||||
}
|
||||
|
||||
function slideToComment(commentId, highlight) {
|
||||
setTimeout(function(){
|
||||
var commentString = 'NB-user-comment-' + commentId;
|
||||
var shareString = 'NB-user-share-bar-' + commentId;
|
||||
//Get comment
|
||||
var $comment = $('#' + commentString);
|
||||
if ($comment.length) {
|
||||
$.scroll($comment.offset().top - 32, 1000, 'ease-in-out');
|
||||
} else {
|
||||
var $shareBar = $('#' + shareString);
|
||||
if ($shareBar.length) {
|
||||
$.scroll($shareBar.offset().top - 32, 1000, 'ease-in-out');
|
||||
} else {
|
||||
var $shareButton =$("#NB-share-button-id");
|
||||
$.scroll($shareButton.offset().top - 32, 1000, 'ease-in-out');
|
||||
}
|
||||
}
|
||||
|
||||
if (highlight) {
|
||||
if ($comment.length) {
|
||||
setTimeout(function(){
|
||||
$comment.addClass('NB-highlighted');
|
||||
setTimeout(function(){
|
||||
$comment.removeClass('NB-highlighted');
|
||||
}, 2000);
|
||||
}, 1000);
|
||||
} else if ($shareBar.length) {
|
||||
|
||||
setTimeout(function(){
|
||||
$(".NB-story-comments-shares-teaser").addClass('NB-highlighted');
|
||||
setTimeout(function(){
|
||||
$(".NB-story-comments-shares-teaser").removeClass('NB-highlighted');
|
||||
}, 2000);
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
}, 500);
|
||||
|
||||
}
|
||||
|
||||
function findPos(obj) {
|
||||
var curtop = 0;
|
||||
if (obj.offsetParent) {
|
||||
do {
|
||||
curtop += obj.offsetTop;
|
||||
} while (obj = obj.offsetParent);
|
||||
return [curtop];
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -43,7 +43,7 @@
|
|||
*/
|
||||
|
||||
.NB-ipad-wide .NB-header {
|
||||
padding: 15px 0 5px;
|
||||
padding: 15px 0;
|
||||
}
|
||||
|
||||
.NB-ipad-wide .NB-header .NB-header-inner {
|
||||
|
|
@ -81,7 +81,7 @@
|
|||
*/
|
||||
|
||||
.NB-ipad-narrow .NB-header {
|
||||
padding: 15px 30px 5px;
|
||||
padding: 12px 30px;
|
||||
}
|
||||
|
||||
.NB-ipad-narrow .NB-story {
|
||||
|
|
@ -118,7 +118,7 @@
|
|||
*/
|
||||
|
||||
.NB-iphone .NB-header {
|
||||
padding: 12px 12px 5px;
|
||||
padding: 8px 12px;
|
||||
}
|
||||
|
||||
.NB-iphone .NB-story {
|
||||
|
|
@ -153,14 +153,47 @@ body.NB-iphone {
|
|||
line-height: 110%;
|
||||
}
|
||||
|
||||
|
||||
/* ========== */
|
||||
/* = Header = */
|
||||
/* ========== */
|
||||
|
||||
.NB-story-title {
|
||||
clear: left;
|
||||
margin: 2px 0 4px;
|
||||
color: #313330;
|
||||
}
|
||||
|
||||
.NB-story-title-positive {
|
||||
color: #58A353;
|
||||
text-shadow: 0 1px 0 #E9F6E9;
|
||||
}
|
||||
.NB-story-title-negative {
|
||||
color: #B85044;
|
||||
text-shadow: 0 1px 0 #F6E9E9;
|
||||
}
|
||||
.NB-story-date {
|
||||
display: inline;
|
||||
color: #818776;
|
||||
font-size: 11px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.NB-middot {
|
||||
display: inline-block;
|
||||
color: #A0A0A0;
|
||||
padding: 0 8px 0;
|
||||
line-height: 8px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.NB-story-author {
|
||||
color: #969696;
|
||||
display: inline;
|
||||
font-size: 11px;
|
||||
color: #959B8B;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
margin: 4px 8px 0px 0;
|
||||
margin-bottom: 8px;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .9);
|
||||
float: left;
|
||||
font-weight: bold;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
|
||||
position: relative;
|
||||
}
|
||||
.NB-story-author-positive {
|
||||
|
|
@ -171,24 +204,28 @@ body.NB-iphone {
|
|||
color: #B85044;
|
||||
text-shadow: 0 1px 0 #F6E9E9;
|
||||
}
|
||||
|
||||
.NB-story-tags {
|
||||
overflow: hidden;
|
||||
padding: 5px 2px 2px 2px;
|
||||
margin-bottom: 8px;
|
||||
text-transform: uppercase;
|
||||
padding: 5px 2px 2px 0;
|
||||
line-height: 12px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
.NB-story-tag {
|
||||
float: left;
|
||||
text-decoration: none;
|
||||
font-weight: normal;
|
||||
padding: 0px 4px 0px;
|
||||
padding: 1px 5px;
|
||||
margin: 0px 4px 4px 0;
|
||||
background-color: #C9CBC6;
|
||||
color: #505050;
|
||||
text-shadow: 0 1px 0 #E0E8DB;
|
||||
background-color: rgba(0, 0, 0, .1);
|
||||
color: #959B8B;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
|
||||
-webkit-border-radius: 4px;
|
||||
border: 1px solid transparent;
|
||||
border-color: rgba(255, 255, 255, .3) transparent rgba(0, 0, 0, .1);
|
||||
position: relative;
|
||||
font-size: 9px;
|
||||
}
|
||||
.NB-story-tag-positive {
|
||||
background-color: #88B383;
|
||||
|
|
@ -221,29 +258,6 @@ body.NB-iphone {
|
|||
|
||||
}
|
||||
|
||||
.NB-story-date {
|
||||
color: #454D6C;
|
||||
}
|
||||
|
||||
.NB-story-author {
|
||||
font-size: 10px;
|
||||
line-height: 12px
|
||||
}
|
||||
|
||||
.NB-story-tags {
|
||||
line-height: 12px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
.NB-story-tag {
|
||||
font-size: 9px;
|
||||
}
|
||||
|
||||
.NB-story-date {
|
||||
font-size: 11px;
|
||||
line-height: 13px;
|
||||
}
|
||||
|
||||
.NB-story h1,
|
||||
.NB-story h2,
|
||||
.NB-story h3,
|
||||
|
|
@ -307,10 +321,9 @@ div + p {
|
|||
.NB-header {
|
||||
font-size: 22px;
|
||||
line-height: 1.2em;
|
||||
font-weight: 600;
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#FEFEFE), to(#F3F4EF));
|
||||
border-bottom: 1px solid #C2C5BE;
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .9);
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
|
||||
overflow: hidden;
|
||||
max-width: none;
|
||||
|
||||
|
|
@ -318,7 +331,7 @@ div + p {
|
|||
}
|
||||
|
||||
.NB-iphone .NB-header {
|
||||
font-size: 14px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.NB-story {
|
||||
|
|
@ -360,19 +373,6 @@ div + p {
|
|||
clear: both;
|
||||
}
|
||||
|
||||
.NB-story-title {
|
||||
clear: left;
|
||||
margin: 8px 0 4px;
|
||||
}
|
||||
|
||||
.NB-story-title-positive {
|
||||
color: #58A353;
|
||||
text-shadow: 0 1px 0 #E9F6E9;
|
||||
}
|
||||
.NB-story-title-negative {
|
||||
color: #B85044;
|
||||
text-shadow: 0 1px 0 #F6E9E9;
|
||||
}
|
||||
ins {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue