diff --git a/public/css/topic.less b/public/css/topic.less
index 5cedae5113..08657b3a70 100644
--- a/public/css/topic.less
+++ b/public/css/topic.less
@@ -42,6 +42,9 @@
}
}
+ .post-signature {
+ margin-left: 5px;
+ }
.profile-block {
background: rgba(0, 0, 0, 0.02);
margin-right: -11px;
@@ -50,9 +53,10 @@
margin-top: 15px;
border-radius: 0 0 5px 5px;
font-size: 10px;
- line-height: 18px;
+ line-height: 15px;
padding: 5px;
padding-left: 10px;
+ color: #777;
img.hidden-desktop {
max-width: 10px;
@@ -64,7 +68,7 @@
}
.post-content {
min-height: 50px;
- padding: 2px 5px 0 5px;
+ padding: 10px 5px 0 5px;
word-wrap: break-word;
}
@@ -74,6 +78,24 @@
.post-block {
.post-buttons {
+ background: rgba(0, 0, 0, 0.02);
+ border: 1px solid rgba(0, 0, 0, 0.06);
+
+ margin-left: 0px;
+ margin-top: -5px;
+ padding-top: 8px;
+ padding-left: 23px;
+ padding-bottom: 0;
+ button.show {
+ display: inline-block !important;
+ }
+
+ @media (max-width: 767px) {
+ padding-left: 9px;
+ }
+
+ }
+ /*.post-buttons {
font-size: 12px;
float: right;
margin-right: 5px;
@@ -100,7 +122,7 @@
.icon-star {
//theme this to make it yellow eventually
}
- }
+ }*/
}
@@ -129,7 +151,7 @@
left: -7px;
border-style: solid;
border-width: 7px 7px 7px 0;
- border-color: transparent #FFFFFF;
+ border-color: transparent rgb(250,250,250);
display: block;
width: 0;
z-index: 1;
@@ -150,6 +172,27 @@
}
}
+ .sub-posts {
+ .post-content {
+ margin-left: 10px;
+ }
+ .post-signature {
+ margin-left: 15px;
+ }
+ .img-thumbnail {
+ padding: 2px;
+ border-radius: 0;
+ margin-left: 16px;
+ }
+ .post-buttons {
+ margin-top: -11px;
+ margin-left: -10px;
+ margin-right: -10px;
+ border-right: 0;
+ border-top: 0;
+ border-left: 0;
+ }
+ }
.main-post {
h3 {
margin: 0;
@@ -169,16 +212,20 @@
color: white;
position: relative;
float: left;
- margin-right: 25px;
+ margin-right:10px;
margin-bottom: 0px;
padding-bottom: 0px;
text-align: center;
- width:80px;
+ width:100px;
@media (max-width: 767px) {
display: none;
}
}
+ .img-thumbnail {
+ padding: 2px;
+ border-radius: 0;
+ }
.main-avatar:hover .hover-overlay {
opacity: 0.75;
@@ -208,9 +255,10 @@
}
.post-block {
.post-buttons {
- div {
- border: 0;
+ button.show {
+ display: inline-block!important;
}
+
}
}
.favourite {
@@ -220,7 +268,19 @@
display: inline-block;
}
- .topic-buttons {
+ .topic-buttons { //mix up with post-buttons, needs to be looked at
+ background: rgba(0, 0, 0, 0.02);
+ border: 1px solid rgba(0, 0, 0, 0.06);
+ margin-left: 92px;
+ padding: 10px;
+ margin-right: -11px;
+ border-right: 0;
+ @media (max-width: 767px) {
+ margin-left: -11px;
+ border-left: 0;
+ }
+
+
button.show {
display: inline-block!important;
}
@@ -230,3 +290,49 @@
}
+.topic-main-buttons {
+ @media (max-width: 767px) {
+ margin-bottom: 0px;
+ }
+}
+
+
+@media (max-width: 475px) {
+ .post-tools {
+ display: none;
+ }
+ .favourite-text {
+ display: none;
+ }
+}
+
+.post-author-info {
+ display: none;
+ @media (max-width: 767px) {
+ display: block;
+ position: fixed;
+ width: 100%;
+ margin-left: -15px;
+ bottom: -50px;
+ height: 50px;
+ background: rgba(0,0,0,0.8);
+ -webkit-transition: bottom 150ms linear;
+ -moz-transition: bottom 150ms linear;
+ -ms-transition: bottom 150ms linear;
+ -o-transition: bottom 150ms linear;
+ transition: bottom 150ms linear;
+ }
+
+ img {
+ padding: 5px;
+ }
+
+ h4 {
+ color: white;
+ margin-top:16px;
+ margin-left: -35px;
+ margin-bottom: 0px;
+ font-weight: 300;
+ font-size: 16px;
+ }
+}
\ No newline at end of file
diff --git a/public/src/forum/topic.js b/public/src/forum/topic.js
index 4833a166b6..d95684617c 100644
--- a/public/src/forum/topic.js
+++ b/public/src/forum/topic.js
@@ -600,4 +600,44 @@
deleteEl.addClass('none');
}
}
+
+
+
+ var postAuthorImage, postAuthorInfo;
+
+ function updateHeader() {
+ jQuery('.post-author-info').css('bottom', '0px');
+ postAuthorImage = postAuthorImage || document.getElementById('post-author-image');
+ postAuthorInfo = postAuthorInfo || document.getElementById('post-author-info');
+
+ var scrollTop = jQuery(window).scrollTop();
+ var scrollBottom = scrollTop + jQuery(window).height();
+
+ if (scrollTop < 50) {
+ postAuthorImage.src = (jQuery('.main-avatar img').attr('src'));
+ postAuthorInfo.innerHTML = 'Posted by ' + jQuery('.main-post').attr('data-username') + ', ' + jQuery('.main-post').find('.relativeTimeAgo').html();
+ return;
+ }
+
+ jQuery('.sub-posts').each(function() {
+ var el = jQuery(this);
+ var elTop = el.offset().top;
+ var height = Math.floor(el.height());
+ var elBottom = elTop + (height < 300 ? height : 300);
+
+ var inView = ((elBottom >= scrollTop) && (elTop <= scrollBottom)
+ && (elBottom <= scrollBottom) && (elTop >= scrollTop) );
+
+
+ if (inView) {
+
+ postAuthorImage.src = (jQuery(this).find('.profile-image-block img').attr('src'));
+ postAuthorInfo.innerHTML = 'Posted by ' + jQuery(this).attr('data-username') + ', ' + jQuery(this).find('.relativeTimeAgo').html();
+
+ }
+ });
+ }
+
+ window.onscroll = updateHeader;
+ window.onload = updateHeader;
})();
\ No newline at end of file
diff --git a/public/src/modules/mobileMenu.js b/public/src/modules/mobileMenu.js
index 115a0c750a..e1479dd03b 100644
--- a/public/src/modules/mobileMenu.js
+++ b/public/src/modules/mobileMenu.js
@@ -99,10 +99,11 @@ define(function() {
mobileMenu.init = function() {
+ return; // disabling until this can be pluginified.
overlay = overlay || document.getElementById('mobile-menu-overlay');
menuBtn = menuBtn || document.getElementById('mobile-menu-btn');
postBtn = postBtn || document.getElementById('mobile-post-btn');
-
+
menuBtn.onclick = function() {
animateIcons();
}
@@ -111,7 +112,7 @@ define(function() {
displayCategories();
mobileMenu.onNavigate();
});
-
+
}
return {
diff --git a/public/templates/footer.tpl b/public/templates/footer.tpl
index f2889d1e8c..43b614a83e 100644
--- a/public/templates/footer.tpl
+++ b/public/templates/footer.tpl
@@ -28,8 +28,8 @@
-
+
-