mirror of
https://github.com/LemmyNet/lemmy-ui.git
synced 2024-11-01 10:09:56 +00:00
Merge branch 'main' of https://github.com/LemmyNet/lemmy-ui into bugfix/make-post-creator-badge-stand-out-more
This commit is contained in:
Alec Armbruster
commit
06736c3df1
20 changed files with 564 additions and 455 deletions
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "lemmy-ui",
|
"name": "lemmy-ui",
|
||||||
"version": "0.18.0",
|
"version": "0.18.1-rc.1",
|
||||||
"description": "An isomorphic UI for lemmy",
|
"description": "An isomorphic UI for lemmy",
|
||||||
"repository": "https://github.com/LemmyNet/lemmy-ui",
|
"repository": "https://github.com/LemmyNet/lemmy-ui",
|
||||||
"license": "AGPL-3.0",
|
"license": "AGPL-3.0",
|
||||||
|
|
|
||||||
|
|
@ -198,9 +198,9 @@ blockquote {
|
||||||
|
|
||||||
.thumbnail {
|
.thumbnail {
|
||||||
object-fit: cover;
|
object-fit: cover;
|
||||||
min-height: 60px;
|
aspect-ratio: 4/3;
|
||||||
max-height: 80px;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
max-height: 6rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.thumbnail svg {
|
.thumbnail svg {
|
||||||
|
|
@ -360,8 +360,9 @@ br.big {
|
||||||
}
|
}
|
||||||
|
|
||||||
.img-icon {
|
.img-icon {
|
||||||
width: 2rem;
|
width: calc(var(--bs-body-line-height) * 1em);
|
||||||
height: 2rem;
|
height: calc(var(--bs-body-line-height) * 1em);
|
||||||
|
border-radius: 0.25em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tribute-container ul {
|
.tribute-container ul {
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,3 @@
|
||||||
$link-decoration: none;
|
$link-decoration: none;
|
||||||
$min-contrast-ratio: 3;
|
$min-contrast-ratio: 3;
|
||||||
$font-size-base: 0.875rem;
|
$font-size-base: 0.875rem;
|
||||||
|
|
||||||
$container-max-widths: (
|
|
||||||
lg: 1140px,
|
|
||||||
);
|
|
||||||
|
|
|
||||||
|
|
@ -726,7 +726,11 @@ progress {
|
||||||
|
|
||||||
.container,
|
.container,
|
||||||
.container-fluid,
|
.container-fluid,
|
||||||
.container-lg {
|
.container-xxl,
|
||||||
|
.container-xl,
|
||||||
|
.container-lg,
|
||||||
|
.container-md,
|
||||||
|
.container-sm {
|
||||||
--bs-gutter-x: 1.5rem;
|
--bs-gutter-x: 1.5rem;
|
||||||
--bs-gutter-y: 0;
|
--bs-gutter-y: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
@ -736,11 +740,31 @@ progress {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (min-width: 576px) {
|
||||||
|
.container-sm, .container {
|
||||||
|
max-width: 540px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.container-md, .container-sm, .container {
|
||||||
|
max-width: 720px;
|
||||||
|
}
|
||||||
|
}
|
||||||
@media (min-width: 992px) {
|
@media (min-width: 992px) {
|
||||||
.container-lg, .container-md, .container-sm, .container {
|
.container-lg, .container-md, .container-sm, .container {
|
||||||
|
max-width: 960px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
.container-xl, .container-lg, .container-md, .container-sm, .container {
|
||||||
max-width: 1140px;
|
max-width: 1140px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (min-width: 1400px) {
|
||||||
|
.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
|
||||||
|
max-width: 1320px;
|
||||||
|
}
|
||||||
|
}
|
||||||
:root {
|
:root {
|
||||||
--bs-breakpoint-xs: 0;
|
--bs-breakpoint-xs: 0;
|
||||||
--bs-breakpoint-sm: 576px;
|
--bs-breakpoint-sm: 576px;
|
||||||
|
|
@ -3867,7 +3891,11 @@ textarea.form-control-lg {
|
||||||
}
|
}
|
||||||
.navbar > .container,
|
.navbar > .container,
|
||||||
.navbar > .container-fluid,
|
.navbar > .container-fluid,
|
||||||
.navbar > .container-lg {
|
.navbar > .container-sm,
|
||||||
|
.navbar > .container-md,
|
||||||
|
.navbar > .container-lg,
|
||||||
|
.navbar > .container-xl,
|
||||||
|
.navbar > .container-xxl {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: inherit;
|
flex-wrap: inherit;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
|
||||||
|
|
@ -726,7 +726,11 @@ progress {
|
||||||
|
|
||||||
.container,
|
.container,
|
||||||
.container-fluid,
|
.container-fluid,
|
||||||
.container-lg {
|
.container-xxl,
|
||||||
|
.container-xl,
|
||||||
|
.container-lg,
|
||||||
|
.container-md,
|
||||||
|
.container-sm {
|
||||||
--bs-gutter-x: 1.5rem;
|
--bs-gutter-x: 1.5rem;
|
||||||
--bs-gutter-y: 0;
|
--bs-gutter-y: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
@ -736,11 +740,31 @@ progress {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (min-width: 576px) {
|
||||||
|
.container-sm, .container {
|
||||||
|
max-width: 540px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.container-md, .container-sm, .container {
|
||||||
|
max-width: 720px;
|
||||||
|
}
|
||||||
|
}
|
||||||
@media (min-width: 992px) {
|
@media (min-width: 992px) {
|
||||||
.container-lg, .container-md, .container-sm, .container {
|
.container-lg, .container-md, .container-sm, .container {
|
||||||
|
max-width: 960px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
.container-xl, .container-lg, .container-md, .container-sm, .container {
|
||||||
max-width: 1140px;
|
max-width: 1140px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (min-width: 1400px) {
|
||||||
|
.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
|
||||||
|
max-width: 1320px;
|
||||||
|
}
|
||||||
|
}
|
||||||
:root {
|
:root {
|
||||||
--bs-breakpoint-xs: 0;
|
--bs-breakpoint-xs: 0;
|
||||||
--bs-breakpoint-sm: 576px;
|
--bs-breakpoint-sm: 576px;
|
||||||
|
|
@ -3867,7 +3891,11 @@ textarea.form-control-lg {
|
||||||
}
|
}
|
||||||
.navbar > .container,
|
.navbar > .container,
|
||||||
.navbar > .container-fluid,
|
.navbar > .container-fluid,
|
||||||
.navbar > .container-lg {
|
.navbar > .container-sm,
|
||||||
|
.navbar > .container-md,
|
||||||
|
.navbar > .container-lg,
|
||||||
|
.navbar > .container-xl,
|
||||||
|
.navbar > .container-xxl {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: inherit;
|
flex-wrap: inherit;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
|
||||||
|
|
@ -725,7 +725,11 @@ progress {
|
||||||
|
|
||||||
.container,
|
.container,
|
||||||
.container-fluid,
|
.container-fluid,
|
||||||
.container-lg {
|
.container-xxl,
|
||||||
|
.container-xl,
|
||||||
|
.container-lg,
|
||||||
|
.container-md,
|
||||||
|
.container-sm {
|
||||||
--bs-gutter-x: 1.5rem;
|
--bs-gutter-x: 1.5rem;
|
||||||
--bs-gutter-y: 0;
|
--bs-gutter-y: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
@ -735,11 +739,31 @@ progress {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (min-width: 576px) {
|
||||||
|
.container-sm, .container {
|
||||||
|
max-width: 540px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.container-md, .container-sm, .container {
|
||||||
|
max-width: 720px;
|
||||||
|
}
|
||||||
|
}
|
||||||
@media (min-width: 992px) {
|
@media (min-width: 992px) {
|
||||||
.container-lg, .container-md, .container-sm, .container {
|
.container-lg, .container-md, .container-sm, .container {
|
||||||
|
max-width: 960px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
.container-xl, .container-lg, .container-md, .container-sm, .container {
|
||||||
max-width: 1140px;
|
max-width: 1140px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (min-width: 1400px) {
|
||||||
|
.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
|
||||||
|
max-width: 1320px;
|
||||||
|
}
|
||||||
|
}
|
||||||
:root {
|
:root {
|
||||||
--bs-breakpoint-xs: 0;
|
--bs-breakpoint-xs: 0;
|
||||||
--bs-breakpoint-sm: 576px;
|
--bs-breakpoint-sm: 576px;
|
||||||
|
|
@ -3866,7 +3890,11 @@ textarea.form-control-lg {
|
||||||
}
|
}
|
||||||
.navbar > .container,
|
.navbar > .container,
|
||||||
.navbar > .container-fluid,
|
.navbar > .container-fluid,
|
||||||
.navbar > .container-lg {
|
.navbar > .container-sm,
|
||||||
|
.navbar > .container-md,
|
||||||
|
.navbar > .container-lg,
|
||||||
|
.navbar > .container-xl,
|
||||||
|
.navbar > .container-xxl {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: inherit;
|
flex-wrap: inherit;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
|
||||||
|
|
@ -725,7 +725,11 @@ progress {
|
||||||
|
|
||||||
.container,
|
.container,
|
||||||
.container-fluid,
|
.container-fluid,
|
||||||
.container-lg {
|
.container-xxl,
|
||||||
|
.container-xl,
|
||||||
|
.container-lg,
|
||||||
|
.container-md,
|
||||||
|
.container-sm {
|
||||||
--bs-gutter-x: 1.5rem;
|
--bs-gutter-x: 1.5rem;
|
||||||
--bs-gutter-y: 0;
|
--bs-gutter-y: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
@ -735,11 +739,31 @@ progress {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (min-width: 576px) {
|
||||||
|
.container-sm, .container {
|
||||||
|
max-width: 540px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
.container-md, .container-sm, .container {
|
||||||
|
max-width: 720px;
|
||||||
|
}
|
||||||
|
}
|
||||||
@media (min-width: 992px) {
|
@media (min-width: 992px) {
|
||||||
.container-lg, .container-md, .container-sm, .container {
|
.container-lg, .container-md, .container-sm, .container {
|
||||||
|
max-width: 960px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
.container-xl, .container-lg, .container-md, .container-sm, .container {
|
||||||
max-width: 1140px;
|
max-width: 1140px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (min-width: 1400px) {
|
||||||
|
.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
|
||||||
|
max-width: 1320px;
|
||||||
|
}
|
||||||
|
}
|
||||||
:root {
|
:root {
|
||||||
--bs-breakpoint-xs: 0;
|
--bs-breakpoint-xs: 0;
|
||||||
--bs-breakpoint-sm: 576px;
|
--bs-breakpoint-sm: 576px;
|
||||||
|
|
@ -3866,7 +3890,11 @@ textarea.form-control-lg {
|
||||||
}
|
}
|
||||||
.navbar > .container,
|
.navbar > .container,
|
||||||
.navbar > .container-fluid,
|
.navbar > .container-fluid,
|
||||||
.navbar > .container-lg {
|
.navbar > .container-sm,
|
||||||
|
.navbar > .container-md,
|
||||||
|
.navbar > .container-lg,
|
||||||
|
.navbar > .container-xl,
|
||||||
|
.navbar > .container-xxl {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: inherit;
|
flex-wrap: inherit;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
|
||||||
|
|
@ -79,256 +79,246 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
||||||
const siteView = this.props.siteRes?.site_view;
|
const siteView = this.props.siteRes?.site_view;
|
||||||
const person = UserService.Instance.myUserInfo?.local_user_view.person;
|
const person = UserService.Instance.myUserInfo?.local_user_view.person;
|
||||||
return (
|
return (
|
||||||
<nav
|
<div className="shadow-sm">
|
||||||
className="navbar navbar-expand-md navbar-light shadow-sm p-0 px-3 container-lg"
|
<nav
|
||||||
id="navbar"
|
className="navbar navbar-expand-md navbar-light p-0 px-3 container-lg"
|
||||||
>
|
id="navbar"
|
||||||
<NavLink
|
|
||||||
id="navTitle"
|
|
||||||
to="/"
|
|
||||||
title={siteView?.site.description ?? siteView?.site.name}
|
|
||||||
className="d-flex align-items-center navbar-brand me-md-3"
|
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
>
|
||||||
{siteView?.site.icon && showAvatars() && (
|
<NavLink
|
||||||
<PictrsImage src={siteView.site.icon} icon />
|
id="navTitle"
|
||||||
)}
|
to="/"
|
||||||
{siteView?.site.name}
|
title={siteView?.site.description ?? siteView?.site.name}
|
||||||
</NavLink>
|
className="d-flex align-items-center navbar-brand me-md-3"
|
||||||
{person && (
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
<ul className="navbar-nav d-flex flex-row ms-auto d-md-none">
|
>
|
||||||
<li id="navMessages" className="nav-item nav-item-icon">
|
{siteView?.site.icon && showAvatars() && (
|
||||||
<NavLink
|
<PictrsImage src={siteView.site.icon} icon />
|
||||||
to="/inbox"
|
)}
|
||||||
className="p-1 nav-link border-0 nav-messages"
|
{siteView?.site.name}
|
||||||
title={I18NextService.i18n.t("unread_messages", {
|
</NavLink>
|
||||||
count: Number(this.state.unreadApplicationCountRes.state),
|
{person && (
|
||||||
formattedCount: numToSI(this.unreadInboxCount),
|
<ul className="navbar-nav d-flex flex-row ms-auto d-md-none">
|
||||||
})}
|
<li id="navMessages" className="nav-item nav-item-icon">
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
|
||||||
<Icon icon="bell" />
|
|
||||||
{this.unreadInboxCount > 0 && (
|
|
||||||
<span className="mx-1 badge text-bg-light">
|
|
||||||
{numToSI(this.unreadInboxCount)}
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</NavLink>
|
|
||||||
</li>
|
|
||||||
{this.moderatesSomething && (
|
|
||||||
<li className="nav-item nav-item-icon">
|
|
||||||
<NavLink
|
<NavLink
|
||||||
to="/reports"
|
to="/inbox"
|
||||||
className="p-1 nav-link border-0"
|
className="p-1 nav-link border-0 nav-messages"
|
||||||
title={I18NextService.i18n.t("unread_reports", {
|
title={I18NextService.i18n.t("unread_messages", {
|
||||||
count: Number(this.unreadReportCount),
|
count: Number(this.state.unreadApplicationCountRes.state),
|
||||||
formattedCount: numToSI(this.unreadReportCount),
|
formattedCount: numToSI(this.unreadInboxCount),
|
||||||
})}
|
})}
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
>
|
>
|
||||||
<Icon icon="shield" />
|
<Icon icon="bell" />
|
||||||
{this.unreadReportCount > 0 && (
|
{this.unreadInboxCount > 0 && (
|
||||||
<span className="mx-1 badge text-bg-light">
|
<span className="mx-1 badge text-bg-light">
|
||||||
{numToSI(this.unreadReportCount)}
|
{numToSI(this.unreadInboxCount)}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</li>
|
</li>
|
||||||
)}
|
{this.moderatesSomething && (
|
||||||
{amAdmin() && (
|
<li className="nav-item nav-item-icon">
|
||||||
<li className="nav-item nav-item-icon">
|
|
||||||
<NavLink
|
|
||||||
to="/registration_applications"
|
|
||||||
className="p-1 nav-link border-0"
|
|
||||||
title={I18NextService.i18n.t(
|
|
||||||
"unread_registration_applications",
|
|
||||||
{
|
|
||||||
count: Number(this.unreadApplicationCount),
|
|
||||||
formattedCount: numToSI(this.unreadApplicationCount),
|
|
||||||
}
|
|
||||||
)}
|
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
|
||||||
<Icon icon="clipboard" />
|
|
||||||
{this.unreadApplicationCount > 0 && (
|
|
||||||
<span className="mx-1 badge text-bg-light">
|
|
||||||
{numToSI(this.unreadApplicationCount)}
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</NavLink>
|
|
||||||
</li>
|
|
||||||
)}
|
|
||||||
</ul>
|
|
||||||
)}
|
|
||||||
<button
|
|
||||||
className="navbar-toggler border-0 p-1"
|
|
||||||
type="button"
|
|
||||||
aria-label="menu"
|
|
||||||
data-tippy-content={I18NextService.i18n.t("expand_here")}
|
|
||||||
data-bs-toggle="collapse"
|
|
||||||
data-bs-target="#navbarDropdown"
|
|
||||||
aria-controls="navbarDropdown"
|
|
||||||
aria-expanded="false"
|
|
||||||
ref={this.collapseButtonRef}
|
|
||||||
>
|
|
||||||
<Icon icon="menu" />
|
|
||||||
</button>
|
|
||||||
<div
|
|
||||||
className="collapse navbar-collapse my-2"
|
|
||||||
id="navbarDropdown"
|
|
||||||
ref={this.mobileMenuRef}
|
|
||||||
>
|
|
||||||
<ul id="navbarLinks" className="me-auto navbar-nav">
|
|
||||||
<li className="nav-item">
|
|
||||||
<NavLink
|
|
||||||
to="/communities"
|
|
||||||
className="nav-link"
|
|
||||||
title={I18NextService.i18n.t("communities")}
|
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
|
||||||
{I18NextService.i18n.t("communities")}
|
|
||||||
</NavLink>
|
|
||||||
</li>
|
|
||||||
<li className="nav-item">
|
|
||||||
{/* TODO make sure this works: https://github.com/infernojs/inferno/issues/1608 */}
|
|
||||||
<NavLink
|
|
||||||
to={{
|
|
||||||
pathname: "/create_post",
|
|
||||||
search: "",
|
|
||||||
hash: "",
|
|
||||||
key: "",
|
|
||||||
state: { prevPath: this.currentLocation },
|
|
||||||
}}
|
|
||||||
className="nav-link"
|
|
||||||
title={I18NextService.i18n.t("create_post")}
|
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
|
||||||
{I18NextService.i18n.t("create_post")}
|
|
||||||
</NavLink>
|
|
||||||
</li>
|
|
||||||
{this.props.siteRes && canCreateCommunity(this.props.siteRes) && (
|
|
||||||
<li className="nav-item">
|
|
||||||
<NavLink
|
|
||||||
to="/create_community"
|
|
||||||
className="nav-link"
|
|
||||||
title={I18NextService.i18n.t("create_community")}
|
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
|
||||||
{I18NextService.i18n.t("create_community")}
|
|
||||||
</NavLink>
|
|
||||||
</li>
|
|
||||||
)}
|
|
||||||
<li className="nav-item">
|
|
||||||
<a
|
|
||||||
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
|
||||||
title={I18NextService.i18n.t("support_lemmy")}
|
|
||||||
href={donateLemmyUrl}
|
|
||||||
>
|
|
||||||
<Icon icon="heart" classes="small" />
|
|
||||||
<span className="d-inline ms-1 d-md-none ms-md-0">
|
|
||||||
{I18NextService.i18n.t("support_lemmy")}
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<ul id="navbarIcons" className="navbar-nav">
|
|
||||||
<li id="navSearch" className="nav-item">
|
|
||||||
<NavLink
|
|
||||||
to="/search"
|
|
||||||
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
|
||||||
title={I18NextService.i18n.t("search")}
|
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
|
||||||
<Icon icon="search" />
|
|
||||||
<span className="d-inline ms-1 d-md-none ms-md-0">
|
|
||||||
{I18NextService.i18n.t("search")}
|
|
||||||
</span>
|
|
||||||
</NavLink>
|
|
||||||
</li>
|
|
||||||
{amAdmin() && (
|
|
||||||
<li id="navAdmin" className="nav-item">
|
|
||||||
<NavLink
|
|
||||||
to="/admin"
|
|
||||||
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
|
||||||
title={I18NextService.i18n.t("admin_settings")}
|
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
|
||||||
<Icon icon="settings" />
|
|
||||||
<span className="d-inline ms-1 d-md-none ms-md-0">
|
|
||||||
{I18NextService.i18n.t("admin_settings")}
|
|
||||||
</span>
|
|
||||||
</NavLink>
|
|
||||||
</li>
|
|
||||||
)}
|
|
||||||
{person ? (
|
|
||||||
<>
|
|
||||||
<li id="navMessages" className="nav-item">
|
|
||||||
<NavLink
|
<NavLink
|
||||||
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
to="/reports"
|
||||||
to="/inbox"
|
className="p-1 nav-link border-0"
|
||||||
title={I18NextService.i18n.t("unread_messages", {
|
title={I18NextService.i18n.t("unread_reports", {
|
||||||
count: Number(this.unreadInboxCount),
|
count: Number(this.unreadReportCount),
|
||||||
formattedCount: numToSI(this.unreadInboxCount),
|
formattedCount: numToSI(this.unreadReportCount),
|
||||||
})}
|
})}
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
>
|
>
|
||||||
<Icon icon="bell" />
|
<Icon icon="shield" />
|
||||||
<span className="badge text-bg-light d-inline ms-1 d-md-none ms-md-0">
|
{this.unreadReportCount > 0 && (
|
||||||
{I18NextService.i18n.t("unread_messages", {
|
|
||||||
count: Number(this.unreadInboxCount),
|
|
||||||
formattedCount: numToSI(this.unreadInboxCount),
|
|
||||||
})}
|
|
||||||
</span>
|
|
||||||
{this.unreadInboxCount > 0 && (
|
|
||||||
<span className="mx-1 badge text-bg-light">
|
<span className="mx-1 badge text-bg-light">
|
||||||
{numToSI(this.unreadInboxCount)}
|
{numToSI(this.unreadReportCount)}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</li>
|
</li>
|
||||||
{this.moderatesSomething && (
|
)}
|
||||||
<li id="navModeration" className="nav-item">
|
{amAdmin() && (
|
||||||
|
<li className="nav-item nav-item-icon">
|
||||||
|
<NavLink
|
||||||
|
to="/registration_applications"
|
||||||
|
className="p-1 nav-link border-0"
|
||||||
|
title={I18NextService.i18n.t(
|
||||||
|
"unread_registration_applications",
|
||||||
|
{
|
||||||
|
count: Number(this.unreadApplicationCount),
|
||||||
|
formattedCount: numToSI(this.unreadApplicationCount),
|
||||||
|
}
|
||||||
|
)}
|
||||||
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
|
>
|
||||||
|
<Icon icon="clipboard" />
|
||||||
|
{this.unreadApplicationCount > 0 && (
|
||||||
|
<span className="mx-1 badge text-bg-light">
|
||||||
|
{numToSI(this.unreadApplicationCount)}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
)}
|
||||||
|
</ul>
|
||||||
|
)}
|
||||||
|
<button
|
||||||
|
className="navbar-toggler border-0 p-1"
|
||||||
|
type="button"
|
||||||
|
aria-label="menu"
|
||||||
|
data-tippy-content={I18NextService.i18n.t("expand_here")}
|
||||||
|
data-bs-toggle="collapse"
|
||||||
|
data-bs-target="#navbarDropdown"
|
||||||
|
aria-controls="navbarDropdown"
|
||||||
|
aria-expanded="false"
|
||||||
|
ref={this.collapseButtonRef}
|
||||||
|
>
|
||||||
|
<Icon icon="menu" />
|
||||||
|
</button>
|
||||||
|
<div
|
||||||
|
className="collapse navbar-collapse my-2"
|
||||||
|
id="navbarDropdown"
|
||||||
|
ref={this.mobileMenuRef}
|
||||||
|
>
|
||||||
|
<ul id="navbarLinks" className="me-auto navbar-nav">
|
||||||
|
<li className="nav-item">
|
||||||
|
<NavLink
|
||||||
|
to="/communities"
|
||||||
|
className="nav-link"
|
||||||
|
title={I18NextService.i18n.t("communities")}
|
||||||
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
|
>
|
||||||
|
{I18NextService.i18n.t("communities")}
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
<li className="nav-item">
|
||||||
|
{/* TODO make sure this works: https://github.com/infernojs/inferno/issues/1608 */}
|
||||||
|
<NavLink
|
||||||
|
to={{
|
||||||
|
pathname: "/create_post",
|
||||||
|
search: "",
|
||||||
|
hash: "",
|
||||||
|
key: "",
|
||||||
|
state: { prevPath: this.currentLocation },
|
||||||
|
}}
|
||||||
|
className="nav-link"
|
||||||
|
title={I18NextService.i18n.t("create_post")}
|
||||||
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
|
>
|
||||||
|
{I18NextService.i18n.t("create_post")}
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
{this.props.siteRes && canCreateCommunity(this.props.siteRes) && (
|
||||||
|
<li className="nav-item">
|
||||||
|
<NavLink
|
||||||
|
to="/create_community"
|
||||||
|
className="nav-link"
|
||||||
|
title={I18NextService.i18n.t("create_community")}
|
||||||
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
|
>
|
||||||
|
{I18NextService.i18n.t("create_community")}
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
)}
|
||||||
|
<li className="nav-item">
|
||||||
|
<a
|
||||||
|
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
||||||
|
title={I18NextService.i18n.t("support_lemmy")}
|
||||||
|
href={donateLemmyUrl}
|
||||||
|
>
|
||||||
|
<Icon icon="heart" classes="small" />
|
||||||
|
<span className="d-inline ms-1 d-md-none ms-md-0">
|
||||||
|
{I18NextService.i18n.t("support_lemmy")}
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<ul id="navbarIcons" className="navbar-nav">
|
||||||
|
<li id="navSearch" className="nav-item">
|
||||||
|
<NavLink
|
||||||
|
to="/search"
|
||||||
|
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
||||||
|
title={I18NextService.i18n.t("search")}
|
||||||
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
|
>
|
||||||
|
<Icon icon="search" />
|
||||||
|
<span className="d-inline ms-1 d-md-none ms-md-0">
|
||||||
|
{I18NextService.i18n.t("search")}
|
||||||
|
</span>
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
{amAdmin() && (
|
||||||
|
<li id="navAdmin" className="nav-item">
|
||||||
|
<NavLink
|
||||||
|
to="/admin"
|
||||||
|
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
||||||
|
title={I18NextService.i18n.t("admin_settings")}
|
||||||
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
|
>
|
||||||
|
<Icon icon="settings" />
|
||||||
|
<span className="d-inline ms-1 d-md-none ms-md-0">
|
||||||
|
{I18NextService.i18n.t("admin_settings")}
|
||||||
|
</span>
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
)}
|
||||||
|
{person ? (
|
||||||
|
<>
|
||||||
|
<li id="navMessages" className="nav-item">
|
||||||
<NavLink
|
<NavLink
|
||||||
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
||||||
to="/reports"
|
to="/inbox"
|
||||||
title={I18NextService.i18n.t("unread_reports", {
|
title={I18NextService.i18n.t("unread_messages", {
|
||||||
count: Number(this.unreadReportCount),
|
count: Number(this.unreadInboxCount),
|
||||||
formattedCount: numToSI(this.unreadReportCount),
|
formattedCount: numToSI(this.unreadInboxCount),
|
||||||
})}
|
})}
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
>
|
>
|
||||||
<Icon icon="shield" />
|
<Icon icon="bell" />
|
||||||
<span className="badge text-bg-light d-inline ms-1 d-md-none ms-md-0">
|
<span className="badge text-bg-light d-inline ms-1 d-md-none ms-md-0">
|
||||||
{I18NextService.i18n.t("unread_reports", {
|
{I18NextService.i18n.t("unread_messages", {
|
||||||
count: Number(this.unreadReportCount),
|
count: Number(this.unreadInboxCount),
|
||||||
formattedCount: numToSI(this.unreadReportCount),
|
formattedCount: numToSI(this.unreadInboxCount),
|
||||||
})}
|
})}
|
||||||
</span>
|
</span>
|
||||||
{this.unreadReportCount > 0 && (
|
{this.unreadInboxCount > 0 && (
|
||||||
<span className="mx-1 badge text-bg-light">
|
<span className="mx-1 badge text-bg-light">
|
||||||
{numToSI(this.unreadReportCount)}
|
{numToSI(this.unreadInboxCount)}
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</li>
|
</li>
|
||||||
)}
|
{this.moderatesSomething && (
|
||||||
{amAdmin() && (
|
<li id="navModeration" className="nav-item">
|
||||||
<li id="navApplications" className="nav-item">
|
<NavLink
|
||||||
<NavLink
|
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
||||||
to="/registration_applications"
|
to="/reports"
|
||||||
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
title={I18NextService.i18n.t("unread_reports", {
|
||||||
title={I18NextService.i18n.t(
|
count: Number(this.unreadReportCount),
|
||||||
"unread_registration_applications",
|
formattedCount: numToSI(this.unreadReportCount),
|
||||||
{
|
})}
|
||||||
count: Number(this.unreadApplicationCount),
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
formattedCount: numToSI(this.unreadApplicationCount),
|
>
|
||||||
}
|
<Icon icon="shield" />
|
||||||
)}
|
<span className="badge text-bg-light d-inline ms-1 d-md-none ms-md-0">
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
{I18NextService.i18n.t("unread_reports", {
|
||||||
>
|
count: Number(this.unreadReportCount),
|
||||||
<Icon icon="clipboard" />
|
formattedCount: numToSI(this.unreadReportCount),
|
||||||
<span className="badge text-bg-light d-inline ms-1 d-md-none ms-md-0">
|
})}
|
||||||
{I18NextService.i18n.t(
|
</span>
|
||||||
|
{this.unreadReportCount > 0 && (
|
||||||
|
<span className="mx-1 badge text-bg-light">
|
||||||
|
{numToSI(this.unreadReportCount)}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
)}
|
||||||
|
{amAdmin() && (
|
||||||
|
<li id="navApplications" className="nav-item">
|
||||||
|
<NavLink
|
||||||
|
to="/registration_applications"
|
||||||
|
className="nav-link d-inline-flex align-items-center d-md-inline-block"
|
||||||
|
title={I18NextService.i18n.t(
|
||||||
"unread_registration_applications",
|
"unread_registration_applications",
|
||||||
{
|
{
|
||||||
count: Number(this.unreadApplicationCount),
|
count: Number(this.unreadApplicationCount),
|
||||||
|
|
@ -337,97 +327,111 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
||||||
),
|
),
|
||||||
}
|
}
|
||||||
)}
|
)}
|
||||||
</span>
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
{this.unreadApplicationCount > 0 && (
|
>
|
||||||
<span className="mx-1 badge text-bg-light">
|
<Icon icon="clipboard" />
|
||||||
{numToSI(this.unreadApplicationCount)}
|
<span className="badge text-bg-light d-inline ms-1 d-md-none ms-md-0">
|
||||||
|
{I18NextService.i18n.t(
|
||||||
|
"unread_registration_applications",
|
||||||
|
{
|
||||||
|
count: Number(this.unreadApplicationCount),
|
||||||
|
formattedCount: numToSI(
|
||||||
|
this.unreadApplicationCount
|
||||||
|
),
|
||||||
|
}
|
||||||
|
)}
|
||||||
</span>
|
</span>
|
||||||
)}
|
{this.unreadApplicationCount > 0 && (
|
||||||
|
<span className="mx-1 badge text-bg-light">
|
||||||
|
{numToSI(this.unreadApplicationCount)}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
)}
|
||||||
|
{person && (
|
||||||
|
<li id="dropdownUser" className="dropdown">
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
className="btn dropdown-toggle"
|
||||||
|
aria-expanded="false"
|
||||||
|
data-bs-toggle="dropdown"
|
||||||
|
>
|
||||||
|
{showAvatars() && person.avatar && (
|
||||||
|
<PictrsImage src={person.avatar} icon />
|
||||||
|
)}
|
||||||
|
{person.display_name ?? person.name}
|
||||||
|
</button>
|
||||||
|
<ul
|
||||||
|
className="dropdown-menu"
|
||||||
|
style={{ "min-width": "fit-content" }}
|
||||||
|
>
|
||||||
|
<li>
|
||||||
|
<NavLink
|
||||||
|
to={`/u/${person.name}`}
|
||||||
|
className="dropdown-item px-2"
|
||||||
|
title={I18NextService.i18n.t("profile")}
|
||||||
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
|
>
|
||||||
|
<Icon icon="user" classes="me-1" />
|
||||||
|
{I18NextService.i18n.t("profile")}
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<NavLink
|
||||||
|
to="/settings"
|
||||||
|
className="dropdown-item px-2"
|
||||||
|
title={I18NextService.i18n.t("settings")}
|
||||||
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
|
>
|
||||||
|
<Icon icon="settings" classes="me-1" />
|
||||||
|
{I18NextService.i18n.t("settings")}
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<hr className="dropdown-divider" />
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<button
|
||||||
|
className="dropdown-item btn btn-link px-2"
|
||||||
|
onClick={linkEvent(this, handleLogOut)}
|
||||||
|
>
|
||||||
|
<Icon icon="log-out" classes="me-1" />
|
||||||
|
{I18NextService.i18n.t("logout")}
|
||||||
|
</button>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
)}
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
<li className="nav-item">
|
||||||
|
<NavLink
|
||||||
|
to="/login"
|
||||||
|
className="nav-link"
|
||||||
|
title={I18NextService.i18n.t("login")}
|
||||||
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
|
>
|
||||||
|
{I18NextService.i18n.t("login")}
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</li>
|
</li>
|
||||||
)}
|
<li className="nav-item">
|
||||||
{person && (
|
<NavLink
|
||||||
<li id="dropdownUser" className="dropdown">
|
to="/signup"
|
||||||
<button
|
className="nav-link"
|
||||||
type="button"
|
title={I18NextService.i18n.t("sign_up")}
|
||||||
className="btn dropdown-toggle"
|
onMouseUp={linkEvent(this, handleCollapseClick)}
|
||||||
aria-expanded="false"
|
|
||||||
data-bs-toggle="dropdown"
|
|
||||||
>
|
>
|
||||||
{showAvatars() && person.avatar && (
|
{I18NextService.i18n.t("sign_up")}
|
||||||
<PictrsImage src={person.avatar} icon />
|
</NavLink>
|
||||||
)}
|
|
||||||
{person.display_name ?? person.name}
|
|
||||||
</button>
|
|
||||||
<ul
|
|
||||||
className="dropdown-menu"
|
|
||||||
style={{ "min-width": "fit-content" }}
|
|
||||||
>
|
|
||||||
<li>
|
|
||||||
<NavLink
|
|
||||||
to={`/u/${person.name}`}
|
|
||||||
className="dropdown-item px-2"
|
|
||||||
title={I18NextService.i18n.t("profile")}
|
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
|
||||||
<Icon icon="user" classes="me-1" />
|
|
||||||
{I18NextService.i18n.t("profile")}
|
|
||||||
</NavLink>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<NavLink
|
|
||||||
to="/settings"
|
|
||||||
className="dropdown-item px-2"
|
|
||||||
title={I18NextService.i18n.t("settings")}
|
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
|
||||||
<Icon icon="settings" classes="me-1" />
|
|
||||||
{I18NextService.i18n.t("settings")}
|
|
||||||
</NavLink>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<hr className="dropdown-divider" />
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<button
|
|
||||||
className="dropdown-item btn btn-link px-2"
|
|
||||||
onClick={linkEvent(this, handleLogOut)}
|
|
||||||
>
|
|
||||||
<Icon icon="log-out" classes="me-1" />
|
|
||||||
{I18NextService.i18n.t("logout")}
|
|
||||||
</button>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
</li>
|
||||||
)}
|
</>
|
||||||
</>
|
)}
|
||||||
) : (
|
</ul>
|
||||||
<>
|
</div>
|
||||||
<li className="nav-item">
|
</nav>
|
||||||
<NavLink
|
</div>
|
||||||
to="/login"
|
|
||||||
className="nav-link"
|
|
||||||
title={I18NextService.i18n.t("login")}
|
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
|
||||||
{I18NextService.i18n.t("login")}
|
|
||||||
</NavLink>
|
|
||||||
</li>
|
|
||||||
<li className="nav-item">
|
|
||||||
<NavLink
|
|
||||||
to="/signup"
|
|
||||||
className="nav-link"
|
|
||||||
title={I18NextService.i18n.t("sign_up")}
|
|
||||||
onMouseUp={linkEvent(this, handleCollapseClick)}
|
|
||||||
>
|
|
||||||
{I18NextService.i18n.t("sign_up")}
|
|
||||||
</NavLink>
|
|
||||||
</li>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -39,7 +39,7 @@ export class PictrsImage extends Component<PictrsImageProps, any> {
|
||||||
"img-expanded slight-radius":
|
"img-expanded slight-radius":
|
||||||
!this.props.thumbnail && !this.props.icon,
|
!this.props.thumbnail && !this.props.icon,
|
||||||
"img-blur": this.props.thumbnail && this.props.nsfw,
|
"img-blur": this.props.thumbnail && this.props.nsfw,
|
||||||
"rounded-circle img-cover img-icon me-2": this.props.icon,
|
"img-cover img-icon me-1": this.props.icon,
|
||||||
"ms-2 mb-0 rounded-circle img-cover avatar-overlay":
|
"ms-2 mb-0 rounded-circle img-cover avatar-overlay":
|
||||||
this.props.iconOverlay,
|
this.props.iconOverlay,
|
||||||
"avatar-pushup": this.props.pushup,
|
"avatar-pushup": this.props.pushup,
|
||||||
|
|
|
||||||
|
|
@ -104,7 +104,7 @@ export class VoteButtonsCompact extends Component<
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<div>
|
<>
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
className={`btn-animate btn py-0 px-1 ${
|
className={`btn-animate btn py-0 px-1 ${
|
||||||
|
|
@ -157,7 +157,7 @@ export class VoteButtonsCompact extends Component<
|
||||||
)}
|
)}
|
||||||
</button>
|
</button>
|
||||||
)}
|
)}
|
||||||
</div>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -174,7 +174,7 @@ export class VoteButtons extends Component<VoteButtonsProps, VoteButtonsState> {
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<div className="vote-bar col-1 pe-0 small text-center">
|
<div className="vote-bar pe-0 small text-center">
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
className={`btn-animate btn btn-link p-0 ${
|
className={`btn-animate btn btn-link p-0 ${
|
||||||
|
|
|
||||||
|
|
@ -317,7 +317,10 @@ export class Community extends Component<
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div className="row">
|
<div className="row">
|
||||||
<main className="col-12 col-md-8" ref={this.mainContentRef}>
|
<main
|
||||||
|
className="col-12 col-md-8 col-lg-9"
|
||||||
|
ref={this.mainContentRef}
|
||||||
|
>
|
||||||
{this.communityInfo(res)}
|
{this.communityInfo(res)}
|
||||||
<div className="d-block d-md-none">
|
<div className="d-block d-md-none">
|
||||||
<button
|
<button
|
||||||
|
|
@ -340,7 +343,7 @@ export class Community extends Component<
|
||||||
{this.listings(res)}
|
{this.listings(res)}
|
||||||
<Paginator page={page} onChange={this.handlePageChange} />
|
<Paginator page={page} onChange={this.handlePageChange} />
|
||||||
</main>
|
</main>
|
||||||
<aside className="d-none d-md-block col-md-4">
|
<aside className="d-none d-md-block col-md-4 col-lg-3">
|
||||||
{this.sidebar(res)}
|
{this.sidebar(res)}
|
||||||
</aside>
|
</aside>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -387,7 +387,7 @@ export class Home extends Component<any, HomeState> {
|
||||||
/>
|
/>
|
||||||
{site_setup && (
|
{site_setup && (
|
||||||
<div className="row">
|
<div className="row">
|
||||||
<main role="main" className="col-12 col-md-8">
|
<main role="main" className="col-12 col-md-8 col-lg-9">
|
||||||
{tagline && (
|
{tagline && (
|
||||||
<div
|
<div
|
||||||
id="tagline"
|
id="tagline"
|
||||||
|
|
@ -397,7 +397,7 @@ export class Home extends Component<any, HomeState> {
|
||||||
<div className="d-block d-md-none">{this.mobileView}</div>
|
<div className="d-block d-md-none">{this.mobileView}</div>
|
||||||
{this.posts}
|
{this.posts}
|
||||||
</main>
|
</main>
|
||||||
<aside className="d-none d-md-block col-md-4">
|
<aside className="d-none d-md-block col-md-4 col-lg-3">
|
||||||
{this.mySidebar}
|
{this.mySidebar}
|
||||||
</aside>
|
</aside>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -140,7 +140,10 @@ export class Signup extends Component<any, State> {
|
||||||
registerForm() {
|
registerForm() {
|
||||||
const siteView = this.state.siteRes.site_view;
|
const siteView = this.state.siteRes.site_view;
|
||||||
return (
|
return (
|
||||||
<form onSubmit={linkEvent(this, this.handleRegisterSubmit)}>
|
<form
|
||||||
|
className="was-validated"
|
||||||
|
onSubmit={linkEvent(this, this.handleRegisterSubmit)}
|
||||||
|
>
|
||||||
<h5>{this.titleName(siteView)}</h5>
|
<h5>{this.titleName(siteView)}</h5>
|
||||||
|
|
||||||
{this.isLemmyMl && (
|
{this.isLemmyMl && (
|
||||||
|
|
|
||||||
|
|
@ -4,6 +4,7 @@ import {
|
||||||
Component,
|
Component,
|
||||||
InfernoKeyboardEvent,
|
InfernoKeyboardEvent,
|
||||||
InfernoMouseEvent,
|
InfernoMouseEvent,
|
||||||
|
InfernoNode,
|
||||||
linkEvent,
|
linkEvent,
|
||||||
} from "inferno";
|
} from "inferno";
|
||||||
import {
|
import {
|
||||||
|
|
@ -13,6 +14,7 @@ import {
|
||||||
Instance,
|
Instance,
|
||||||
ListingType,
|
ListingType,
|
||||||
} from "lemmy-js-client";
|
} from "lemmy-js-client";
|
||||||
|
import deepEqual from "lodash.isequal";
|
||||||
import { I18NextService } from "../../services";
|
import { I18NextService } from "../../services";
|
||||||
import { Icon, Spinner } from "../common/icon";
|
import { Icon, Spinner } from "../common/icon";
|
||||||
import { ImageUploadForm } from "../common/image-upload-form";
|
import { ImageUploadForm } from "../common/image-upload-form";
|
||||||
|
|
@ -55,6 +57,7 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
|
||||||
initSiteForm(): EditSite {
|
initSiteForm(): EditSite {
|
||||||
const site = this.props.siteRes.site_view.site;
|
const site = this.props.siteRes.site_view.site;
|
||||||
const ls = this.props.siteRes.site_view.local_site;
|
const ls = this.props.siteRes.site_view.local_site;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
name: site.name,
|
name: site.name,
|
||||||
sidebar: site.sidebar,
|
sidebar: site.sidebar,
|
||||||
|
|
@ -619,6 +622,19 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
componentDidUpdate(
|
||||||
|
prevProps: Readonly<{ children?: InfernoNode } & SiteFormProps>
|
||||||
|
) {
|
||||||
|
if (
|
||||||
|
!(
|
||||||
|
deepEqual(prevProps.allowedInstances, this.props.allowedInstances) ||
|
||||||
|
deepEqual(prevProps.blockedInstances, this.props.blockedInstances)
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
this.setState({ siteForm: this.initSiteForm() });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
federatedInstanceSelect(key: InstanceKey) {
|
federatedInstanceSelect(key: InstanceKey) {
|
||||||
const id = `create_site_${key}`;
|
const id = `create_site_${key}`;
|
||||||
const value = this.state.instance_select[key];
|
const value = this.state.instance_select[key];
|
||||||
|
|
|
||||||
|
|
@ -205,6 +205,7 @@ export class Profile extends Component<
|
||||||
this.handleSavePost = this.handleSavePost.bind(this);
|
this.handleSavePost = this.handleSavePost.bind(this);
|
||||||
this.handlePurgePost = this.handlePurgePost.bind(this);
|
this.handlePurgePost = this.handlePurgePost.bind(this);
|
||||||
this.handleFeaturePost = this.handleFeaturePost.bind(this);
|
this.handleFeaturePost = this.handleFeaturePost.bind(this);
|
||||||
|
this.handleModBanSubmit = this.handleModBanSubmit.bind(this);
|
||||||
|
|
||||||
// Only fetch the data if coming from another route
|
// Only fetch the data if coming from another route
|
||||||
if (FirstLoadService.isFirstLoad) {
|
if (FirstLoadService.isFirstLoad) {
|
||||||
|
|
@ -691,6 +692,8 @@ export class Profile extends Component<
|
||||||
>
|
>
|
||||||
{I18NextService.i18n.t("cancel")}
|
{I18NextService.i18n.t("cancel")}
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
|
<div className="mb-3 row">
|
||||||
<button
|
<button
|
||||||
type="submit"
|
type="submit"
|
||||||
className="btn btn-secondary"
|
className="btn btn-secondary"
|
||||||
|
|
@ -987,6 +990,7 @@ export class Profile extends Component<
|
||||||
s.personRes.data.comments
|
s.personRes.data.comments
|
||||||
.filter(c => c.creator.id == banRes.data.person_view.person.id)
|
.filter(c => c.creator.id == banRes.data.person_view.person.id)
|
||||||
.forEach(c => (c.creator.banned = banRes.data.banned));
|
.forEach(c => (c.creator.banned = banRes.data.banned));
|
||||||
|
s.personRes.data.person_view.person.banned = banRes.data.banned;
|
||||||
}
|
}
|
||||||
return s;
|
return s;
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -8,60 +8,54 @@ interface MetadataCardProps {
|
||||||
post: Post;
|
post: Post;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface MetadataCardState {
|
export class MetadataCard extends Component<MetadataCardProps> {
|
||||||
expanded: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
export class MetadataCard extends Component<
|
|
||||||
MetadataCardProps,
|
|
||||||
MetadataCardState
|
|
||||||
> {
|
|
||||||
constructor(props: any, context: any) {
|
constructor(props: any, context: any) {
|
||||||
super(props, context);
|
super(props, context);
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const post = this.props.post;
|
const post = this.props.post;
|
||||||
return (
|
|
||||||
<>
|
if (post.embed_title && post.url) {
|
||||||
{post.embed_title && post.url && (
|
return (
|
||||||
<div className="post-metadata-card card border-secondary mt-3 mb-2">
|
<div className="post-metadata-card card border-secondary mt-3 mb-2">
|
||||||
<div className="row">
|
<div className="row">
|
||||||
<div className="col-12">
|
<div className="col-12">
|
||||||
<div className="card-body">
|
<div className="card-body">
|
||||||
{post.name !== post.embed_title && (
|
{post.name !== post.embed_title && (
|
||||||
<>
|
<>
|
||||||
<h5 className="card-title d-inline">
|
<h5 className="card-title d-inline">
|
||||||
<a className="text-body" href={post.url} rel={relTags}>
|
<a className="text-body" href={post.url} rel={relTags}>
|
||||||
{post.embed_title}
|
{post.embed_title}
|
||||||
</a>
|
</a>
|
||||||
</h5>
|
</h5>
|
||||||
<span className="d-inline-block ms-2 mb-2 small text-muted">
|
<span className="d-inline-block ms-2 mb-2 small text-muted">
|
||||||
<a
|
<a
|
||||||
className="text-muted fst-italic"
|
className="text-muted fst-italic"
|
||||||
href={post.url}
|
href={post.url}
|
||||||
rel={relTags}
|
rel={relTags}
|
||||||
>
|
>
|
||||||
{new URL(post.url).hostname}
|
{new URL(post.url).hostname}
|
||||||
<Icon icon="external-link" classes="ms-1" />
|
<Icon icon="external-link" classes="ms-1" />
|
||||||
</a>
|
</a>
|
||||||
</span>
|
</span>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
{post.embed_description && (
|
{post.embed_description && (
|
||||||
<div
|
<div
|
||||||
className="card-text small text-muted md-div"
|
className="card-text small text-muted md-div"
|
||||||
dangerouslySetInnerHTML={{
|
dangerouslySetInnerHTML={{
|
||||||
__html: sanitizeHtml(post.embed_description),
|
__html: sanitizeHtml(post.embed_description),
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
</div>
|
||||||
</>
|
);
|
||||||
);
|
} else {
|
||||||
|
return <></>;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -49,7 +49,7 @@ import {
|
||||||
PurgeType,
|
PurgeType,
|
||||||
VoteContentType,
|
VoteContentType,
|
||||||
} from "../../interfaces";
|
} from "../../interfaces";
|
||||||
import { mdNoImages, mdToHtml, mdToHtmlInline } from "../../markdown";
|
import { mdToHtml, mdToHtmlInline } from "../../markdown";
|
||||||
import { I18NextService, UserService } from "../../services";
|
import { I18NextService, UserService } from "../../services";
|
||||||
import { setupTippy } from "../../tippy";
|
import { setupTippy } from "../../tippy";
|
||||||
import { Icon, PurgeWarning, Spinner } from "../common/icon";
|
import { Icon, PurgeWarning, Spinner } from "../common/icon";
|
||||||
|
|
@ -105,6 +105,9 @@ interface PostListingProps {
|
||||||
allLanguages: Language[];
|
allLanguages: Language[];
|
||||||
siteLanguages: number[];
|
siteLanguages: number[];
|
||||||
showCommunity?: boolean;
|
showCommunity?: boolean;
|
||||||
|
/**
|
||||||
|
* Controls whether to show both the body *and* the metadata preview card
|
||||||
|
*/
|
||||||
showBody?: boolean;
|
showBody?: boolean;
|
||||||
hideImage?: boolean;
|
hideImage?: boolean;
|
||||||
enableDownvotes?: boolean;
|
enableDownvotes?: boolean;
|
||||||
|
|
@ -183,7 +186,6 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
addModLoading: false,
|
addModLoading: false,
|
||||||
addAdminLoading: false,
|
addAdminLoading: false,
|
||||||
transferLoading: false,
|
transferLoading: false,
|
||||||
imageExpanded: false,
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -201,7 +203,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
<>
|
<>
|
||||||
{this.listing()}
|
{this.listing()}
|
||||||
{this.state.imageExpanded && !this.props.hideImage && this.img}
|
{this.state.imageExpanded && !this.props.hideImage && this.img}
|
||||||
{post.url && this.state.showBody && post.embed_title && (
|
{this.showBody && post.url && post.embed_title && (
|
||||||
<MetadataCard post={post} />
|
<MetadataCard post={post} />
|
||||||
)}
|
)}
|
||||||
{this.showBody && this.body()}
|
{this.showBody && this.body()}
|
||||||
|
|
@ -397,7 +399,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
const post_view = this.postView;
|
const post_view = this.postView;
|
||||||
return (
|
return (
|
||||||
<span className="small">
|
<span className="small">
|
||||||
<PersonListing person={post_view.creator} muted={true} />
|
<PersonListing person={post_view.creator} />
|
||||||
{this.creatorIsMod_ && (
|
{this.creatorIsMod_ && (
|
||||||
<span className="mx-1 badge text-bg-light">
|
<span className="mx-1 badge text-bg-light">
|
||||||
{I18NextService.i18n.t("mod")}
|
{I18NextService.i18n.t("mod")}
|
||||||
|
|
@ -482,26 +484,22 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
this.postLink
|
this.postLink
|
||||||
)}
|
)}
|
||||||
</h5>
|
</h5>
|
||||||
{(url && isImage(url)) ||
|
|
||||||
(post.thumbnail_url && (
|
{/**
|
||||||
<button
|
* If there is a URL, an embed title, and we were not told to show the
|
||||||
className="btn btn-sm text-monospace text-muted d-inline-block"
|
* body by the parent component, show the MetadataCard/body toggle.
|
||||||
data-tippy-content={I18NextService.i18n.t("expand_here")}
|
*/}
|
||||||
onClick={linkEvent(this, this.handleImageExpandClick)}
|
{!this.props.showBody &&
|
||||||
>
|
post.url &&
|
||||||
<Icon
|
post.embed_title &&
|
||||||
icon={
|
this.showPreviewButton()}
|
||||||
!this.state.imageExpanded ? "plus-square" : "minus-square"
|
|
||||||
}
|
|
||||||
classes="icon-inline"
|
|
||||||
/>
|
|
||||||
</button>
|
|
||||||
))}
|
|
||||||
{post.removed && (
|
{post.removed && (
|
||||||
<small className="ms-2 badge text-bg-secondary">
|
<small className="ms-2 badge text-bg-secondary">
|
||||||
{I18NextService.i18n.t("removed")}
|
{I18NextService.i18n.t("removed")}
|
||||||
</small>
|
</small>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{post.deleted && (
|
{post.deleted && (
|
||||||
<small
|
<small
|
||||||
className="unselectable pointer ms-2 text-muted fst-italic"
|
className="unselectable pointer ms-2 text-muted fst-italic"
|
||||||
|
|
@ -510,6 +508,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
<Icon icon="trash" classes="icon-inline text-danger" />
|
<Icon icon="trash" classes="icon-inline text-danger" />
|
||||||
</small>
|
</small>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{post.locked && (
|
{post.locked && (
|
||||||
<small
|
<small
|
||||||
className="unselectable pointer ms-2 text-muted fst-italic"
|
className="unselectable pointer ms-2 text-muted fst-italic"
|
||||||
|
|
@ -518,6 +517,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
<Icon icon="lock" classes="icon-inline text-danger" />
|
<Icon icon="lock" classes="icon-inline text-danger" />
|
||||||
</small>
|
</small>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{post.featured_community && (
|
{post.featured_community && (
|
||||||
<small
|
<small
|
||||||
className="unselectable pointer ms-2 text-muted fst-italic"
|
className="unselectable pointer ms-2 text-muted fst-italic"
|
||||||
|
|
@ -529,6 +529,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
<Icon icon="pin" classes="icon-inline text-primary" />
|
<Icon icon="pin" classes="icon-inline text-primary" />
|
||||||
</small>
|
</small>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{post.featured_local && (
|
{post.featured_local && (
|
||||||
<small
|
<small
|
||||||
className="unselectable pointer ms-2 text-muted fst-italic"
|
className="unselectable pointer ms-2 text-muted fst-italic"
|
||||||
|
|
@ -538,6 +539,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
<Icon icon="pin" classes="icon-inline text-secondary" />
|
<Icon icon="pin" classes="icon-inline text-secondary" />
|
||||||
</small>
|
</small>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{post.nsfw && (
|
{post.nsfw && (
|
||||||
<small className="ms-2 badge text-bg-danger">
|
<small className="ms-2 badge text-bg-danger">
|
||||||
{I18NextService.i18n.t("nsfw")}
|
{I18NextService.i18n.t("nsfw")}
|
||||||
|
|
@ -634,27 +636,6 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
showPreviewButton() {
|
|
||||||
const post_view = this.postView;
|
|
||||||
const body = post_view.post.body;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<button
|
|
||||||
className="btn btn-sm btn-animate text-muted py-0"
|
|
||||||
data-tippy-content={body && mdNoImages.render(body)}
|
|
||||||
data-tippy-allowHtml={true}
|
|
||||||
onClick={linkEvent(this, this.handleShowBody)}
|
|
||||||
>
|
|
||||||
<Icon
|
|
||||||
icon="book-open"
|
|
||||||
classes={classNames("icon-inline me-1", {
|
|
||||||
"text-success": this.state.showBody,
|
|
||||||
})}
|
|
||||||
/>
|
|
||||||
</button>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
postActions() {
|
postActions() {
|
||||||
// Possible enhancement: Priority+ pattern instead of just hard coding which get hidden behind the show more button.
|
// Possible enhancement: Priority+ pattern instead of just hard coding which get hidden behind the show more button.
|
||||||
// Possible enhancement: Make each button a component.
|
// Possible enhancement: Make each button a component.
|
||||||
|
|
@ -666,14 +647,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
{this.saveButton}
|
{this.saveButton}
|
||||||
{this.crossPostButton}
|
{this.crossPostButton}
|
||||||
|
|
||||||
{/**
|
{this.props.showBody && post_view.post.body && this.viewSourceButton}
|
||||||
* If there is a URL, or if the post has a body and we were told not to
|
|
||||||
* show the body, show the MetadataCard/body toggle.
|
|
||||||
*/}
|
|
||||||
{(post.url || (post.body && !this.props.showBody)) &&
|
|
||||||
this.showPreviewButton()}
|
|
||||||
|
|
||||||
{this.showBody && post_view.post.body && this.viewSourceButton}
|
|
||||||
|
|
||||||
<div className="dropdown">
|
<div className="dropdown">
|
||||||
<button
|
<button
|
||||||
|
|
@ -1397,15 +1371,18 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
showBodyPreview() {
|
showPreviewButton() {
|
||||||
const { body, id } = this.postView.post;
|
return (
|
||||||
|
<button
|
||||||
return !this.showBody && body ? (
|
type="button"
|
||||||
<Link className="text-body mt-2 d-block" to={`/post/${id}`}>
|
className="btn btn-sm btn-link link-dark link-opacity-75 link-opacity-100-hover py-0 align-baseline"
|
||||||
<div className="md-div mb-1 preview-lines">{body}</div>
|
onClick={linkEvent(this, this.handleShowBody)}
|
||||||
</Link>
|
>
|
||||||
) : (
|
<Icon
|
||||||
<></>
|
icon={!this.state.showBody ? "plus-square" : "minus-square"}
|
||||||
|
classes="icon-inline"
|
||||||
|
/>
|
||||||
|
</button>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -1421,9 +1398,6 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
{/* If it has a thumbnail, do a right aligned thumbnail */}
|
{/* If it has a thumbnail, do a right aligned thumbnail */}
|
||||||
{this.mobileThumbnail()}
|
{this.mobileThumbnail()}
|
||||||
|
|
||||||
{/* Show a preview of the post body */}
|
|
||||||
{this.showBodyPreview()}
|
|
||||||
|
|
||||||
{this.commentsLine(true)}
|
{this.commentsLine(true)}
|
||||||
{this.userActionsLine()}
|
{this.userActionsLine()}
|
||||||
{this.duplicatesLine()}
|
{this.duplicatesLine()}
|
||||||
|
|
@ -1436,24 +1410,25 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
||||||
<div className="d-none d-sm-block">
|
<div className="d-none d-sm-block">
|
||||||
<article className="row post-container">
|
<article className="row post-container">
|
||||||
{!this.props.viewOnly && (
|
{!this.props.viewOnly && (
|
||||||
<VoteButtons
|
<div className="col flex-grow-0">
|
||||||
voteContentType={VoteContentType.Post}
|
<VoteButtons
|
||||||
id={this.postView.post.id}
|
voteContentType={VoteContentType.Post}
|
||||||
onVote={this.props.onPostVote}
|
id={this.postView.post.id}
|
||||||
enableDownvotes={this.props.enableDownvotes}
|
onVote={this.props.onPostVote}
|
||||||
counts={this.postView.counts}
|
enableDownvotes={this.props.enableDownvotes}
|
||||||
my_vote={this.postView.my_vote}
|
counts={this.postView.counts}
|
||||||
/>
|
my_vote={this.postView.my_vote}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
)}
|
)}
|
||||||
<div className="col-sm-2 pe-0 post-media">
|
<div className="col flex-grow-1">
|
||||||
<div className="">{this.thumbnail()}</div>
|
|
||||||
</div>
|
|
||||||
<div className="col-12 col-sm-9">
|
|
||||||
<div className="row">
|
<div className="row">
|
||||||
<div className="col-12">
|
<div className="col-sm-3 col-lg-2 pe-0 post-media">
|
||||||
|
<div className="">{this.thumbnail()}</div>
|
||||||
|
</div>
|
||||||
|
<div className="col-12 col-sm-9 col-lg-10">
|
||||||
{this.postTitleLine()}
|
{this.postTitleLine()}
|
||||||
{this.createdLine()}
|
{this.createdLine()}
|
||||||
{this.showBodyPreview()}
|
|
||||||
{this.commentsLine()}
|
{this.commentsLine()}
|
||||||
{this.duplicatesLine()}
|
{this.duplicatesLine()}
|
||||||
{this.userActionsLine()}
|
{this.userActionsLine()}
|
||||||
|
|
|
||||||
|
|
@ -348,7 +348,7 @@ export class Post extends Component<any, PostState> {
|
||||||
const res = this.state.postRes.data;
|
const res = this.state.postRes.data;
|
||||||
return (
|
return (
|
||||||
<div className="row">
|
<div className="row">
|
||||||
<main className="col-12 col-md-8 mb-3">
|
<main className="col-12 col-md-8 col-lg-9 mb-3">
|
||||||
<HtmlTags
|
<HtmlTags
|
||||||
title={this.documentTitle}
|
title={this.documentTitle}
|
||||||
path={this.context.router.route.match.url}
|
path={this.context.router.route.match.url}
|
||||||
|
|
@ -416,7 +416,7 @@ export class Post extends Component<any, PostState> {
|
||||||
{this.state.commentViewType == CommentViewType.Flat &&
|
{this.state.commentViewType == CommentViewType.Flat &&
|
||||||
this.commentsFlat()}
|
this.commentsFlat()}
|
||||||
</main>
|
</main>
|
||||||
<aside className="d-none d-md-block col-md-4">
|
<aside className="d-none d-md-block col-md-4 col-lg-3">
|
||||||
{this.sidebar()}
|
{this.sidebar()}
|
||||||
</aside>
|
</aside>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -21,7 +21,7 @@ export const markdownFieldCharacterLimit = 50000;
|
||||||
export const maxUploadImages = 20;
|
export const maxUploadImages = 20;
|
||||||
export const concurrentImageUpload = 4;
|
export const concurrentImageUpload = 4;
|
||||||
export const updateUnreadCountsInterval = 30000;
|
export const updateUnreadCountsInterval = 30000;
|
||||||
export const fetchLimit = 40;
|
export const fetchLimit = 20;
|
||||||
export const relTags = "noopener nofollow";
|
export const relTags = "noopener nofollow";
|
||||||
export const emDash = "\u2014";
|
export const emDash = "\u2014";
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -6,8 +6,7 @@ const CopyPlugin = require("copy-webpack-plugin");
|
||||||
const RunNodeWebpackPlugin = require("run-node-webpack-plugin");
|
const RunNodeWebpackPlugin = require("run-node-webpack-plugin");
|
||||||
const merge = require("lodash.merge");
|
const merge = require("lodash.merge");
|
||||||
const { ServiceWorkerPlugin } = require("service-worker-webpack");
|
const { ServiceWorkerPlugin } = require("service-worker-webpack");
|
||||||
const BundleAnalyzerPlugin =
|
|
||||||
require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
|
|
||||||
const banner = `
|
const banner = `
|
||||||
hash:[contentHash], chunkhash:[chunkhash], name:[name], filebase:[base], query:[query], file:[file]
|
hash:[contentHash], chunkhash:[chunkhash], name:[name], filebase:[base], query:[query], file:[file]
|
||||||
Source code: https://github.com/LemmyNet/lemmy-ui
|
Source code: https://github.com/LemmyNet/lemmy-ui
|
||||||
|
|
@ -156,6 +155,8 @@ const createClientConfig = (_env, mode) => {
|
||||||
});
|
});
|
||||||
|
|
||||||
if (mode === "none") {
|
if (mode === "none") {
|
||||||
|
const BundleAnalyzerPlugin =
|
||||||
|
require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
|
||||||
config.plugins.push(new BundleAnalyzerPlugin());
|
config.plugins.push(new BundleAnalyzerPlugin());
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue