Skip to content

Commit

Permalink
Style the collapsed status view better
Browse files Browse the repository at this point in the history
  • Loading branch information
@akirk
akirk committed Jun 21, 2023
1 parent 75d1cee commit 3fb060f
Show file tree
Hide file tree
Showing 5 changed files with 225 additions and 4 deletions.
2 changes: 1 addition & 1 deletion friends.css
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion friends.css.map
View file

Large diffs are not rendered by default.

67 changes: 66 additions & 1 deletion friends.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -206,13 +206,26 @@ h2#page-title a.dashicons {
}

article {
transition: width 1s ease-in-out;

.card-body {
img,
video {
max-width: 100% !important;
height: auto;
}
}
&.format-status {
span.teaser {
display: none;
}
border-bottom: 1px solid black;
padding-bottom: 2em;
margin-bottom: 2em;
header {
margin-bottom: .5em;
}
}
}

.card {
Expand Down Expand Up @@ -443,8 +456,40 @@ h2#page-title a.dashicons {
margin-bottom: 0;
}

&.format-status {
padding-bottom: 0;
margin-bottom: .5em;
width: 100%;
transition: width 1s ease-in-out;

.overflow {
width: calc(100% - 19em);
margin-left: 1em;
}
span.teaser {
text-overflow: ellipsis;
width: calc(100% - 6em);
overflow: hidden;
white-space: nowrap;
display: inline-block;
}
header {
padding-left: 0;
margin-bottom: 0;
div.post-meta {
max-width: 15em;
max-height: 1.5em;
overflow: hidden;
text-overflow: ellipsis;
}
div.avatar {
display: block;
}
}
}

footer.entry-meta {
margin-top: -2.5em;
display: none;
}
}

Expand Down Expand Up @@ -547,4 +592,24 @@ h2#page-title a.dashicons {
border-bottom: 1px solid $border-color-light;
}
}

/* to support mastodon style tags */
.invisible {
font-size: 0;
line-height: 0;
display:inline-block;
width: 0;
height: 0;
position:absolute;
img, svg{
margin: 0 !important;
border: 0 !important;
padding: 0 !important;
width: 0 !important;
height: 0 !important
}
}
.ellipsis::after{
content: "…"
}
}
9 changes: 8 additions & 1 deletion templates/frontend/author-header.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,14 @@
<?php if ( $args['friend_user']->description ) : ?>
<p>
<?php
echo wp_kses( $args['friend_user']->description, array( 'a' => array( 'href' => array() ) ) );
echo wp_kses(
str_replace( '</p>', '<br/>', $args['friend_user']->description ),
array(
'a' => array( 'href' => array() ),
'span' => array( 'class' => array() ),
'br' => array(),
)
);
?>
</p>
<?php endif; ?>
Expand Down
149 changes: 149 additions & 0 deletions templates/frontend/parts/header-status.php
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,149 @@
<?php
/**
* This template contains the content header part for an article on /friends/.
*
* @version 1.0
* @package Friends
*/

$friend_user = $args['friend_user'];
$avatar = $args['avatar'];
$author_name = $args['friend_user']->display_name;

/**
* Allows overriding the authorname for a post.
*
* @param string $override_author_name The author name to override with.
* @param string $author_name The author name.
* @param int $post_id The post ID.
*
* Example:
* ```php
* add_filter( 'friends_override_author_name', function( $override_author_name, $author_name, $post_id ) {
* if ( ! $override_author_name ) { // Only override if not already overridden.
* $override_author_name = get_post_meta( $post_id, 'author', true );
* }
* return $override_author_name;
* }, 10, 3 );
* ```
*/
$override_author_name = apply_filters( 'friends_override_author_name', '', $author_name, get_the_id() );
?><header class="entry-header card-header columns">
<div class="avatar col-auto mr-2">
<?php if ( in_array( get_post_type(), apply_filters( 'friends_frontend_post_types', array() ), true ) ) : ?>
<a href="<?php echo esc_attr( $friend_user->get_local_friends_page_url() ); ?>" class="author-avatar">
<?php echo get_avatar( $args['friend_user']->user_login, 36 ); ?>
</a>
<?php else : ?>
<a href="<?php echo esc_url( get_the_author_meta( 'url' ) ); ?>" class="author-avatar">
<img src="<?php echo esc_url( $avatar ? $avatar : get_avatar_url( get_the_author_meta( 'ID' ) ) ); ?>" width="36" height="36" class="avatar" />
</a>
<?php endif; ?>
</div>
<div class="post-meta">
<div class="author">
<?php if ( in_array( get_post_type(), apply_filters( 'friends_frontend_post_types', array() ), true ) ) : ?>
<a href="<?php echo esc_attr( $friend_user->get_local_friends_page_url() ); ?>">
<strong><?php echo esc_html( $friend_user->display_name ); ?></strong>
<?php if ( $override_author_name && trim( str_replace( $override_author_name, '', $author_name ) ) === $author_name ) : ?>
– <?php echo esc_html( $override_author_name ); ?>
<?php endif; ?>
</a>
<?php else : ?>
<a href="<?php echo esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ); ?>">
<strong><?php the_author(); ?></strong>
</a>
<?php endif; ?>
</div>
<div class="permalink">
<?php
echo wp_kses(
sprintf(
// translators: %1$s is a date or relative time, %2$s is a site name or domain.
_x( '%1$s on %2$s', 'at-date-on-post', 'friends' ),
'<a href="' . esc_attr( $friend_user->get_local_friends_page_url() . get_the_ID() . '/' ) . '" title="' . get_the_time( 'r' ) . '">' .
/* translators: %s is a time span */ sprintf( __( '%s ago' ), human_time_diff( get_post_time( 'U', true ) ) ) . // phpcs:ignore WordPress.WP.I18n.MissingArgDomain
'</a>',
'<a href="' . esc_url( get_the_permalink() ) . '" rel="noopener noreferrer" target="_blank">' . esc_html( parse_url( get_the_permalink(), PHP_URL_HOST ) ) . '</a>'
),
array(
'a' => array(
'href' => array(),
'rel' => array(),
'target' => array(),
'title' => array(),
),
)
);

if ( isset( $args['read_time'] ) ) {
echo ' <span class="reading-time" title="', esc_html__( 'Estimated reading time', 'friends' ), '">', esc_html(
sprintf(
// translators: %s is a timeframe, e.g. < 1 min or 2min.
__( '%s read', 'friends' ),
$args['read_time']
)
), '</span>';
}
?>
</div>
</div>
<div class="overflow col-ml-auto">
<span class="teaser">
<?php echo wp_kses( wp_trim_words( wp_kses( str_replace( '<', ' <', preg_replace( '#<span class="invisible">.*?</span>#', '', get_the_content() ) ), array() ) ), array() ); ?>
</span>
<a class="btn btn-link collapse-post" tabindex="0">
<i class="dashicons dashicons-fullscreen-exit-alt"></i>
</a>

<div class="friends-dropdown friends-dropdown-right">
<a class="btn btn-link friends-dropdown-toggle" tabindex="0">
<i class="dashicons dashicons-menu-alt2"></i>
</a>
<ul class="menu" style="min-width: <?php echo esc_attr( intval( _x( '250', 'dropdown-menu-width', 'friends' ) ) ); ?>px">
<?php if ( apply_filters( 'friends_debug', false ) ) : ?>
<?php
$edit_user_link = Friends\Admin::admin_edit_user_link( false, $friend_user );
if ( $edit_user_link ) :
?>
<li class="menu-item"><a href="<?php echo esc_attr( $edit_user_link ); ?>"><?php esc_html_e( 'Edit friend', 'friends' ); ?></a></li>
<?php endif; ?>
<?php endif; ?>
<li class="menu-item">
<a href="<?php echo esc_attr( $friend_user->get_local_friends_page_url() . get_the_ID() . '/?share=' . hash( 'crc32b', apply_filters( 'friends_share_salt', wp_salt( 'nonce' ) ) . get_the_ID() ) ); ?>"><?php esc_html_e( 'Share link', 'friends' ); ?></a>
</li>
<?php if ( apply_filters( 'friends_debug', false ) ) : ?>
<li class="menu-item friends-dropdown">
<select name="post-format" class="friends-change-post-format form-select select-sm" data-change-post-format-nonce="<?php echo esc_attr( wp_create_nonce( 'friends-change-post-format_' . get_the_ID() ) ); ?>" data-id="<?php echo esc_attr( get_the_ID() ); ?>" >
<option disabled="disabled"><?php esc_html_e( 'Change post format', 'friends' ); ?></option>
<?php foreach ( get_post_format_strings() as $format => $title ) : ?>
<option value="<?php echo esc_attr( $format ); ?>"<?php selected( get_post_format(), $format ); ?>><?php echo esc_html( $title ); ?></option>
<?php endforeach; ?>
</select>
</li>
<?php endif; ?>
<?php if ( current_user_can( 'edit_post', get_current_user_id(), get_the_ID() ) ) : ?>
<li class="menu-item"><?php edit_post_link(); ?></li>
<?php endif; ?>
<?php if ( in_array( get_post_type(), apply_filters( 'friends_frontend_post_types', array() ), true ) ) : ?>
<li class="menu-item"><a href="<?php echo esc_url( self_admin_url( 'admin.php?page=edit-friend-rules&user=' . get_the_author_meta( 'ID' ) . '&post=' . get_the_ID() ) ); ?>" title="<?php esc_attr_e( 'Muffle posts like these', 'friends' ); ?>" class="friends-muffle-post">
<?php esc_html_e( 'Muffle posts like these', 'friends' ); ?>
</a></li>
<li class="menu-item">
<?php if ( 'trash' === get_post_status() ) : ?>
<a href="#" title="<?php /* phpcs:ignore WordPress.WP.I18n.MissingArgDomain */ esc_attr_e( 'Restore from Trash' ); ?>" data-trash-nonce="<?php echo esc_attr( wp_create_nonce( 'trash-post_' . get_the_ID() ) ); ?>" data-untrash-nonce="<?php echo esc_attr( wp_create_nonce( 'untrash-post_' . get_the_ID() ) ); ?>" data-id="<?php echo esc_attr( get_the_ID() ); ?>" class="friends-untrash-post">
<?php /* phpcs:ignore WordPress.WP.I18n.MissingArgDomain */ esc_html_e( 'Restore from Trash' ); ?>
</a>
<?php else : ?>
<a href="#" title="<?php /* phpcs:ignore WordPress.WP.I18n.MissingArgDomain */ esc_attr_e( 'Move to Trash' ); ?>" data-trash-nonce="<?php echo esc_attr( wp_create_nonce( 'trash-post_' . get_the_ID() ) ); ?>" data-untrash-nonce="<?php echo esc_attr( wp_create_nonce( 'untrash-post_' . get_the_ID() ) ); ?>" data-id="<?php echo esc_attr( get_the_ID() ); ?>" class="friends-trash-post">
<?php /* phpcs:ignore WordPress.WP.I18n.MissingArgDomain */ esc_html_e( 'Move to Trash' ); ?>
</a>
<?php endif; ?>
</li>
<?php endif; ?>
<?php do_action( 'friends_entry_dropdown_menu' ); ?>
</ul>
</div>

</div>
</header>

0 comments on commit 3fb060f

Please sign in to comment.