fix: Shrink and normalize some post action button colors and sizes

This commit is contained in:
Jay Sitter 2023-06-20 00:35:50 -04:00
parent 87613009b8
commit 5e30e7b1a8

View file

@ -432,7 +432,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
</button> </button>
{showScores() ? ( {showScores() ? (
<div <div
className={`unselectable pointer font-weight-bold text-muted px-1 post-score`} className={`unselectable pointer text-muted px-1 post-score`}
data-tippy-content={this.pointsTippy} data-tippy-content={this.pointsTippy}
> >
{numToSI(this.postView.counts.score)} {numToSI(this.postView.counts.score)}
@ -508,7 +508,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
{(url && isImage(url)) || {(url && isImage(url)) ||
(post.thumbnail_url && ( (post.thumbnail_url && (
<button <button
className="btn btn-link text-monospace text-muted small d-inline-block" className="btn btn-sm text-monospace text-muted d-inline-block"
data-tippy-content={i18n.t("expand_here")} data-tippy-content={i18n.t("expand_here")}
onClick={linkEvent(this, this.handleImageExpandClick)} onClick={linkEvent(this, this.handleImageExpandClick)}
> >
@ -616,11 +616,11 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
const post = this.postView.post; const post = this.postView.post;
return ( return (
<div className="d-flex align-items-center justify-content-start flex-wrap text-muted font-weight-bold"> <div className="d-flex align-items-center justify-content-start flex-wrap text-muted">
{this.commentsButton} {this.commentsButton}
{canShare() && ( {canShare() && (
<button <button
className="btn btn-sm btn-link" className="btn btn-sm btn-animate text-muted py-0"
onClick={linkEvent(this, this.handleShare)} onClick={linkEvent(this, this.handleShare)}
type="button" type="button"
> >
@ -629,7 +629,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
)} )}
{!post.local && ( {!post.local && (
<a <a
className="btn btn-link btn-animate text-muted py-0" className="btn btn-sm btn-animate text-muted py-0"
title={i18n.t("link")} title={i18n.t("link")}
href={post.ap_id} href={post.ap_id}
> >
@ -650,7 +650,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
return ( return (
<button <button
className="btn btn-link btn-animate text-muted py-0" className="btn btn-sm btn-animate text-muted py-0"
data-tippy-content={body && mdNoImages.render(body)} data-tippy-content={body && mdNoImages.render(body)}
data-tippy-allowHtml={true} data-tippy-allowHtml={true}
onClick={linkEvent(this, this.handleShowBody)} onClick={linkEvent(this, this.handleShowBody)}
@ -687,7 +687,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
<div className="dropdown"> <div className="dropdown">
<button <button
className="btn btn-link btn-animate text-muted py-0 dropdown-toggle" className="btn btn-sm btn-animate text-muted py-0 dropdown-toggle"
onClick={linkEvent(this, this.handleShowAdvanced)} onClick={linkEvent(this, this.handleShowAdvanced)}
data-tippy-content={i18n.t("more")} data-tippy-content={i18n.t("more")}
data-bs-toggle="dropdown" data-bs-toggle="dropdown"
@ -735,7 +735,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
const post_view = this.postView; const post_view = this.postView;
return ( return (
<Link <Link
className="btn btn-link text-muted pl-0 text-muted" className="btn btn-link btn-sm text-muted pl-0"
title={i18n.t("number_of_comments", { title={i18n.t("number_of_comments", {
count: Number(post_view.counts.comments), count: Number(post_view.counts.comments),
formattedCount: Number(post_view.counts.comments), formattedCount: Number(post_view.counts.comments),
@ -833,7 +833,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
const label = saved ? i18n.t("unsave") : i18n.t("save"); const label = saved ? i18n.t("unsave") : i18n.t("save");
return ( return (
<button <button
className="btn btn-link btn-animate text-muted py-0" className="btn btn-sm btn-animate text-muted py-0"
onClick={linkEvent(this, this.handleSavePostClick)} onClick={linkEvent(this, this.handleSavePostClick)}
data-tippy-content={label} data-tippy-content={label}
aria-label={label} aria-label={label}
@ -854,7 +854,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
get crossPostButton() { get crossPostButton() {
return ( return (
<Link <Link
className="btn btn-link btn-animate text-muted py-0" className="btn btn-sm btn-animate text-muted py-0"
to={{ to={{
/* Empty string properties are required to satisfy type*/ /* Empty string properties are required to satisfy type*/
pathname: "/create_post", pathname: "/create_post",
@ -943,7 +943,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
get viewSourceButton() { get viewSourceButton() {
return ( return (
<button <button
className="btn btn-link btn-animate text-muted py-0" className="btn btn-sm btn-animate text-muted py-0"
onClick={linkEvent(this, this.handleViewSource)} onClick={linkEvent(this, this.handleViewSource)}
data-tippy-content={i18n.t("view_source")} data-tippy-content={i18n.t("view_source")}
aria-label={i18n.t("view_source")} aria-label={i18n.t("view_source")}