Communities

Writing
Writing
Codidact Meta
Codidact Meta
The Great Outdoors
The Great Outdoors
Photography & Video
Photography & Video
Scientific Speculation
Scientific Speculation
Cooking
Cooking
Electrical Engineering
Electrical Engineering
Judaism
Judaism
Languages & Linguistics
Languages & Linguistics
Software Development
Software Development
Mathematics
Mathematics
Christianity
Christianity
Code Golf
Code Golf
Music
Music
Physics
Physics
Linux Systems
Linux Systems
Power Users
Power Users
Tabletop RPGs
Tabletop RPGs
Community Proposals
Community Proposals
tag:snake search within a tag
answers:0 unanswered questions
user:xxxx search by author id
score:0.5 posts with 0.5+ score
"snake oil" exact phrase
votes:4 posts with 4+ votes
created:<1w created < 1 week ago
post_type:xxxx type of post
Search help
Notifications
Mark all as read See all your notifications »
Q&A

Welcome to Codidact Meta!

Codidact Meta is the meta-discussion site for the Codidact community network and the Codidact software. Whether you have bug reports or feature requests, support questions or rule discussions that touch the whole network – this is the site for you.

Comments on User profile page tabs separated from their connecting blue line

Post

User profile page tabs separated from their connecting blue line

+1
−0

On the user profile page there is a horizontal blue line across the top of the page that groups the tabs, with the currently showing tab highlighted in that same blue. On some of the tabs this shows correctly (those that are full width with no right hand panel). On others (those with a right hand panel) the tabs wrap around causing the horizontal blue line to be separated from the highlighted tab:

The Filters tab of the user profile page, with the Notifications tab wrapped to the next line

I'm not sure how best to fix this. Would it make sense to have the tab bar full width, with the right hand panel starting below it? Something like this:

The Filters tab of the user profile page, with the right hand panel moved down below the horizontal blue line of the tabs bar

History
Why does this post require attention from curators or moderators?
You might want to add some details to your flag.
Why should this post be closed?

1 comment thread

I wonder if we should make all the tabs uniform by dropping that right panel -- keep it for *pages ab... (6 comments)
I wonder if we should make all the tabs uniform by dropping that right panel -- keep it for *pages ab...
Monica Cellio‭ wrote 6 months ago

I wonder if we should make all the tabs uniform by dropping that right panel -- keep it for pages about community content, but drop it from pages about users. Maybe? It's inconsistent now, because some of those pages are necessarily wide to begin with, but it makes me wonder if we should drop it on all tabs.

trichoplax‭ wrote 6 months ago

I like that. For a few reasons:

  • The initial tab ("Profile") is already without a right panel.
  • Several of the tabs that do have a right panel have wrapping content so more of it would be visible without scrolling if they were full width.
  • Switching between tabs would look smoother if the layout didn't change.
  • Codidact isn't dependent on advertisers or investors, so there isn't the same demand to drive engagement at every opportunity - the right panel can be there when it's useful, rather than trying to fit it in everywhere.
Canina‭ wrote 6 months ago

Monica Cellio‭ An alternative approach (and I'm not arguing for whether it's better or worse than what you are suggesting) might be to ensure that the boxes always float below the tabs, rather than, as appears to be the case now, at the same vertical level as the tabs.

Monica Cellio‭ wrote 6 months ago

Canina‭ I think that's the proposal in the question, if I'm understanding correctly. That would work too, but thinking about how to do that made me step back and ask if we should even be showing that here in the first place. I'm raising possibilities, not asserting a preference.

trichoplax‭ wrote 6 months ago

Yes Canina's suggestion sounds like what I was initially suggesting (the second image in the question).

Generating the image just required drag and drop of one element in the Firefox developer window, but I guess it would be a little more involved in Ruby. The right hand panel is added implicitly, so I'm guessing we'd need to suppress the implicit render, then explicitly render it a few lines later. Still fairly quick and easy.

Monica's suggestion of omitting the right hand panel for all tabs would be easy to implement - just add one line per tab to suppress the implicit rendering of the right hand panel.

My personal preference at present is this consistent lack of right hand panel so all the tabs look consistent, but I'd be happy with either solution.

Canina‭ wrote 6 months ago

Monica Cellio‭ trichoplax‭ Quite right; re-reading, I'm not quite sure what I thought I was reading at first. Apologies!