#6510 closed defect (bug) (wontfix)
Overlapping Message title + datestamp with left sidebar + widgets
| Reported by: |
|
Owned by: | |
|---|---|---|---|
| Milestone: | Priority: | low | |
| Severity: | normal | Version: | 2.3.0 |
| Component: | Templates | Keywords: | 2nd-opinion |
| Cc: |
Description
In the twentyfourteen theme with a left sidebar + a couple of right-side widgets, the messages title overlaps with the datestamp.
To reproduce:
- Set your theme to twentyfourteen
- Create a couple of text widgets with ul lists in the left (primary) sidebar
- Create a couple of longish text widgets with ul lists in the right (content) sidebar of the page
- Send a message from one user to another, and view the Inbox, url=/community/members/someusername/messages/
Attachments (2)
Change History (13)
#2
@
9 years ago
- Component changed from Component - Messaging to Appearance
- Milestone changed from Awaiting Review to 2.4
#3
@
9 years ago
Yeah - I'm not a huge fan of our layout but it's out of my control ATM.
I was playing with forcing that datestamp onto its own line but the left-hand checkbox ends up causing missing background color beneath it.
#buddypress table#message-threads tr span.activity {float:none; font-size:smaller} #buddypress table#message-threads tr td.bulk-select-check, #buddypress table#message-threads tr td.thread-from {height:auto} #buddypress table#message-threads tr td.bulk-select-check {border-bottom:none} #buddypress table#message-threads tr td.thread-from {display:table-cell}
I'll use your suggested height adjustment instead.
Thanks!
#4
@
9 years ago
The fixed height is still going to be a problem (i.e. it'll overlap with the date) when there's multiple users or long names listed in the To: or From: areas.
#5
@
9 years ago
it will be a consequence of this attempt to re-lay out the table in this fashion, it may be better to try and revert the table to work as a standard series of tr/td elements. However trying to get this much info into a table while trying to restrict the table width so much is never going to work well.
Are you tied to this sidebar or prepared to lose it for user accounts screens? If you can lose it then you could copy page.php to /buddypress/page.php and add a conditional to check for user account screens around the sidebar call:
<?php if( !bp_is_user() ) : ?> <?php get_sidebar( 'content' ); ?> <?php endif; ?>
#6
@
9 years ago
- Keywords 2nd-opinion added
- Version changed from 2.3.1 to 2.3.0
vhmarkgmailcom - I would probably recommend falling back to the old styles since that doesn't use a vertical nav and would give you more real estate to work with.
You can take a look at the old styles by copying this snippet into your theme's functions.php:
https://codex.buddypress.org/themes/buddypress-companion-stylesheets/#existing-styled-themes
Change:
wp_dequeue_style('bp-twentyfifteen');
to:
wp_dequeue_style('bp-twentyfourteen');
#7
@
9 years ago
We are indeed stuck with the sidebar on all these pages ATM.
After a bit of playing, I'm happy with my original styling fix. Tested in Win7 IE, Chrome, and Firefox at various widths. The last line is new since my last post of this CSS and fixes the whitespace problem.
#buddypress table#message-threads tr span.activity {float:none; font-size:smaller}
#buddypress table#message-threads tr td.bulk-select-check,
#buddypress table#message-threads tr td.thread-from {height:auto}
#buddypress table#message-threads tr td.bulk-select-check {border-bottom:none}
#buddypress table#message-threads tr td.thread-from {display:table-cell}
#buddypress table#message-threads tr.unread{background: #f1f4ff}
Thanks for reporting this @vhmarkgmailcom
To be honest the aim of the exercise originally was to try and maximize what was a very narrow content width for BP component screens that require as much viewport space as possible and to that end the right sidebar wasn't really something figured into things as it seeks to take so much width for it's self.
We could probably add some fine tweaks for the message layout, but the best thing might be for you to copy over the stylesheet for twentyfourteen from BP core templates and adjust things, you could try adding:
#buddypress table#message-threads tr td.thread-from { height: 4.2em; }