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

Merge branch 'main' into breakout-role-utils

Browse source
This commit is contained in:
SleeplessOne1917 2023-06-20 21:12:18 +00:00 committed by GitHub
commit 4da34c1370
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
61 changed files with 116 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/assets/css/main.css
View file

@ -21,7 +21,7 @@
}
.upvote:hover {
color: var(--info);
color: var(--bs-info);
}
.upvote {
@ -29,7 +29,7 @@
}
.downvote:hover {
color: var(--danger);
color: var(--bs-danger);
}
.downvote {
@ -85,7 +85,7 @@
}
.post-title a:visited {
color: var(--gray) !important;
color: var(--bs-gray) !important;
}
.icon {
@ -175,7 +175,7 @@
}
blockquote {
border-left: 2px solid var(--secondary);
border-left: 2px solid var(--bs-secondary);
margin: 0.5em 5px;
padding: 0.1em 5px;
}
@ -214,7 +214,7 @@ blockquote {
}
hr {
border-top: 1px solid var(--light);
border-top: 1px solid var(--bs-light);
}
.emoji {
@ -371,7 +371,7 @@ br.big {
margin-top: 2px;
padding: 0;
list-style: none;
background: var(--light);
background: var(--bs-light);
}
.tribute-container li {
@ -380,7 +380,7 @@ br.big {
}
.tribute-container li.highlight {
background: var(--primary);
background: var(--bs-primary);
}
.tribute-container li span {
@ -415,7 +415,7 @@ br.big {
-webkit-box-orient: vertical;
}
.emoji-picker {
#emoji-picker {
width: 100%;
}

2
src/shared/components/app/error-page.tsx
View file

@ -16,7 +16,7 @@ export class ErrorPage extends Component<any, any> {
const { errorPageData } = this.isoData;
return (
<div className="container-lg text-center">
<div className="error-page container-lg text-center">
<h1>
{errorPageData
? i18n.t("error_page_title")

2
src/shared/components/app/footer.tsx
View file

@ -16,7 +16,7 @@ export class Footer extends Component<FooterProps, any> {
render() {
return (
<footer className="container-lg navbar navbar-expand-md navbar-light navbar-bg p-3">
<footer className="app-footer container-lg navbar navbar-expand-md navbar-light navbar-bg p-3">
<div className="navbar-collapse">
<ul className="navbar-nav ms-auto">
{this.props.site?.version !== VERSION && (

6
src/shared/components/comment/comment-form.tsx
View file

@ -41,7 +41,11 @@ export class CommentForm extends Component<CommentFormProps, any> {
: undefined;
return (
<div className={["mb-3", this.props.containerClass].join(" ")}>
<div
className={["comment-form", "mb-3", this.props.containerClass].join(
" "
)}
>
{UserService.Instance.myUserInfo ? (
<MarkdownTextArea
initialContent={initialContent}

2
src/shared/components/comment/comment-report.tsx
View file

@ -70,7 +70,7 @@ export class CommentReport extends Component<
};
return (
<div>
<div className="comment-report">
<CommentNode
node={node}
viewType={CommentViewType.Flat}

2
src/shared/components/common/badges.tsx
View file

@ -26,7 +26,7 @@ const isSiteAggregates = (
export const Badges = ({ counts, communityId }: BadgesProps) => {
return (
<ul className="my-1 list-inline">
<ul className="badges my-1 list-inline">
<li
className="list-inline-item badge text-bg-secondary pointer"
data-tippy-content={i18n.t("active_users_in_the_last_day", {

2
src/shared/components/common/banner-icon-header.tsx
View file

@ -16,7 +16,7 @@ export class BannerIconHeader extends Component<BannerIconHeaderProps, any> {
const icon = this.props.icon;
return (
(banner || icon) && (
<div className="position-relative mb-2">
<div className="banner-icon-header position-relative mb-2">
{banner && <PictrsImage src={banner} banner alt="" />}
{icon && (
<PictrsImage

4
src/shared/components/common/comment-sort-select.tsx
View file

@ -40,7 +40,7 @@ export class CommentSortSelect extends Component<
name={this.id}
value={this.state.sort}
onChange={linkEvent(this, this.handleSortChange)}
className="form-select d-inline-block w-auto me-2 mb-2"
className="sort-select form-select d-inline-block w-auto me-2 mb-2"
aria-label={i18n.t("sort_type")}
>
<option disabled aria-hidden="true">
@ -52,7 +52,7 @@ export class CommentSortSelect extends Component<
<option value={"Old"}>{i18n.t("old")}</option>
</select>
<a
className="text-muted"
className="sort-select-help text-muted"
href={sortingHelpUrl}
rel={relTags}
title={i18n.t("sorting_help")}

2
src/shared/components/common/data-type-select.tsx
View file

@ -31,7 +31,7 @@ export class DataTypeSelect extends Component<
render() {
return (
<div className="btn-group btn-group-toggle flex-wrap">
<div className="data-type-select btn-group btn-group-toggle flex-wrap">
<label
className={`pointer btn btn-outline-secondary
${this.state.type_ == DataType.Post && "active"}

2
src/shared/components/common/emoji-picker.tsx
View file

@ -25,7 +25,7 @@ export class EmojiPicker extends Component<EmojiPickerProps, EmojiPickerState> {
}
render() {
return (
<span>
<span className="emoji-picker">
<button
className="btn btn-sm text-muted"
data-tippy-content={i18n.t("emoji")}

2
src/shared/components/common/icon.tsx
View file

@ -59,7 +59,7 @@ export class PurgeWarning extends Component<any, any> {
render() {
return (
<div className="mt-2 alert alert-danger" role="alert">
<div className="purge-warning mt-2 alert alert-danger" role="alert">
<Icon icon="alert-triangle" classes="icon-inline me-2" />
{i18n.t("purge_warning")}
</div>

2
src/shared/components/common/image-upload-form.tsx
View file

@ -32,7 +32,7 @@ export class ImageUploadForm extends Component<
render() {
return (
<form className="d-inline">
<form className="image-upload-form d-inline">
<label
htmlFor={this.id}
className="pointer text-muted small font-weight-bold"

2
src/shared/components/common/language-select.tsx
View file

@ -49,7 +49,7 @@ export class LanguageSelect extends Component<LanguageSelectProps, any> {
return this.props.iconVersion ? (
this.selectBtn
) : (
<div>
<div className="language-select">
{this.props.multiple && this.props.showLanguageWarning && (
<div className="alert alert-warning" role="alert">
{i18n.t("undetermined_language_warning")}

2
src/shared/components/common/listing-type-select.tsx
View file

@ -39,7 +39,7 @@ export class ListingTypeSelect extends Component<
render() {
return (
<div className="btn-group btn-group-toggle flex-wrap">
<div className="listing-type-select btn-group btn-group-toggle flex-wrap">
{this.props.showSubscribed && (
<label
title={i18n.t("subscribed_description")}

6
src/shared/components/common/markdown-textarea.tsx
View file

@ -136,7 +136,11 @@ export class MarkdownTextArea extends Component<
// message={i18n.t("block_leaving")}
// />
return (
<form id={this.formId} onSubmit={linkEvent(this, this.handleSubmit)}>
<form
className="markdown-textarea"
id={this.formId}
onSubmit={linkEvent(this, this.handleSubmit)}
>
<NavigationPrompt
when={
!this.props.hideNavigationWarnings &&

4
src/shared/components/common/moment-time.tsx
View file

@ -36,7 +36,7 @@ export class MomentTime extends Component<MomentTimeProps, any> {
return (
<span
data-tippy-content={this.createdAndModifiedTimes()}
className="font-italics pointer unselectable"
className="moment-time font-italics pointer unselectable"
>
<Icon icon="edit-2" classes="icon-inline me-1" />
{moment.utc(this.props.updated).fromNow(!this.props.showAgo)}
@ -46,7 +46,7 @@ export class MomentTime extends Component<MomentTimeProps, any> {
const published = this.props.published;
return (
<span
className="pointer unselectable"
className="moment-time pointer unselectable"
data-tippy-content={this.format(published)}
>
{moment.utc(published).fromNow(!this.props.showAgo)}

2
src/shared/components/common/paginator.tsx
View file

@ -12,7 +12,7 @@ export class Paginator extends Component<PaginatorProps, any> {
}
render() {
return (
<div className="my-2">
<div className="paginator my-2">
<button
className="btn btn-secondary me-2"
disabled={this.props.page == 1}

2
src/shared/components/common/pictrs-image.tsx
View file

@ -22,7 +22,7 @@ export class PictrsImage extends Component<PictrsImageProps, any> {
render() {
return (
<picture className="d-inline-block overflow-hidden">
<picture className="pictrs-image d-inline-block overflow-hidden">
<source srcSet={this.src("webp")} type="image/webp" />
<source srcSet={this.props.src} />
<source srcSet={this.src("jpg")} type="image/jpeg" />

2
src/shared/components/common/registration-application.tsx
View file

@ -58,7 +58,7 @@ export class RegistrationApplication extends Component<
const accepted = a.creator_local_user.accepted_application;
return (
<div>
<div className="registration-application">
<div>
{i18n.t("applicant")}: <PersonListing person={a.creator} />
</div>

2
src/shared/components/common/searchable-select.tsx
View file

@ -102,7 +102,7 @@ export class SearchableSelect extends Component<
const { searchText, selectedIndex, loadingEllipses } = this.state;
return (
<div className="dropdown">
<div className="searchable-select dropdown">
<button
id={id}
type="button"

4
src/shared/components/common/sort-select.tsx
View file

@ -39,7 +39,7 @@ export class SortSelect extends Component<SortSelectProps, SortSelectState> {
name={this.id}
value={this.state.sort}
onChange={linkEvent(this, this.handleSortChange)}
className="form-select d-inline-block w-auto me-2"
className="sort-select form-select d-inline-block w-auto me-2"
aria-label={i18n.t("sort_type")}
>
<option disabled aria-hidden="true">
@ -73,7 +73,7 @@ export class SortSelect extends Component<SortSelectProps, SortSelectState> {
<option value={"TopAll"}>{i18n.t("top_all")}</option>
</select>
<a
className="text-muted"
className="sort-select-icon text-muted"
href={sortingHelpUrl}
rel={relTags}
title={i18n.t("sorting_help")}

2
src/shared/components/community/communities.tsx
View file

@ -207,7 +207,7 @@ export class Communities extends Component<any, CommunitiesState> {
render() {
return (
<div className="container-lg">
<div className="communities container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

5
src/shared/components/community/community-form.tsx
View file

@ -85,7 +85,10 @@ export class CommunityForm extends Component<
render() {
return (
<form onSubmit={linkEvent(this, this.handleCreateCommunitySubmit)}>
<form
className="community-form"
onSubmit={linkEvent(this, this.handleCreateCommunitySubmit)}
>
<NavigationPrompt
when={
!this.props.loading &&

4
src/shared/components/community/community-link.tsx
View file

@ -37,7 +37,7 @@ export class CommunityLink extends Component<CommunityLinkProps, any> {
return !this.props.realLink ? (
<Link
title={apubName}
className={`${this.props.muted ? "text-muted" : ""}`}
className={`community-link ${this.props.muted ? "text-muted" : ""}`}
to={link}
>
{this.avatarAndName(displayName)}
@ -45,7 +45,7 @@ export class CommunityLink extends Component<CommunityLinkProps, any> {
) : (
<a
title={apubName}
className={`${this.props.muted ? "text-muted" : ""}`}
className={`community-link ${this.props.muted ? "text-muted" : ""}`}
href={link}
rel={relTags}
>

4
src/shared/components/community/community.tsx
View file

@ -357,7 +357,9 @@ export class Community extends Component<
}
render() {
return <div className="container-lg">{this.renderCommunity()}</div>;
return (
<div className="community container-lg">{this.renderCommunity()}</div>
);
}
sidebar(res: GetCommunityResponse) {

2
src/shared/components/community/create-community.tsx
View file

@ -33,7 +33,7 @@ export class CreateCommunity extends Component<any, CreateCommunityState> {
render() {
return (
<div className="container-lg">
<div className="create-community container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

2
src/shared/components/community/sidebar.tsx
View file

@ -102,7 +102,7 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
render() {
return (
<div>
<div className="community-sidebar">
{!this.state.showEdit ? (
this.sidebar()
) : (

2
src/shared/components/home/admin-settings.tsx
View file

@ -120,7 +120,7 @@ export class AdminSettings extends Component<any, AdminSettingsState> {
: undefined;
return (
<div className="container-lg">
<div className="admin-settings container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

2
src/shared/components/home/emojis-form.tsx
View file

@ -75,7 +75,7 @@ export class EmojiForm extends Component<EmojiFormProps, EmojiFormState> {
render() {
return (
<div className="col-12">
<div className="home-emojis-form col-12">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

2
src/shared/components/home/home.tsx
View file

@ -374,7 +374,7 @@ export class Home extends Component<any, HomeState> {
} = this.state;
return (
<div className="container-lg">
<div className="home container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

2
src/shared/components/home/instances.tsx
View file

@ -109,7 +109,7 @@ export class Instances extends Component<any, InstancesState> {
render() {
return (
<div className="container-lg">
<div className="home-instances container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

2
src/shared/components/home/legal.tsx
View file

@ -25,7 +25,7 @@ export class Legal extends Component<any, LegalState> {
render() {
const legal = this.state.siteRes.site_view.local_site.legal_information;
return (
<div className="container-lg">
<div className="legal container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

2
src/shared/components/home/login.tsx
View file

@ -50,7 +50,7 @@ export class Login extends Component<any, State> {
render() {
return (
<div className="container-lg">
<div className="login container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

5
src/shared/components/home/rate-limit-form.tsx
View file

@ -133,7 +133,10 @@ export default class RateLimitsForm extends Component<
render() {
return (
<form onSubmit={linkEvent(this, submitRateLimitForm)}>
<form
className="rate-limit-form"
onSubmit={linkEvent(this, submitRateLimitForm)}
>
<h5>{i18n.t("rate_limit_header")}</h5>
<Tabs
tabs={rateLimitTypes.map(rateLimitType => ({

2
src/shared/components/home/setup.tsx
View file

@ -60,7 +60,7 @@ export class Setup extends Component<any, State> {
render() {
return (
<div className="container-lg">
<div className="home-setup container-lg">
<Helmet title={this.documentTitle} />
<div className="row">
<div className="col-12 offset-lg-3 col-lg-6">

2
src/shared/components/home/signup.tsx
View file

@ -127,7 +127,7 @@ export class Signup extends Component<any, State> {
render() {
return (
<div className="container-lg">
<div className="home-signup container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

5
src/shared/components/home/site-form.tsx
View file

@ -120,7 +120,10 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
render() {
const siteSetup = this.props.siteRes.site_view.local_site.site_setup;
return (
<form onSubmit={linkEvent(this, this.handleSaveSiteSubmit)}>
<form
className="site-form"
onSubmit={linkEvent(this, this.handleSaveSiteSubmit)}
>
<NavigationPrompt
when={
!this.props.loading &&

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

@ -30,7 +30,7 @@ export class SiteSidebar extends Component<SiteSidebarProps, SiteSidebarState> {
render() {
return (
<div className="accordion">
<div className="site-sidebar accordion">
<section id="sidebarInfo" className="card border-secondary mb-3">
<header
className="card-header d-flex align-items-center"

2
src/shared/components/home/tagline-form.tsx
View file

@ -31,7 +31,7 @@ export class TaglineForm extends Component<TaglineFormProps, TaglineFormState> {
render() {
return (
<div className="col-12">
<div className="tagline-form col-12">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

2
src/shared/components/modlog.tsx
View file

@ -739,7 +739,7 @@ export class Modlog extends Component<
const { actionType, modId, userId } = getModlogQueryParams();
return (
<div className="container-lg">
<div className="modlog container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

2
src/shared/components/person/cake-day.tsx
View file

@ -10,7 +10,7 @@ export class CakeDay extends Component<CakeDayProps, any> {
render() {
return (
<div
className={`mx-2 d-inline-block unselectable pointer`}
className={`cake-day mx-2 d-inline-block unselectable pointer`}
data-tippy-content={this.cakeDayTippy()}
>
<Icon icon="cake" classes="icon-inline" />

2
src/shared/components/person/inbox.tsx
View file

@ -216,7 +216,7 @@ export class Inbox extends Component<any, InboxState> {
const auth = myAuth();
const inboxRss = auth ? `/feeds/inbox/${auth}.xml` : undefined;
return (
<div className="container-lg">
<div className="inbox container-lg">
<div className="row">
<div className="col-12">
<HtmlTags

2
src/shared/components/person/password-change.tsx
View file

@ -40,7 +40,7 @@ export class PasswordChange extends Component<any, State> {
render() {
return (
<div className="container-lg">
<div className="password-change container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

2
src/shared/components/person/person-details.tsx
View file

@ -109,7 +109,7 @@ export class PersonDetails extends Component<PersonDetailsProps, any> {
render() {
return (
<div>
<div className="person-details">
{this.viewSelector(this.props.view)}
<Paginator page={this.props.page} onChange={this.handlePageChange} />

9
src/shared/components/person/person-listing.tsx
View file

@ -49,10 +49,13 @@ export class PersonListing extends Component<PersonListingProps, any> {
{!this.props.realLink ? (
<Link
title={apubName}
className={classNames("d-inline-flex align-items-baseline", {
className={classNames(
"person-listing d-inline-flex align-items-baseline",
{
"text-muted": this.props.muted,
"text-info": !this.props.muted,
})}
}
)}
to={link}
>
{this.avatarAndName(displayName)}
@ -60,7 +63,7 @@ export class PersonListing extends Component<PersonListingProps, any> {
) : (
<a
title={apubName}
className={`d-inline-flex align-items-baseline ${
className={`person-listing d-inline-flex align-items-baseline ${
this.props.muted ? "text-muted" : "text-info"
}`}
href={link}

6
src/shared/components/person/profile.tsx
View file

@ -386,7 +386,11 @@ export class Profile extends Component<
}
render() {
return <div className="container-lg">{this.renderPersonRes()}</div>;
return (
<div className="person-profile container-lg">
{this.renderPersonRes()}
</div>
);
}
get viewRadios() {

6
src/shared/components/person/registration-applications.tsx
View file

@ -117,7 +117,11 @@ export class RegistrationApplications extends Component<
}
render() {
return <div className="container-lg">{this.renderApps()}</div>;
return (
<div className="registration-applications container-lg">
{this.renderApps()}
</div>
);
}
unreadOrAllRadios() {

2
src/shared/components/person/reports.tsx
View file

@ -142,7 +142,7 @@ export class Reports extends Component<any, ReportsState> {
render() {
return (
<div className="container-lg">
<div className="person-reports container-lg">
<div className="row">
<div className="col-12">
<HtmlTags

2
src/shared/components/person/settings.tsx
View file

@ -240,7 +240,7 @@ export class Settings extends Component<any, SettingsState> {
render() {
return (
<div className="container-lg">
<div className="person-settings container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

2
src/shared/components/person/verify-email.tsx
View file

@ -52,7 +52,7 @@ export class VerifyEmail extends Component<any, State> {
render() {
return (
<div className="container-lg">
<div className="verfy-email container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

2
src/shared/components/post/create-post.tsx
View file

@ -163,7 +163,7 @@ export class CreatePost extends Component<
| undefined;
return (
<div className="container-lg">
<div className="create-post container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

7
src/shared/components/post/metadata-card.tsx
View file

@ -30,7 +30,7 @@ export class MetadataCard extends Component<
return (
<>
{!this.state.expanded && post.embed_title && post.url && (
<div className="card border-secondary mt-3 mb-2">
<div className="post-metadata-card card border-secondary mt-3 mb-2">
<div className="row">
<div className="col-12">
<div className="card-body">
@ -75,7 +75,10 @@ export class MetadataCard extends Component<
</div>
)}
{this.state.expanded && post.embed_video_url && (
<iframe src={post.embed_video_url}></iframe>
<iframe
className="post-metadata-iframe"
src={post.embed_video_url}
></iframe>
)}
</>
);

5
src/shared/components/post/post-form.tsx
View file

@ -193,7 +193,10 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
// !!this.state.form.name || !!this.state.form.url || !!this.state.form.body;
// <Prompt when={promptCheck} message={i18n.t("block_leaving")} />
return (
<form onSubmit={linkEvent(this, this.handlePostSubmit)}>
<form
className="post-form"
onSubmit={linkEvent(this, this.handlePostSubmit)}
>
<NavigationPrompt
when={
!!(

2
src/shared/components/post/post-listings.tsx
View file

@ -66,7 +66,7 @@ export class PostListings extends Component<PostListingsProps, any> {
render() {
return (
<div>
<div className="post-listings">
{this.posts.length > 0 ? (
this.posts.map((post_view, idx) => (
<>

2
src/shared/components/post/post-report.tsx
View file

@ -60,7 +60,7 @@ export class PostReport extends Component<PostReportProps, PostReportState> {
};
return (
<div>
<div className="post-report">
<PostListing
post_view={pv}
showCommunity={true}

2
src/shared/components/post/post.tsx
View file

@ -424,7 +424,7 @@ export class Post extends Component<any, PostState> {
}
render() {
return <div className="container-lg">{this.renderPostRes()}</div>;
return <div className="post container-lg">{this.renderPostRes()}</div>;
}
sortRadios() {

2
src/shared/components/private_message/create-private-message.tsx
View file

@ -134,7 +134,7 @@ export class CreatePrivateMessage extends Component<
render() {
return (
<div className="container-lg">
<div className="create-private-message container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}

5
src/shared/components/private_message/private-message-form.tsx
View file

@ -73,7 +73,10 @@ export class PrivateMessageForm extends Component<
render() {
return (
<form onSubmit={linkEvent(this, this.handlePrivateMessageSubmit)}>
<form
className="private-message-form"
onSubmit={linkEvent(this, this.handlePrivateMessageSubmit)}
>
<NavigationPrompt
when={
!this.state.loading && !!this.state.content && !this.state.submitted

2
src/shared/components/private_message/private-message-report.tsx
View file

@ -43,7 +43,7 @@ export class PrivateMessageReport extends Component<Props, State> {
);
return (
<div>
<div className="private-message-report">
<div>
{i18n.t("creator")}:{" "}
<PersonListing person={r.private_message_creator} />

2
src/shared/components/private_message/private-message.tsx
View file

@ -88,7 +88,7 @@ export class PrivateMessage extends Component<
: message_view.creator;
return (
<div className="border-top border-light">
<div className="private-message border-top border-light">
<div>
<ul className="list-inline mb-0 text-muted small">
{/* TODO refactor this */}

2
src/shared/components/search.tsx
View file

@ -453,7 +453,7 @@ export class Search extends Component<any, SearchState> {
const { type, page } = getSearchQueryParams();
return (
<div className="container-lg">
<div className="search container-lg">
<HtmlTags
title={this.documentTitle}
path={this.context.router.route.match.url}