Adjust articles that show up in side sticky bar (#254)
* Add user articles to sidebar * Add organization save-all functionality * Adjust articles that show up in side sticky bar * Add conditional for @user_stickies to show up
This commit is contained in:
Ben Halpern
GitHub
parent
870325677e
commit
0281849e23
9 changed files with 63 additions and 38 deletions
|
|
@ -52,12 +52,11 @@ header{
|
|||
max-width:1024px;
|
||||
background: transparent no-repeat top center;
|
||||
background-size: cover;
|
||||
margin-top:60px;
|
||||
z-index:2;
|
||||
padding-top: 42%;
|
||||
@media screen and ( min-width: 880px ){
|
||||
border-top-left-radius: 3px;
|
||||
border-top-right-radius: 3px;
|
||||
border-top-left-radius: 2px;
|
||||
border-top-right-radius: 2px;
|
||||
}
|
||||
}
|
||||
.category-banner{
|
||||
|
|
@ -79,6 +78,8 @@ header{
|
|||
box-shadow: $shadow;
|
||||
margin:60px auto 20px;
|
||||
text-align: left;
|
||||
border: 1px solid darken($light-medium-gray, 2%);
|
||||
box-shadow: 3px 4px 0px darken($light-medium-gray, 2%);
|
||||
@media screen and ( min-width: 1250px ){
|
||||
margin-top:80px;
|
||||
border-radius: 3px;
|
||||
|
|
|
|||
|
|
@ -234,7 +234,7 @@ a.header-link{
|
|||
resize:none;
|
||||
border-radius:3px;
|
||||
border:1px solid rgb(232, 229, 229);
|
||||
height:55px;
|
||||
height:75px;
|
||||
font-size:16px;
|
||||
padding:6px;
|
||||
transition: height 0.3s ease;
|
||||
|
|
@ -750,10 +750,13 @@ a.header-link{
|
|||
}
|
||||
a.register-now-cta{
|
||||
font-size:1.4em;
|
||||
background : rgb(254, 250, 135);
|
||||
background: lighten($yellow, 12%);
|
||||
border: 1px solid darken($yellow, 15%);
|
||||
box-shadow: 5px 6px 0px darken($yellow, 15%);
|
||||
color: $black;
|
||||
padding: 3px 10px;
|
||||
margin-right:5px;
|
||||
padding: 5px 10px;
|
||||
margin-right:8px;
|
||||
vertical-align: 20px;
|
||||
line-height:1.8em;
|
||||
}
|
||||
.current-user-actions{
|
||||
|
|
|
|||
|
|
@ -1,20 +1,20 @@
|
|||
@import 'variables';
|
||||
|
||||
footer{
|
||||
background: darken($tan,1%);
|
||||
margin-bottom:-60px;
|
||||
padding:80px 0px 100px;
|
||||
box-shadow: 0 -1px 4px 0 rgba(0, 0, 0, 0.15);
|
||||
// background: darken($tan,1%);
|
||||
z-index: 10;
|
||||
position: relative;
|
||||
.container{
|
||||
background: darken($tan,1%);
|
||||
width:92%;
|
||||
width:100%;
|
||||
margin:auto;
|
||||
max-width:800px;
|
||||
max-width:1200px;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
font-weight: 500;
|
||||
background: transparent;
|
||||
&.centered-footer{
|
||||
max-width: 820px;
|
||||
}
|
||||
a{
|
||||
color: $black;
|
||||
display:inline-block;
|
||||
|
|
@ -23,6 +23,20 @@ footer{
|
|||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
.inner-footer-container{
|
||||
max-width: 820px;
|
||||
background: $tan;
|
||||
border: 1px solid darken($light-medium-gray, 2%);
|
||||
box-shadow: 3px 4px 0px darken($light-medium-gray, 2%);
|
||||
padding:30px;
|
||||
line-height: 3em;
|
||||
margin:auto;
|
||||
@media screen and ( min-width: 1250px ){
|
||||
margin-left: 0px;
|
||||
margin-bottom: 60px;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@
|
|||
color: $medium-gray;
|
||||
padding: 10px 0px 5px;
|
||||
font-style: italic;
|
||||
font-size:0.9em;
|
||||
font-size:0.88em;
|
||||
}
|
||||
.primary-sticky-nav-author-follow{
|
||||
padding-top:8px;
|
||||
|
|
@ -43,7 +43,7 @@
|
|||
font-size:1.1em;
|
||||
border:0px;
|
||||
border-radius:3px;
|
||||
padding: 4px 3px;
|
||||
padding: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -54,7 +54,7 @@
|
|||
vertical-align: -5px;
|
||||
}
|
||||
.primary-sticky-nav-title{
|
||||
padding: 8px 0px 10px;
|
||||
padding: 8px 0px 9px;
|
||||
margin-left: 15px;
|
||||
font-weight: bold;
|
||||
img{
|
||||
|
|
@ -75,8 +75,8 @@
|
|||
background: white;
|
||||
margin-bottom: 10px;
|
||||
margin-left: 10px;
|
||||
border: 1px solid darken($light-medium-gray, 5%);
|
||||
box-shadow: 3px 4px 0px darken($light-medium-gray, 5%);
|
||||
border: 1px solid darken($light-medium-gray, 13%);
|
||||
box-shadow: 3px 4px 0px darken($light-medium-gray, 13%);
|
||||
color: $black;
|
||||
width: 262px;
|
||||
border-radius: 3px;
|
||||
|
|
@ -106,8 +106,8 @@
|
|||
}
|
||||
&:hover{
|
||||
color: $black;
|
||||
border: 1px solid darken($light-medium-gray, 15%);
|
||||
box-shadow: 3px 4px 0px darken($light-medium-gray, 15%);
|
||||
border: 1px solid darken($light-medium-gray, 17%);
|
||||
box-shadow: 3px 4px 0px darken($light-medium-gray, 17%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -280,7 +280,9 @@ class StoriesController < ApplicationController
|
|||
comment_count_num = Rails.env.production? ? 7 : -2
|
||||
tag_articles = []
|
||||
more_articles = []
|
||||
tag_articles = Article.tagged_with(@article.cached_tag_list_array, any: true).
|
||||
article_tags = @article.cached_tag_list_array
|
||||
article_tags.delete("discuss")
|
||||
tag_articles = Article.tagged_with(article_tags, any: true).
|
||||
includes(:user).
|
||||
where("positive_reactions_count > ? OR comments_count > ?", reaction_count_num, comment_count_num).
|
||||
where(published: true).
|
||||
|
|
@ -298,6 +300,12 @@ class StoriesController < ApplicationController
|
|||
order("RANDOM()").
|
||||
limit(10 - tag_articles.size)
|
||||
end
|
||||
|
||||
@user_stickies = (@organization || @user).articles.
|
||||
where(published: true).
|
||||
tagged_with(article_tags, any: true).
|
||||
where.not(id: @article.id).order("published_at DESC").
|
||||
limit(2)
|
||||
@sticky_articles = (tag_articles + more_articles).sample(8)
|
||||
end
|
||||
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@
|
|||
<%= follow_button(@actor) %>
|
||||
</div>
|
||||
</div>
|
||||
<% if @actor.articles.where(published: true).where.not(id: @article.id).any? %>
|
||||
<% if @user_stickies && @user_stickies.any? %>
|
||||
<div class="primary-sticky-nav-title">
|
||||
<% if @actor.username.size < 18 %>
|
||||
More from <a href="<%= @actor.path %>">@<%= @actor.username %></a>
|
||||
|
|
@ -43,9 +43,7 @@
|
|||
<% end %>
|
||||
</div>
|
||||
|
||||
<% @actor.articles.where(published: true).
|
||||
where.not(id: @article.id).order("published_at DESC").
|
||||
limit(2).each do |article| %>
|
||||
<% @user_stickies.each do |article| %>
|
||||
<a class="primary-sticky-nav-element primary-sticky-nav-author-element" href="<%= article.path %>">
|
||||
<img src="<%= ProfileImage.new(article.user).get(90) %>" class="primary-sticky-nav-profile-image" />
|
||||
<%= article.title %>
|
||||
|
|
|
|||
|
|
@ -173,10 +173,12 @@
|
|||
commentable: @article,
|
||||
commentable_type: "Article" %>
|
||||
<div class="comment-trees" id="comment-trees-container">
|
||||
<% cache "comment_root_#{user_signed_in?}", expires_in: 1.hours do %>
|
||||
<%= render "comments/login_cta_comment" %>
|
||||
<% end %>
|
||||
<% Comment.rooted_on(@article.id,"Article").order("score DESC").limit(@comments_to_show_count).each do |comment| %>
|
||||
<% Comment.rooted_on(@article.id,"Article").order("score DESC").limit(@comments_to_show_count).each_with_index do |comment, i| %>
|
||||
<% if i == 3 %>
|
||||
<% cache "comment_root_#{user_signed_in?}", expires_in: 1.hours do %>
|
||||
<%= render "comments/login_cta_comment" %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<% cache ["comment_root_#{user_signed_in?}", comment] do %>
|
||||
<%= render("/comments/comment",
|
||||
comment:comment,
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div class="comment-hash-marker" id="cta-comment-marker"></div>
|
||||
<div class="single-comment-node root comment-deep-0"
|
||||
id="cta-comment-register-now-node">
|
||||
<div class="inner-comment" style="box-shadow: 8px 8px 0px #4e57ef;border:4px solid #4e57ef;margin: 20px auto;">
|
||||
<div class="inner-comment">
|
||||
<div class="details">
|
||||
<a href="<%= User.first.path %>">
|
||||
<img class="profile-pic" src="<%= ProfileImage.new(User.first).get(50)%>" />
|
||||
|
|
@ -16,14 +16,13 @@
|
|||
</div>
|
||||
<div class="body">
|
||||
<p>
|
||||
Hey there, we see you aren't signed in.
|
||||
Hey there, we see you aren't signed in. (Yes you, the reader. This is a fake comment.)
|
||||
</p>
|
||||
<p>
|
||||
Please consider creating an account on <a href="https://dev.to">dev.to</a>. It literally takes a few seconds and <b><em>we'd appreciate the support so much</em></b>. ❤️
|
||||
</p>
|
||||
<button class="reaction-button" title="heart" style="margin-top: 10px;margin-bottom: -10px;">
|
||||
<%= image_tag "favorite-heart-outline-button.svg" %>
|
||||
<span class="reactions-count">1,337</span>
|
||||
<p>Plus, no fake comments when you're signed in. 🙃</p>
|
||||
<button class="reaction-button" title="heart" style="margin-top: 20px;margin-bottom: -20px;z-index:100;">
|
||||
</button>
|
||||
</div>
|
||||
<div class="actions">
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<footer>
|
||||
<div class="container">
|
||||
<div class="container <%= "centered-footer" if current_page.include?("index") %>">
|
||||
<div class="inner-footer-container">
|
||||
<a href="/">Home</a> <a href="/about">About</a> <a href="/membership">Sustaining Membership</a> <a href="/privacy">Privacy Policy</a> <a href="/terms">Terms of Use</a> <a href="/contact">Contact</a> <a href="/code-of-conduct">Code of Conduct</a>
|
||||
<br/>
|
||||
<br/>
|
||||
The DEV Community copyright 2018 🔥
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue