LemmyNet/lemmy-ui
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-12-23 03:11:25 +00:00
Code Issues Projects Releases Wiki Activity

fix: Adjust sidebar banner to wrap bellow the title (#1819)

Browse source 
* fix: Adjust sidebar banner to wrap bellow the title

* remove flex and add bottom border when uncollapsed

* use classnames utility
This commit is contained in:
Oliver White 2023-07-07 08:22:50 -04:00 committed by GitHub
parent 02198f1076
commit 53a5bfe592
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 4 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/shared/components/home/site-sidebar.tsx
View file

@ -1,3 +1,4 @@
import classNames from "classnames";
import { Component, linkEvent } from "inferno"; import { Component, linkEvent } from "inferno";
import { PersonView, Site, SiteAggregates } from "lemmy-js-client"; import { PersonView, Site, SiteAggregates } from "lemmy-js-client";
import { mdToHtml } from "../../markdown"; import { mdToHtml } from "../../markdown";
@ -32,10 +33,7 @@ export class SiteSidebar extends Component<SiteSidebarProps, SiteSidebarState> {
return ( return (
<div className="site-sidebar accordion"> <div className="site-sidebar accordion">
<section id="sidebarInfo" className="card border-secondary mb-3"> <section id="sidebarInfo" className="card border-secondary mb-3">
<header <header className="card-header" id="sidebarInfoHeader">
className="card-header d-flex align-items-center"
id="sidebarInfoHeader"
>
{this.siteName()} {this.siteName()}
{!this.state.collapsed && ( {!this.state.collapsed && (
<BannerIconHeader banner={this.props.site.banner} /> <BannerIconHeader banner={this.props.site.banner} />
@ -54,7 +52,7 @@ export class SiteSidebar extends Component<SiteSidebarProps, SiteSidebarState> {
siteName() { siteName() {
return ( return (
<> <div className={classNames({ "mb-2": !this.state.collapsed })}>
<h5 className="mb-0 d-inline">{this.props.site.name}</h5> <h5 className="mb-0 d-inline">{this.props.site.name}</h5>
{!this.props.isMobile && ( {!this.props.isMobile && (
<button <button
@ -83,7 +81,7 @@ export class SiteSidebar extends Component<SiteSidebarProps, SiteSidebarState> {
)} )}
</button> </button>
)} )}
</> </div>
); );
} }