public-mirrors/NewsBlur
1
0
Fork 0
mirror of https://github.com/samuelclay/NewsBlur.git synced 2025-08-31 21:41:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

adding in a toggle comment experiment

Browse source
This commit is contained in:
Roy Yang 2012-08-16 02:20:08 -07:00
parent 2a3558ad39
commit bba9de123c
4 changed files with 141 additions and 57 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

168
media/css/circular/css/screen.css
View file

@ -67,39 +67,39 @@ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav,
display: block; display: block;
} }
/* line 79, ../sass/screen.scss */ /* line 82, ../sass/screen.scss */
body { body {
background: #ebedee url('/media/img/circular/background.png') repeat 0 0; background: #ebedee url('/media/img/circular/background.png') repeat 0 0;
font-family: Helvetica, arial, san-serif; font-family: Helvetica, arial, san-serif;
color: #333333; color: #333333;
} }
/* line 85, ../sass/screen.scss */ /* line 88, ../sass/screen.scss */
a { a {
color: #333333; color: #333333;
text-decoration: none; text-decoration: none;
} }
/* line 90, ../sass/screen.scss */ /* line 93, ../sass/screen.scss */
.NB-page { .NB-page {
width: 700px; width: 700px;
margin: 0 auto; margin: 0 auto;
padding-top: 120px; padding-top: 120px;
} }
/* line 96, ../sass/screen.scss */ /* line 99, ../sass/screen.scss */
.NB-header { .NB-header {
display: none; display: none;
} }
/* line 100, ../sass/screen.scss */ /* line 103, ../sass/screen.scss */
.NB-footer-logo { .NB-footer-logo {
margin: 20px auto; margin: 20px auto;
width: 700px; width: 700px;
text-align: center; text-align: center;
} }
/* line 106, ../sass/screen.scss */ /* line 109, ../sass/screen.scss */
.NC-header { .NC-header {
background: url('/media/img/circular/header_background.png') repeat 0 0; background: url('/media/img/circular/header_background.png') repeat 0 0;
height: 100px; height: 100px;
@ -112,12 +112,12 @@ a {
left: 0; left: 0;
z-index: 10; z-index: 10;
} }
/* line 116, ../sass/screen.scss */ /* line 119, ../sass/screen.scss */
.NC-header .NC-header-inner { .NC-header .NC-header-inner {
width: 700px; width: 700px;
margin: 0 auto; margin: 0 auto;
} }
/* line 120, ../sass/screen.scss */ /* line 123, ../sass/screen.scss */
.NC-header .NC-header-inner h1.NC-logo a { .NC-header .NC-header-inner h1.NC-logo a {
width: 217px; width: 217px;
height: 100px; height: 100px;
@ -126,7 +126,7 @@ a {
float: left; float: left;
background: url('/media/img/circular/circular_logo.png') repeat-x 0 0; background: url('/media/img/circular/circular_logo.png') repeat-x 0 0;
} }
/* line 129, ../sass/screen.scss */ /* line 132, ../sass/screen.scss */
.NC-header .NC-header-inner .NC-invite-button { .NC-header .NC-header-inner .NC-invite-button {
float: right; float: right;
border: 1px solid #4388b5; border: 1px solid #4388b5;
@ -148,10 +148,12 @@ a {
line-height: 20px; line-height: 20px;
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
padding: 5px 20px; padding: 4px 15px;
font-size: 14px;
margin-top: 32px; margin-top: 32px;
margin-left: 10px;
} }
/* line 69, ../sass/screen.scss */ /* line 72, ../sass/screen.scss */
.NC-header .NC-header-inner .NC-invite-button:hover { .NC-header .NC-header-inner .NC-invite-button:hover {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6bb1e0), color-stop(100%, #6bb1e0)); background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6bb1e0), color-stop(100%, #6bb1e0));
background-image: -webkit-linear-gradient(#6bb1e0, #6bb1e0); background-image: -webkit-linear-gradient(#6bb1e0, #6bb1e0);
@ -159,7 +161,7 @@ a {
background-image: -o-linear-gradient(#6bb1e0, #6bb1e0); background-image: -o-linear-gradient(#6bb1e0, #6bb1e0);
background-image: linear-gradient(#6bb1e0, #6bb1e0); background-image: linear-gradient(#6bb1e0, #6bb1e0);
} }
/* line 73, ../sass/screen.scss */ /* line 76, ../sass/screen.scss */
.NC-header .NC-header-inner .NC-invite-button:active { .NC-header .NC-header-inner .NC-invite-button:active {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4d98d2), color-stop(100%, #4d98d2)); background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4d98d2), color-stop(100%, #4d98d2));
background-image: -webkit-linear-gradient(#4d98d2, #4d98d2); background-image: -webkit-linear-gradient(#4d98d2, #4d98d2);
@ -170,13 +172,61 @@ a {
-moz-box-shadow: inset 0px 0px 10px #1f74b8; -moz-box-shadow: inset 0px 0px 10px #1f74b8;
box-shadow: inset 0px 0px 10px #1f74b8; box-shadow: inset 0px 0px 10px #1f74b8;
} }
/* line 139, ../sass/screen.scss */
.NC-header .NC-header-inner .NC-comment-toggle-button {
float: right;
border: 1px solid #bdbdbd;
-webkit-border-radius: 3px 3px;
-moz-border-radius: 3px / 3px;
border-radius: 3px / 3px;
-webkit-box-shadow: inset 0px 0px 2px white;
-moz-box-shadow: inset 0px 0px 2px white;
box-shadow: inset 0px 0px 2px white;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #f6f6f6));
background-image: -webkit-linear-gradient(#ffffff, #f6f6f6);
background-image: -moz-linear-gradient(#ffffff, #f6f6f6);
background-image: -o-linear-gradient(#ffffff, #f6f6f6);
background-image: linear-gradient(#ffffff, #f6f6f6);
text-shadow: 0px -1px 1px white;
color: gray;
height: 20px;
text-transform: capitalize;
line-height: 20px;
text-align: center;
cursor: pointer;
padding: 4px 15px;
font-size: 14px;
margin-top: 32px;
margin-left: 10px;
}
/* line 45, ../sass/screen.scss */
.NC-header .NC-header-inner .NC-comment-toggle-button:hover {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f6f6f6), color-stop(100%, #ffffff));
background-image: -webkit-linear-gradient(#f6f6f6, #ffffff);
background-image: -moz-linear-gradient(#f6f6f6, #ffffff);
background-image: -o-linear-gradient(#f6f6f6, #ffffff);
background-image: linear-gradient(#f6f6f6, #ffffff);
}
/* line 49, ../sass/screen.scss */
.NC-header .NC-header-inner .NC-comment-toggle-button:active {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e9e9e9), color-stop(100%, #e9e9e9));
background-image: -webkit-linear-gradient(#e9e9e9, #e9e9e9);
background-image: -moz-linear-gradient(#e9e9e9, #e9e9e9);
background-image: -o-linear-gradient(#e9e9e9, #e9e9e9);
background-image: linear-gradient(#e9e9e9, #e9e9e9);
-webkit-box-shadow: inset 0px 0px 10px #c1c1c1;
-moz-box-shadow: inset 0px 0px 10px #c1c1c1;
box-shadow: inset 0px 0px 10px #c1c1c1;
text-shadow: 0px -1px 1px white;
color: #333333;
}
/* line 137, ../sass/screen.scss */ /* line 148, ../sass/screen.scss */
.NB-mark { .NB-mark {
margin: 20px 0 50px 0; margin: 20px 0 50px 0;
} }
/* line 141, ../sass/screen.scss */ /* line 152, ../sass/screen.scss */
.NB-story-wrapper { .NB-story-wrapper {
border-left: 5px solid #fff; border-left: 5px solid #fff;
padding: 25px 25px 15px; padding: 25px 25px 15px;
@ -188,7 +238,7 @@ a {
-moz-box-shadow: 0px 0px 2px #c8c8c8; -moz-box-shadow: 0px 0px 2px #c8c8c8;
box-shadow: 0px 0px 2px #c8c8c8; box-shadow: 0px 0px 2px #c8c8c8;
} }
/* line 150, ../sass/screen.scss */ /* line 161, ../sass/screen.scss */
.NB-story-wrapper .NB-story-title a { .NB-story-wrapper .NB-story-title a {
font-size: 20px; font-size: 20px;
font-weight: bold; font-weight: bold;
@ -196,7 +246,7 @@ a {
text-decoration: none; text-decoration: none;
color: #333333; color: #333333;
} }
/* line 158, ../sass/screen.scss */ /* line 169, ../sass/screen.scss */
.NB-story-wrapper .NB-story-title span { .NB-story-wrapper .NB-story-title span {
font-size: 14px; font-size: 14px;
color: gray; color: gray;
@ -204,17 +254,17 @@ a {
display: inline-block; display: inline-block;
/* to ensure that the author is always on one line */ /* to ensure that the author is always on one line */
} }
/* line 166, ../sass/screen.scss */ /* line 177, ../sass/screen.scss */
.NB-story-wrapper .NB-feed { .NB-story-wrapper .NB-feed {
margin: 2px 0 10px; margin: 2px 0 10px;
text-transform: capitalize; text-transform: capitalize;
} }
/* line 170, ../sass/screen.scss */ /* line 181, ../sass/screen.scss */
.NB-story-wrapper .NB-feed a { .NB-story-wrapper .NB-feed a {
color: gray; color: gray;
font-size: 12px; font-size: 12px;
} }
/* line 175, ../sass/screen.scss */ /* line 186, ../sass/screen.scss */
.NB-story-wrapper .NB-feed img { .NB-story-wrapper .NB-feed img {
float: left; float: left;
width: 16px; width: 16px;
@ -222,7 +272,7 @@ a {
margin-right: 4px; margin-right: 4px;
} }
/* line 184, ../sass/screen.scss */ /* line 195, ../sass/screen.scss */
.NB-story { .NB-story {
font-size: 14px; font-size: 14px;
line-height: 140%; line-height: 140%;
@ -231,23 +281,23 @@ a {
*/ */
} }
/* line 188, ../sass/screen.scss */ /* line 199, ../sass/screen.scss */
.NB-story .NB-story-content-wrapper { .NB-story .NB-story-content-wrapper {
margin: 10px 0; margin: 10px 0;
max-height: 300px; max-height: 300px;
overflow: hidden; overflow: hidden;
} }
/* line 199, ../sass/screen.scss */ /* line 210, ../sass/screen.scss */
.NB-story .NB-story-content p { .NB-story .NB-story-content p {
margin: 10px 0; margin: 10px 0;
} }
/* line 203, ../sass/screen.scss */ /* line 214, ../sass/screen.scss */
.NB-story .NB-story-content img { .NB-story .NB-story-content img {
width: 100% !important; width: 100% !important;
height: auto !important; height: auto !important;
margin: 10px 0; margin: 10px 0;
} }
/* line 210, ../sass/screen.scss */ /* line 221, ../sass/screen.scss */
.NB-story .NB-story-content-expander { .NB-story .NB-story-content-expander {
display: none; display: none;
position: absolute; position: absolute;
@ -258,31 +308,31 @@ a {
color: #1a9fff; color: #1a9fff;
font-size: 14px; font-size: 14px;
} }
/* line 221, ../sass/screen.scss */ /* line 232, ../sass/screen.scss */
.NB-story .NB-story-content-expander .NB-story-content-expander-text, .NB-story .NB-story-content-expander .NB-story-content-expander-text,
.NB-story .NB-story-content-expander .NB-story-content-expander-pages { .NB-story .NB-story-content-expander .NB-story-content-expander-pages {
display: inline-block; display: inline-block;
} }
/* line 227, ../sass/screen.scss */ /* line 238, ../sass/screen.scss */
.NB-story-shares-container { .NB-story-shares-container {
text-align: right; text-align: right;
color: gray; color: gray;
font-size: 11px; font-size: 11px;
line-height: 16px; line-height: 16px;
} }
/* line 233, ../sass/screen.scss */ /* line 244, ../sass/screen.scss */
.NB-story-shares-container .NB-story-share-label { .NB-story-shares-container .NB-story-share-label {
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
margin-top: 3px; margin-top: 3px;
} }
/* line 239, ../sass/screen.scss */ /* line 250, ../sass/screen.scss */
.NB-story-shares-container .NB-user-avatar { .NB-story-shares-container .NB-user-avatar {
display: inline-block; display: inline-block;
margin: 2px 0 0 2px; margin: 2px 0 0 2px;
} }
/* line 243, ../sass/screen.scss */ /* line 254, ../sass/screen.scss */
.NB-story-shares-container .NB-user-avatar img { .NB-story-shares-container .NB-user-avatar img {
-webkit-box-shadow: 0px 0px 1px #bdbdbd; -webkit-box-shadow: 0px 0px 1px #bdbdbd;
-moz-box-shadow: 0px 0px 1px #bdbdbd; -moz-box-shadow: 0px 0px 1px #bdbdbd;
@ -292,13 +342,18 @@ a {
display: block; display: block;
} }
/* line 252, ../sass/screen.scss */ /* line 263, ../sass/screen.scss */
body.NC-hide-comments .NB-story-comments-container {
display: none;
}
/* line 267, ../sass/screen.scss */
.NB-story-comments-container { .NB-story-comments-container {
font-size: 14px; font-size: 14px;
width: 586px; width: 586px;
margin: 0 auto; margin: 0 auto;
} }
/* line 258, ../sass/screen.scss */ /* line 273, ../sass/screen.scss */
.NB-story-comments-container .NB-user-avatar img, .NB-story-comments-container .NB-user-avatar img,
.NB-story-comments-container img.NB-user-avatar { .NB-story-comments-container img.NB-user-avatar {
position: absolute; position: absolute;
@ -311,38 +366,38 @@ a {
border-radius: 3px / 3px; border-radius: 3px / 3px;
/* @include single-box-shadow; gets in the way of transparent PNGs */ /* @include single-box-shadow; gets in the way of transparent PNGs */
} }
/* line 268, ../sass/screen.scss */ /* line 283, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment { .NB-story-comments-container .NB-story-comment {
padding: 15px 0 18px 44px; padding: 15px 0 18px 44px;
border-bottom: 1px solid #bdbdbd; border-bottom: 1px solid #bdbdbd;
position: relative; position: relative;
min-height: 32px; min-height: 32px;
} }
/* line 274, ../sass/screen.scss */ /* line 289, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment .NB-story-comment-username { .NB-story-comments-container .NB-story-comment .NB-story-comment-username {
float: left; float: left;
font-size: 12px; font-size: 12px;
font-weight: bold; font-weight: bold;
} }
/* line 280, ../sass/screen.scss */ /* line 295, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment .NB-story-comment-date { .NB-story-comments-container .NB-story-comment .NB-story-comment-date {
float: right; float: right;
font-size: 12px; font-size: 12px;
color: gray; color: gray;
text-shadow: 0px 1px 1px white; text-shadow: 0px 1px 1px white;
} }
/* line 288, ../sass/screen.scss */ /* line 303, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment .NB-story-comment-reply-button, .NB-story-comments-container .NB-story-comment .NB-story-comment-reply-button,
.NB-story-comments-container .NB-story-comment .NB-story-comment-edit-button { .NB-story-comments-container .NB-story-comment .NB-story-comment-edit-button {
display: none; display: none;
} }
/* line 292, ../sass/screen.scss */ /* line 307, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment .NB-story-comment-content { .NB-story-comments-container .NB-story-comment .NB-story-comment-content {
padding-top: 4px; padding-top: 4px;
line-height: 18px; line-height: 18px;
clear: both; clear: both;
} }
/* line 299, ../sass/screen.scss */ /* line 314, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment-replies { .NB-story-comments-container .NB-story-comment-replies {
margin-left: -29px; margin-left: -29px;
margin-top: 15px; margin-top: 15px;
@ -351,13 +406,13 @@ a {
position: relative; position: relative;
min-height: 32px; min-height: 32px;
} }
/* line 307, ../sass/screen.scss */ /* line 322, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment-replies .NB-story-comment-reply-content { .NB-story-comments-container .NB-story-comment-replies .NB-story-comment-reply-content {
padding-top: 4px; padding-top: 4px;
line-height: 18px; line-height: 18px;
clear: both; clear: both;
} }
/* line 314, ../sass/screen.scss */ /* line 329, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment-input { .NB-story-comments-container .NB-story-comment-input {
width: 376px; width: 376px;
height: 16px; height: 16px;
@ -366,7 +421,7 @@ a {
padding: 6px 4px; padding: 6px 4px;
border: 1px solid #bdbdbd; border: 1px solid #bdbdbd;
} }
/* line 324, ../sass/screen.scss */ /* line 339, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment-buttons .NB-story-comment-save { .NB-story-comments-container .NB-story-comment-buttons .NB-story-comment-save {
position: absolute; position: absolute;
top: 15px; top: 15px;
@ -391,8 +446,10 @@ a {
line-height: 20px; line-height: 20px;
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
padding: 4px 15px;
font-size: 14px;
} }
/* line 43, ../sass/screen.scss */ /* line 45, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment-buttons .NB-story-comment-save:hover { .NB-story-comments-container .NB-story-comment-buttons .NB-story-comment-save:hover {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f6f6f6), color-stop(100%, #ffffff)); background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f6f6f6), color-stop(100%, #ffffff));
background-image: -webkit-linear-gradient(#f6f6f6, #ffffff); background-image: -webkit-linear-gradient(#f6f6f6, #ffffff);
@ -400,7 +457,7 @@ a {
background-image: -o-linear-gradient(#f6f6f6, #ffffff); background-image: -o-linear-gradient(#f6f6f6, #ffffff);
background-image: linear-gradient(#f6f6f6, #ffffff); background-image: linear-gradient(#f6f6f6, #ffffff);
} }
/* line 47, ../sass/screen.scss */ /* line 49, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment-buttons .NB-story-comment-save:active { .NB-story-comments-container .NB-story-comment-buttons .NB-story-comment-save:active {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e9e9e9), color-stop(100%, #e9e9e9)); background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e9e9e9), color-stop(100%, #e9e9e9));
background-image: -webkit-linear-gradient(#e9e9e9, #e9e9e9); background-image: -webkit-linear-gradient(#e9e9e9, #e9e9e9);
@ -413,11 +470,11 @@ a {
text-shadow: 0px -1px 1px white; text-shadow: 0px -1px 1px white;
color: #333333; color: #333333;
} }
/* line 332, ../sass/screen.scss */ /* line 347, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comment-buttons .NB-story-comment-delete { .NB-story-comments-container .NB-story-comment-buttons .NB-story-comment-delete {
display: none; display: none;
} }
/* line 337, ../sass/screen.scss */ /* line 352, ../sass/screen.scss */
.NB-story-comments-container .NB-story-comments-public-header-wrapper { .NB-story-comments-container .NB-story-comments-public-header-wrapper {
color: gray; color: gray;
font-size: 12px; font-size: 12px;
@ -425,8 +482,9 @@ a {
padding: 3px 0; padding: 3px 0;
} }
/* line 345, ../sass/screen.scss */ /* line 361, ../sass/screen.scss */
.NB-page-controls-next, .NB-page-controls-end { .NB-page-controls-next,
.NB-page-controls-end {
background-color: #6eb4e3; background-color: #6eb4e3;
border: 1px solid #4388b5; border: 1px solid #4388b5;
-webkit-border-radius: 3px 3px; -webkit-border-radius: 3px 3px;
@ -447,7 +505,8 @@ a {
line-height: 20px; line-height: 20px;
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
padding: 5px 20px; padding: 4px 15px;
font-size: 14px;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
-webkit-transition: all .12s ease-out; -webkit-transition: all .12s ease-out;
@ -455,16 +514,18 @@ a {
-o-transition: all .12s ease-out; -o-transition: all .12s ease-out;
-ms-transition: all .12s ease-out; -ms-transition: all .12s ease-out;
} }
/* line 69, ../sass/screen.scss */ /* line 72, ../sass/screen.scss */
.NB-page-controls-next:hover, .NB-page-controls-end:hover { .NB-page-controls-next:hover,
.NB-page-controls-end:hover {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6bb1e0), color-stop(100%, #6bb1e0)); background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6bb1e0), color-stop(100%, #6bb1e0));
background-image: -webkit-linear-gradient(#6bb1e0, #6bb1e0); background-image: -webkit-linear-gradient(#6bb1e0, #6bb1e0);
background-image: -moz-linear-gradient(#6bb1e0, #6bb1e0); background-image: -moz-linear-gradient(#6bb1e0, #6bb1e0);
background-image: -o-linear-gradient(#6bb1e0, #6bb1e0); background-image: -o-linear-gradient(#6bb1e0, #6bb1e0);
background-image: linear-gradient(#6bb1e0, #6bb1e0); background-image: linear-gradient(#6bb1e0, #6bb1e0);
} }
/* line 73, ../sass/screen.scss */ /* line 76, ../sass/screen.scss */
.NB-page-controls-next:active, .NB-page-controls-end:active { .NB-page-controls-next:active,
.NB-page-controls-end:active {
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4d98d2), color-stop(100%, #4d98d2)); background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4d98d2), color-stop(100%, #4d98d2));
background-image: -webkit-linear-gradient(#4d98d2, #4d98d2); background-image: -webkit-linear-gradient(#4d98d2, #4d98d2);
background-image: -moz-linear-gradient(#4d98d2, #4d98d2); background-image: -moz-linear-gradient(#4d98d2, #4d98d2);
@ -474,8 +535,9 @@ a {
-moz-box-shadow: inset 0px 0px 10px #1f74b8; -moz-box-shadow: inset 0px 0px 10px #1f74b8;
box-shadow: inset 0px 0px 10px #1f74b8; box-shadow: inset 0px 0px 10px #1f74b8;
} }
/* line 356, ../sass/screen.scss */ /* line 372, ../sass/screen.scss */
.NB-page-controls-next .NB-page-controls-text, .NB-page-controls-end .NB-page-controls-text { .NB-page-controls-next .NB-page-controls-text,
.NB-page-controls-end .NB-page-controls-text {
position: absolute; position: absolute;
left: 0; left: 0;
width: 100%; width: 100%;

22
media/css/circular/sass/screen.scss
View file

@ -39,6 +39,8 @@ $default-box-shadow-blur: 1px;
line-height: 20px; line-height: 20px;
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
padding: 4px 15px;
font-size: 14px;
&:hover { &:hover {
@include background-image(linear-gradient(#f6f6f6, white)); @include background-image(linear-gradient(#f6f6f6, white));
@ -64,7 +66,8 @@ $default-box-shadow-blur: 1px;
line-height: 20px; line-height: 20px;
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
padding: 5px 20px; padding: 4px 15px;
font-size: 14px;
&:hover { &:hover {
@include background-image(linear-gradient(#6bb1e0, #6bb1e0)); @include background-image(linear-gradient(#6bb1e0, #6bb1e0));
@ -130,6 +133,14 @@ a {
float: right; float: right;
@include NC-blue-button; @include NC-blue-button;
margin-top: 32px; margin-top: 32px;
margin-left: 10px;
}
.NC-comment-toggle-button {
float: right;
@include NC-default-button;
margin-top: 32px;
margin-left: 10px;
} }
} }
} }
@ -249,11 +260,15 @@ a {
} }
} }
body.NC-hide-comments .NB-story-comments-container {
display: none;
}
.NB-story-comments-container { .NB-story-comments-container {
font-size: $small-font-size; font-size: $small-font-size;
width: $comment-width; width: $comment-width;
margin: 0 auto; margin: 0 auto;
.NB-user-avatar img, .NB-user-avatar img,
img.NB-user-avatar { img.NB-user-avatar {
position: absolute; position: absolute;
@ -342,7 +357,8 @@ a {
} }
} }
.NB-page-controls-next, .NB-page-controls-end { .NB-page-controls-next,
.NB-page-controls-end {
background-color: #6eb4e3; background-color: #6eb4e3;
@include NC-blue-button; @include NC-blue-button;
position: relative; position: relative;

6
templates/social/social_page.xhtml
View file

@ -64,6 +64,8 @@
<header class="NC-header"> <header class="NC-header">
<div class="NC-header-inner"> <div class="NC-header-inner">
<h1 class="NC-logo"><a href="/">Circular</a></h1> <h1 class="NC-logo"><a href="/">Circular</a></h1>
<div class="NC-button NC-comment-toggle-button">Toggle Comments</div>
<div class="NC-button NC-invite-button">Request an Invite</div> <div class="NC-button NC-invite-button">Request an Invite</div>
</div> </div>
</header> </header>
@ -154,6 +156,10 @@
if ($(window).width() < 600) { if ($(window).width() < 600) {
$('meta[name=viewport]').attr('content','initial-scale=0.9, maximum-scale=1.5'); $('meta[name=viewport]').attr('content','initial-scale=0.9, maximum-scale=1.5');
} }
$('.NC-comment-toggle-button').click(function(){
$('body').toggleClass('NC-hide-comments')
});
</script> </script>
</body> </body>

2
templates/social/social_story.xhtml
View file

@ -19,7 +19,7 @@
<h2 class="NB-story-title"> <h2 class="NB-story-title">
<a href="{{ story.story_permalink }}">{{ story.story_title }}</a> <a href="{{ story.story_permalink }}">{{ story.story_title }}</a>
{% if story.story_authors %} {% if story.story_authors %}
<span class="NB-story-author">by {{ story.story_authors }}</span> <span class="NB-story-author">{{ story.story_authors }}</span>
{% endif %} {% endif %}
</h2> </h2>