Profile UI update (#11357)
* tooltips 1.0.1 * tooltips 1.0.1 * profile layout * fix * whoops * better github repos * spec * brining back doc, and making liitle fixes * button placement, stats styling * rename
This commit is contained in:
parent
9f62711123
commit
de5a22ecf7
16 changed files with 198 additions and 220 deletions
3
app/assets/images/pin.svg
Normal file
3
app/assets/images/pin.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
|
||||
<path d="M22.314 10.172l-1.415 1.414-.707-.707-4.242 4.242-.707 3.536-1.415 1.414-4.242-4.243-4.95 4.95-1.414-1.414 4.95-4.95-4.243-4.242 1.414-1.415L8.88 8.05l4.242-4.242-.707-.707 1.414-1.415z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 293 B |
3
app/assets/images/post.svg
Normal file
3
app/assets/images/post.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M19 22H5a3 3 0 01-3-3V3a1 1 0 011-1h14a1 1 0 011 1v12h4v4a3 3 0 01-3 3zm-1-5v2a1 1 0 002 0v-2h-2zm-2 3V4H4v15a1 1 0 001 1h11zM6 7h8v2H6V7zm0 4h8v2H6v-2zm0 4h5v2H6v-2z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 274 B |
3
app/assets/images/tag.svg
Normal file
3
app/assets/images/tag.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M7.784 14l.42-4H4V8h4.415l.525-5h2.011l-.525 5h3.989l.525-5h2.011l-.525 5H20v2h-3.784l-.42 4H20v2h-4.415l-.525 5h-2.011l.525-5H9.585l-.525 5H7.049l.525-5H4v-2h3.784zm2.011 0h3.99l.42-4h-3.99l-.42 4z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 306 B |
|
|
@ -7,7 +7,7 @@
|
|||
initializeCommentPreview,
|
||||
initializeTimeFixer, initializeDashboardSort, initializePWAFunctionality,
|
||||
initializeEllipsisMenu, initializeArchivedPostFilter, initializeCreditsPage,
|
||||
initializeUserProfilePage, initializePodcastPlayback,
|
||||
initializeUserProfilePage, initializeProfileInfoToggle, initializePodcastPlayback,
|
||||
initializeVideoPlayback, initializeDrawerSliders,
|
||||
initializeHeroBannerClose, initializeOnboardingTaskCard, initScrolling,
|
||||
nextPage:writable, fetching:writable, done:writable, adClicked:writable,
|
||||
|
|
@ -57,6 +57,7 @@ function callInitializers() {
|
|||
initializeArchivedPostFilter();
|
||||
initializeCreditsPage();
|
||||
initializeUserProfilePage();
|
||||
initializeProfileInfoToggle();
|
||||
initializePodcastPlayback();
|
||||
initializeVideoPlayback();
|
||||
initializeDrawerSliders();
|
||||
|
|
|
|||
|
|
@ -33,3 +33,18 @@ function initializeUserProfilePage() {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
function initializeProfileInfoToggle() {
|
||||
const infoPanels = document.querySelector('.js-user-info');
|
||||
const trigger = document.querySelector('.js-user-info-trigger');
|
||||
const triggerWrapper = document.querySelector(
|
||||
'.js-user-info-trigger-wrapper',
|
||||
);
|
||||
|
||||
if (trigger && infoPanels) {
|
||||
trigger.addEventListener('click', () => {
|
||||
triggerWrapper.classList.replace('block', 'hidden');
|
||||
infoPanels.classList.replace('hidden', 'grid');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -105,7 +105,7 @@
|
|||
|
||||
.sidebar-navigation-links .crayons-icon svg {
|
||||
height: 24px;
|
||||
weight: 24px;
|
||||
width: 24px;
|
||||
}
|
||||
|
||||
@keyframes fade-in {
|
||||
|
|
@ -277,19 +277,6 @@
|
|||
max-width: calc(100% - 560px); // 560 = 2*280: two sidebars
|
||||
}
|
||||
|
||||
.pinned-articles {
|
||||
padding: 8px;
|
||||
margin: 0 auto;
|
||||
@include dev-card;
|
||||
|
||||
h5 {
|
||||
margin: 0 0 8px;
|
||||
padding: 8px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.placeholder-div {
|
||||
// TOOD: what is this?
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -126,6 +126,13 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
&--1-2 {
|
||||
@media (min-width: $breakpoint-l) {
|
||||
--layout-sidebar-left-width: 1fr;
|
||||
--layout-content-width: 2fr;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.crayons-layout--3-cols {
|
||||
|
|
|
|||
|
|
@ -1,77 +1,14 @@
|
|||
<% if @user.badge_achievements_count > 0 %>
|
||||
<style>
|
||||
.badge-achievement {
|
||||
display: block;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: black;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
.badge-achievement-image {
|
||||
width: auto !important;
|
||||
max-height: 110px;
|
||||
min-height: 10px;
|
||||
max-width: 230px;
|
||||
border-radius: 50%;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
border: 0px !important;
|
||||
margin: 3px;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.badge-achievement-info h2 {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.badge-achievement img:hover {
|
||||
opacity: 0.88 !important;
|
||||
}
|
||||
|
||||
.badge-widget {
|
||||
position: relative;
|
||||
overflow: auto;
|
||||
min-height: 105px;
|
||||
overflow: visible;
|
||||
display: grid;
|
||||
grid-template-columns: 50% 50%;
|
||||
}
|
||||
</style>
|
||||
<div style="overflow: visible;padding-top:20px;">
|
||||
<div class="widget-body badge-widget">
|
||||
<div class="crayons-card crayons-card--secondary">
|
||||
<header class="crayons-card__header">
|
||||
<h3 class="crayons-subtitle-3">Badges</h3>
|
||||
</header>
|
||||
<div class="crayons-card__body grid gap-4 grid-cols-3 m:grid-cols-2">
|
||||
<% @user.badge_achievements.order(id: :desc).includes(:badge).each do |achievement| %>
|
||||
<a class="badge-achievement" href="/badge/<%= achievement.badge.slug %>">
|
||||
<img
|
||||
src="<%= optimized_image_url(achievement.badge.badge_image_url, width: 180) %>"
|
||||
alt="<%= achievement.badge.title %>"
|
||||
title="<%= achievement.badge.title %>"
|
||||
class="badge-achievement-image mx-auto"
|
||||
style="transform: rotate(<%= -25 + (achievement.id.digits.first * 5) %>deg);
|
||||
margin-left: <%= achievement.id.digits.first * 3 %>px;
|
||||
margin-right: <%= achievement.id.digits.first * 1 %>px;" />
|
||||
<a href="/badge/<%= achievement.badge.slug %>" title="<%= achievement.badge.title %>">
|
||||
<img src="<%= optimized_image_url(achievement.badge.badge_image_url, width: 180) %>" alt="<%= achievement.badge.title %>" class="mx-auto max-w-100 h-auto align-middle" style="transform: rotate(<%= rand(-10..10) %>deg);" />
|
||||
</a>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
<% else %>
|
||||
<style>
|
||||
.widget-body {
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1024px) {
|
||||
.no-badges-text {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<div style="overflow: visible;padding-top:20px;">
|
||||
<div class="widget-body">
|
||||
<p class="no-badges-text">
|
||||
Eat and than sleep on your face annoy the old grumpy cat, start a fight and then retreat to wash when I lose and I shall purr myself to sleep or run around the house at 4 in the morning.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<% if @comments.present? %>
|
||||
<% if params[:view] == "comments" %>
|
||||
<div class="crayons-card__header">
|
||||
<h4 class="crayons-card__headline">
|
||||
<h4 class="crayons-subtitle-2">
|
||||
<% if @user.comments_count > 250 %>
|
||||
Last 250 comments
|
||||
<% else %>
|
||||
|
|
@ -18,7 +18,7 @@
|
|||
</div>
|
||||
<% else %>
|
||||
<div class="crayons-card__header">
|
||||
<h4 class="crayons-card__headline">
|
||||
<h4 class="crayons-subtitle-2">
|
||||
Recent comments
|
||||
</h4>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,21 +1,37 @@
|
|||
<% repositories.each do |repo| %>
|
||||
<a class="widget" href="<%= repo.url %>" target="_blank" rel="noopener">
|
||||
<header>
|
||||
<h4><span class="emoji"><img src="<%= asset_path("github-logo.svg") %>" alt="github logo"></span><%= repo.name %></h4>
|
||||
<% if repositories.present? %>
|
||||
<div class="crayons-card crayons-card--secondary">
|
||||
<header class="crayons-card__header">
|
||||
<h3 class="crayons-subtitle-3 flex items-center">GitHub Repositories</h3>
|
||||
</header>
|
||||
<div class="widget-body">
|
||||
<% if repo.description.present? %>
|
||||
<%= EmojiConverter.call(repo.description) %>
|
||||
|
||||
<div>
|
||||
<% repositories.each do |repo| %>
|
||||
<a href="<%= repo.url %>" target="_blank" rel="noopener" class="crayons-link crayons-link--contentful">
|
||||
<p class="fw-bold flex items-center">
|
||||
<%= repo.name %>
|
||||
</p>
|
||||
<% if repo.description.present? %>
|
||||
<p class="fs-s color-base-80 mb-1"><%= EmojiConverter.call(repo.description) %></p>
|
||||
<% end %>
|
||||
<p class="fs-s color-base-60 flex items-center">
|
||||
<% if repo.fork %>
|
||||
<span class="crayons-indicator mr-3">Fork</span>
|
||||
<% end %>
|
||||
|
||||
<% if repo.language %>
|
||||
<%= repo.language %>
|
||||
<% end %>
|
||||
|
||||
<% if repo.language && repo.stargazers_count.to_i > 0 %>
|
||||
<span class="opacity-50 inline-block px-1">•</span>
|
||||
<% end %>
|
||||
|
||||
<% if repo.stargazers_count.to_i > 0 %>
|
||||
<%= pluralize repo.stargazers_count, "star" %>
|
||||
<% end %>
|
||||
</p>
|
||||
</a>
|
||||
<% end %>
|
||||
<div class="widget-footer">
|
||||
<% if repo.fork %>
|
||||
<span class="widget-accent">fork</span>
|
||||
<% end %>
|
||||
<%= repo.language %>
|
||||
<% if repo.stargazers_count.to_i > 0 %>
|
||||
<img src="<%= asset_path("star.svg") %>" alt="star icon"> <%= repo.stargazers_count %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,16 @@
|
|||
<% if @pinned_stories.present? %>
|
||||
<div class="pinned-articles">
|
||||
<h5><img src="<%= asset_path("pushpin.svg") %>" width="20" height="20" alt="pin" /> Pinned</h5>
|
||||
<% @pinned_stories.each do |story| %>
|
||||
<%= render "articles/single_story", story: story, featured: false %>
|
||||
<% end %>
|
||||
<div class="crayons-card mb-2 border-2 border-solid border-accent-brand">
|
||||
<header>
|
||||
<h3 class="crayons-subtitle-3 inline-flex items-center bg-accent-brand color-base-inverted pl-3 pr-4 py-2 ml-4 -mt-2 radius-default">
|
||||
<%= inline_svg_tag("pin.svg", aria: true, class: "crayons-icon mr-2", title: "Pin") %>
|
||||
Pinned
|
||||
</h3>
|
||||
</header>
|
||||
<div class="p-4 pb-2 pt-3">
|
||||
<% @pinned_stories.each do |story| %>
|
||||
<%= render "articles/single_story", story: story, featured: false %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
<% @stories.each_with_index do |story, i| %>
|
||||
|
|
@ -18,4 +25,3 @@
|
|||
<% if @stories.size > 1 %>
|
||||
<div class="placeholder-div"></div>
|
||||
<% end %>
|
||||
<div class="single-article-small-pic" id="article-index-hidden-div" style="display:none"></div>
|
||||
|
|
|
|||
|
|
@ -1,18 +0,0 @@
|
|||
<%# it's highly unlikely a single use will belong to so many organizations to slow down
|
||||
this fetch, thus we can safely use the .present?/.each pattern to load them %>
|
||||
<% if @user.organizations.present? %>
|
||||
<div id="sidebar-organizations" class="widget">
|
||||
<div class="widget-suggested-follows-container">
|
||||
<header><h4>organizations</h4></header>
|
||||
<div class="widget-body">
|
||||
<% @user.organizations.each do |organization| %>
|
||||
<div class="widget-user-pic">
|
||||
<a href="/<%= organization.slug %>">
|
||||
<img src="<%= Images::Profile.call(organization.profile_image_url, length: 90) %>" alt="<%= organization.name %> profile image">
|
||||
</a>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
|
@ -1,62 +1,93 @@
|
|||
<div id="sidebar-wrapper-left" class="sidebar-wrapper sidebar-wrapper-left">
|
||||
<div class="sidebar-bg" id="sidebar-bg-left"></div>
|
||||
<div class="side-bar">
|
||||
<div class="user-sidebar">
|
||||
<% cache "user-profile-sidebar-profile-details-#{@user.id}-#{@user.profile_updated_at}", expires_in: 10.days do %>
|
||||
<% if @user.mostly_work_with.present? %>
|
||||
<div class="widget">
|
||||
<header>
|
||||
<h4>skills/languages</h4>
|
||||
</header>
|
||||
<div class="widget-body">
|
||||
<%= sanitized_sidebar @user.mostly_work_with %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
<% if @user.currently_learning.present? %>
|
||||
<div class="widget">
|
||||
<header>
|
||||
<h4>learning/trying</h4>
|
||||
</header>
|
||||
<div class="widget-body">
|
||||
<%= sanitized_sidebar @user.currently_learning %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
<% if @user.currently_hacking_on.present? %>
|
||||
<div class="widget">
|
||||
<header>
|
||||
<h4>projects and hacks</h4>
|
||||
</header>
|
||||
<div class="widget-body">
|
||||
<%= sanitized_sidebar @user.currently_hacking_on %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
<% if @user.available_for.present? %>
|
||||
<div class="widget">
|
||||
<header>
|
||||
<h4>available for</h4>
|
||||
</header>
|
||||
<div class="widget-body">
|
||||
<%= sanitized_sidebar @user.available_for %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<% cache "user-profile-sidebar-stats-#{@user.id}-#{@user.last_article_at&.rfc3339}-#{@user.last_comment_at&.rfc3339}-#{@user.following_tags_count}-#{@user.last_followed_at&.rfc3339}", expires_in: 10.days do %>
|
||||
<div class="sidebar-data">
|
||||
<div>
|
||||
<%= pluralize @user.articles.published.size, "Post" %> Published
|
||||
</div>
|
||||
<div>
|
||||
<%= pluralize @user.comments.where(deleted: false).size, "Comment" %> Written
|
||||
</div>
|
||||
<div>
|
||||
<%= pluralize @user.decorate.cached_followed_tags.size, "Tag" %> Followed
|
||||
</div>
|
||||
<div class="gap-2 m:gap-4 hidden m:grid js-user-info">
|
||||
<% cache "user-profile-sidebar-additional-#{@user.id}-#{@user.github_repos_updated_at}-#{@user.badge_achievements_count}-#{@user.organization_info_updated_at}", expires_in: 2.days do %>
|
||||
<% if @user.organizations.present? %>
|
||||
<div class="crayons-card crayons-card--secondary">
|
||||
<header class="crayons-card__header">
|
||||
<h3 class="crayons-subtitle-3 spec-org-titles">Organizations</h3>
|
||||
</header>
|
||||
<div>
|
||||
<%# it's highly unlikely a single use will belong to so many organizations to slow down this fetch, thus we can safely use the .present?/.each pattern to load them %>
|
||||
<% @user.organizations.each do |organization| %>
|
||||
<a href="/<%= organization.slug %>" class="flex items-center crayons-link crayons-link--contentful">
|
||||
<span class="crayons-logo crayons-logo--l mr-2 shrink-0">
|
||||
<img src="<%= Images::Profile.call(organization.profile_image_url, length: 90) %>" alt="<%= organization.name %> profile image" class="crayons-logo__image">
|
||||
</span>
|
||||
<h4 class="fs-base fw-medium"><%= organization.name %></h4>
|
||||
</a>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<%= render partial: "users/github_repositories_area", locals: { repositories: repositories } %>
|
||||
|
||||
<%= render "articles/badges_area" %>
|
||||
<% end %>
|
||||
|
||||
<% cache "user-profile-sidebar-profile-details-#{@user.id}-#{@user.profile_updated_at}", expires_in: 10.days do %>
|
||||
<% if @user.mostly_work_with.present? %>
|
||||
<div class="crayons-card crayons-card--secondary">
|
||||
<header class="crayons-card__header">
|
||||
<h3 class="crayons-subtitle-3">Skills/languages</h3>
|
||||
</header>
|
||||
|
||||
<div class="crayons-card__body">
|
||||
<%= sanitized_sidebar @user.mostly_work_with %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<% if @user.currently_learning.present? %>
|
||||
<div class="crayons-card crayons-card--secondary">
|
||||
<header class="crayons-card__header">
|
||||
<h3 class="crayons-subtitle-3">Learning/trying</h3>
|
||||
</header>
|
||||
|
||||
<div class="crayons-card__body">
|
||||
<%= sanitized_sidebar @user.currently_learning %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<% if @user.currently_hacking_on.present? %>
|
||||
<div class="crayons-card crayons-card--secondary">
|
||||
<header class="crayons-card__header">
|
||||
<h3 class="crayons-subtitle-3">Projects</h3>
|
||||
</header>
|
||||
|
||||
<div class="crayons-card__body">
|
||||
<%= sanitized_sidebar @user.currently_hacking_on %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<% if @user.available_for.present? %>
|
||||
<div class="crayons-card crayons-card--secondary">
|
||||
<header class="crayons-card__header">
|
||||
<h3 class="crayons-subtitle-3">Available for...</h3>
|
||||
</header>
|
||||
|
||||
<div class="crayons-card__body">
|
||||
<%= sanitized_sidebar @user.available_for %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
||||
<% cache "user-profile-sidebar-stats-#{@user.id}-#{@user.last_article_at&.rfc3339}-#{@user.last_comment_at&.rfc3339}-#{@user.following_tags_count}-#{@user.last_followed_at&.rfc3339}", expires_in: 10.days do %>
|
||||
<div class="crayons-card crayons-card--secondary p-4">
|
||||
<div class="flex items-center mb-4">
|
||||
<%= inline_svg_tag("post.svg", aria: true, class: "crayons-icon mr-3 color-base-50", title: "Post") %>
|
||||
<%= pluralize @user.articles.published.size, "post" %> published
|
||||
</div>
|
||||
<div class="flex items-center mb-4">
|
||||
<%= inline_svg_tag("comment.svg", aria: true, class: "crayons-icon mr-3 color-base-50", title: "Comment") %>
|
||||
<%= pluralize @user.comments.where(deleted: false).size, "comment" %> written
|
||||
</div>
|
||||
<div class="flex items-center">
|
||||
<%= inline_svg_tag("tag.svg", aria: true, class: "crayons-icon mr-3 color-base-50", title: "Tag") %>
|
||||
<%= pluralize @user.decorate.cached_followed_tags.size, "tag" %> followed
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,10 +0,0 @@
|
|||
<div id="sidebar-wrapper-right" class="sidebar-wrapper sidebar-wrapper-right">
|
||||
<div class="sidebar-bg" id="sidebar-bg-right">
|
||||
</div>
|
||||
|
||||
<div class="side-bar sidebar-additional showing" id="sidebar-additional">
|
||||
<%= render "users/organizations_area" %>
|
||||
<%= render partial: "users/github_repositories_area", locals: { repositories: repositories } %>
|
||||
<%= render "articles/badges_area" %>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -18,7 +18,7 @@
|
|||
}
|
||||
</style>
|
||||
<div class="brand-bg">
|
||||
<div class="crayons-layout pt-7 m:pt-9">
|
||||
<div class="crayons-layout crayons-layout--limited-l pt-7 m:pt-9">
|
||||
<header class="profile-header crayons-card mt-2">
|
||||
<div class="relative profile-header__top">
|
||||
<span class="crayons-avatar crayons-avatar--3xl">
|
||||
|
|
@ -149,6 +149,10 @@
|
|||
|
||||
<%= render "users/metadata" %>
|
||||
|
||||
<div class="p-3 pt-0 block m:hidden js-user-info-trigger-wrapper">
|
||||
<button type="button" class="crayons-btn crayons-btn--outlined w-100 js-user-info-trigger">More info about user...</button>
|
||||
</div>
|
||||
|
||||
<div class="crayons-modal align-left hidden">
|
||||
<div class="crayons-modal__box">
|
||||
<div class="crayons-modal__box__header">
|
||||
|
|
@ -177,23 +181,19 @@
|
|||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="home sub-home" id="index-container"
|
||||
data-params="<%= params.merge(user_id: @user.id, class_name: "Article", sort_by: "published_at", sort_direction: "desc").to_json(only: %i[tag user_id q class_name sort_by sort_direction]) %>" data-which="<%= @list_of %>"
|
||||
data-tag=""
|
||||
data-feed="<%= params[:timeframe] || "base-feed" %>"
|
||||
data-articles-since="0">
|
||||
<%= render "users/sidebar" %>
|
||||
<div class="articles-list" id="articles-list">
|
||||
<div class="on-page-nav-controls user-nav-controls" id="on-page-nav-controls">
|
||||
<button class="on-page-nav-butt on-page-nav-butt-left" id="on-page-nav-butt-left" aria-label="nav-button-left">
|
||||
<div class="crayons-icon nav-icon">
|
||||
<%= SiteConfig.left_navbar_svg_icon.html_safe %>
|
||||
</div>
|
||||
</button>
|
||||
<button class="on-page-nav-butt on-page-nav-butt-right" style="margin-top:-1px;" id="on-page-nav-butt-right" aria-label="nav-button-right">
|
||||
<img style="height:28px;width:28px;" src="<%= asset_path "ribbon.svg" %>" alt="right-sidebar-nav">
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="crayons-layout crayons-layout--limited-l crayons-layout--2-cols crayons-layout--2-cols--1-2 pt-4 m:pt-0"
|
||||
id="index-container"
|
||||
data-params="<%= params.merge(user_id: @user.id, class_name: "Article", sort_by: "published_at", sort_direction: "desc").to_json(only: %i[tag user_id q class_name sort_by sort_direction]) %>" data-which="<%= @list_of %>"
|
||||
data-tag=""
|
||||
data-feed="<%= params[:timeframe] || "base-feed" %>"
|
||||
data-articles-since="0">
|
||||
|
||||
<div class="crayons-layout__sidebar-left">
|
||||
<%= render partial: "users/sidebar", locals: { repositories: @github_repositories } %>
|
||||
</div>
|
||||
|
||||
<main class="crayons-layout__content articles-list" id="articles-list">
|
||||
<div class="substories" id="substories">
|
||||
<% if params[:view] == "comments" %>
|
||||
<%= render "users/comments_section" %>
|
||||
|
|
@ -204,10 +204,7 @@
|
|||
<div class="loading-articles" id="loading-articles">
|
||||
loading...
|
||||
</div>
|
||||
</div>
|
||||
<% cache "user-profile-sidebar-additional-#{@user.id}-#{@user.github_repos_updated_at}-#{@user.badge_achievements_count}-#{@user.organization_info_updated_at}", expires_in: 2.days do %>
|
||||
<%= render partial: "users/sidebar_additional", locals: { repositories: @github_repositories } %>
|
||||
<% end %>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<%= render "stories/stories_list_script" %>
|
||||
|
|
|
|||
|
|
@ -76,7 +76,7 @@ RSpec.describe "User index", type: :system, stub_elasticsearch: true do
|
|||
|
||||
it "shows organizations", js: true do
|
||||
Capybara.current_session.driver.browser.manage.window.resize_to(1920, 1080)
|
||||
expect(page).to have_css("#sidebar-wrapper-right h4", text: "organizations")
|
||||
expect(page).to have_css(".spec-org-titles", text: "Organizations")
|
||||
end
|
||||
end
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue