refactor: fix btn-ghost usage to match bootstrap

remove btn-ghost-sm and replace with btn btn-ghost btn-sm
This commit is contained in:
Barış Soner Uşaklı
2024-09-11 14:04:19 -04:00
parent 8af4a18465
commit c58e09f91e
22 changed files with 139 additions and 187 deletions

View File

@@ -13,43 +13,19 @@
.tracking-tight { letter-spacing: -0.02em; }
@mixin btn-ghost-base {
display: flex;
align-items: center;
justify-content: center;
gap: ($spacer * 0.5);
border-radius: $border-radius-sm;
border-width: 1px;
border-color: transparent;
background-color: transparent;
padding: ($spacer * 0.25) ($spacer * 0.5);
text-align: left;
--bs-text-opacity: 1;
color: $btn-ghost-color;
font-family: $font-family-secondary;
cursor: pointer;
&:hover, &.active {
background-color: $btn-ghost-hover-color;
text-decoration: none;
}
}
// https://getbootstrap.com/docs/5.3/components/buttons/#variables
.btn-ghost {
@include btn-ghost-base();
line-height: 1.5rem;
> i {
line-height: 1.5rem;
}
--bs-btn-color: #{$btn-ghost-color};
--bs-btn-bg: transparent;
--bs-btn-border-color: transparent;
--bs-btn-box-shadow: none;
--bs-btn-hover-color: #{$btn-ghost-color};
--bs-btn-hover-bg: #{$btn-ghost-hover-color};
--bs-btn-hover-border-color: #{$btn-ghost-hover-color};
--bs-btn-active-bg: #{$btn-ghost-hover-color};
--bs-btn-active-border-color: transparent;
}
.btn-ghost-sm {
@include btn-ghost-base();
font-size: 0.875rem;
line-height: 1.25rem;
> i {
line-height: 1.25rem;
}
}
@include color-mode(dark) {
.btn-light {
@@ -58,10 +34,11 @@
.text-bg-light {
@extend .text-bg-dark;
}
.btn-ghost, .btn-ghost-sm {
.btn-ghost {
color: $btn-ghost-color-dark;
&:hover, &.active {
background-color: $btn-ghost-hover-color-dark;
border-color: $btn-ghost-hover-color-dark;
}
}
}

View File

@@ -1,12 +1,12 @@
#sidebar-left, #offcanvas {
.btn-ghost, .btn-ghost-sm {
.btn-ghost {
i {
color: $gray-500;
}
}
.accordion-body {
.btn-ghost-sm {
.btn-ghost.btn-sm {
padding-left: 38px!important;
}
}

View File

@@ -12,40 +12,15 @@ $btn-ghost-active-color-dark: lighten($btn-ghost-hover-color-dark, 5%)!default;
--btn-ghost-active-color: #{$btn-ghost-active-color-dark};
}
@mixin btn-ghost-base {
display: flex;
align-items: center;
justify-content: center;
gap: ($spacer * 0.5);
border-radius: $border-radius-sm;
border-width: 1px;
border-color: transparent;
background-color: transparent;
box-shadow: none;
padding: ($spacer * 0.25) ($spacer * 0.5);
text-align: left;
--bs-text-opacity: 1;
color: inherit !important;
cursor: pointer;
&:hover, &.active {
background-color: var(--btn-ghost-hover-color);
text-decoration: none;
}
}
// https://getbootstrap.com/docs/5.3/components/buttons/#variables
.btn-ghost {
@include btn-ghost-base();
line-height: 1.5rem;
> i {
line-height: 1.5rem;
}
}
.btn-ghost-sm {
@include btn-ghost-base();
font-size: 0.875rem;
line-height: 1.25rem;
> i {
line-height: 1.25rem;
}
--bs-btn-color: inherit!important;
--bs-btn-bg: transparent;
--bs-btn-border-color: transparent;
--bs-btn-box-shadow: none;
--bs-btn-hover-color: inherit;
--bs-btn-hover-bg: #{$btn-ghost-hover-color};
--bs-btn-hover-border-color: #{$btn-ghost-hover-color};
--bs-btn-active-bg: #{$btn-ghost-hover-color};
--bs-btn-active-border-color: transparent;
}

View File

@@ -198,10 +198,10 @@ define('admin/extend/plugins', [
<li class="d-flex justify-content-between gap-1 pointer border-bottom pb-2" data-plugin="${plugin}">
${plugin}
<div class="d-flex gap-1">
<div class="btn-ghost-sm move-up">
<div class="btn btn-ghost btn-sm move-up">
<i class="fa fa-chevron-up"></i>
</div>
<div class="btn-ghost-sm move-down">
<div class="btn btn-ghost btn-sm move-down">
<i class="fa fa-chevron-down"></i>
</div>
</div>

View File

@@ -21,7 +21,7 @@ define('admin/settings', [
if (anchor.startsWith('section')) {
$this.parent().attr('id', anchor);
}
tocList.append(`<a class="btn-ghost-sm text-xs justify-content-start text-decoration-none" href="#${anchor}">${header}</a>`);
tocList.append(`<a class="btn btn-ghost btn-sm text-xs text-start text-decoration-none" href="#${anchor}">${header}</a>`);
});
const offset = mainHader.outerHeight(true);
// https://stackoverflow.com/a/11814275/583363

View File

@@ -4,7 +4,7 @@
<div class="" role="tab">
<h6 class="mb-0 ps-2 d-flex justify-content-between align-items-center">
<span>{hooks.hookName}</span>
<button class="btn-ghost-sm" data-bs-toggle="collapse" data-bs-parent="#accordion" data-bs-target="#{hooks.index}" aria-expanded="true" aria-controls="{hooks.index}">View hooks ({hooks.count})</button>
<button class="btn btn-ghost btn-sm" data-bs-toggle="collapse" data-bs-parent="#accordion" data-bs-target="#{hooks.index}" aria-expanded="true" aria-controls="{hooks.index}">View hooks ({hooks.count})</button>
</h6>
</div>
<div id="{hooks.index}" class="accordion-collapse collapse" role="tabpanel">

View File

@@ -15,7 +15,7 @@
<div class="badge text-bg-light m-1 p-1 border d-inline-flex gap-1 align-items-center" data-uid="{admins.members.uid}">
{buildAvatar(admins.members, "24px", true)}
<a href="{config.relative_path}/user/{admins.members.userslug}">{admins.members.username}</a>
<button class="btn-ghost-sm p-0 remove-user-icon">
<button class="btn btn-ghost btn-sm p-0 remove-user-icon">
<i class="fa fa-fw fa-times"></i>
</button>
</div>
@@ -35,7 +35,7 @@
<div class="badge text-bg-light m-1 p-1 border d-inline-flex gap-1 align-items-center" data-uid="{globalMods.members.uid}">
{buildAvatar(globalMods.members, "24px", true)}
<a href="{config.relative_path}/user/{globalMods.members.userslug}">{globalMods.members.username}</a>
<button class="btn-ghost-sm p-0 remove-user-icon">
<button class="btn btn-ghost btn-sm p-0 remove-user-icon">
<i class="fa fa-fw fa-times"></i>
</button>
</div>
@@ -87,7 +87,7 @@
<div class="badge text-bg-light m-1 p-1 border d-inline-flex gap-1 align-items-center" data-uid="{categoryMods.moderators.uid}">
{buildAvatar(categoryMods.moderators, "24px", true)}
<a href="{config.relative_path}/user/{categoryMods.moderators.userslug}">{categoryMods.moderators.username}</a>
<button class="btn-ghost-sm p-0 remove-user-icon">
<button class="btn btn-ghost btn-sm p-0 remove-user-icon">
<i class="fa fa-fw fa-times" role="button"></i>
</button>
</div>

View File

@@ -4,7 +4,7 @@
<h4 class="fw-bold tracking-tight mb-0">[[admin/manage/categories:manage-categories]]</h4>
</div>
<div class="d-flex gap-1">
<button id="toggle-collapse-all" class="btn-ghost-sm text-nowrap" data-collapsed="0">[[admin/manage/categories:collapse-all]]</button>
<button id="toggle-collapse-all" class="btn btn-ghost btn-sm text-nowrap" data-collapsed="0">[[admin/manage/categories:collapse-all]]</button>
<!-- IMPORT admin/partials/category/selector-dropdown-right.tpl -->

View File

@@ -166,27 +166,27 @@
<div class="col-12 col-md-4 px-0 px-md-3 options acp-sidebar">
<div class="p-2 d-flex flex-column text-bg-light border rounded-1 gap-1">
<a href="{config.relative_path}/admin/manage/categories" class="btn-ghost-sm justify-content-start"><i class="fa fa-fw fa-chevron-left text-primary"></i> [[admin/manage/categories:back-to-categories]]</a>
<a href="{config.relative_path}/admin/manage/categories" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center"><i class="fa fa-fw fa-chevron-left text-primary"></i> [[admin/manage/categories:back-to-categories]]</a>
<hr class="my-1"/>
<button class="btn-ghost-sm justify-content-start copy-settings">
<button class="btn btn-ghost btn-sm d-flex gap-2 align-items-center copy-settings">
<i class="fa fa-fw fa-files-o text-primary"></i> [[admin/manage/categories:copy-settings]]
</button>
<a class="btn-ghost-sm justify-content-start" href="{config.relative_path}/admin/manage/categories/{category.cid}/analytics"><i class="fa fa-fw fa-chart-simple text-primary"></i> [[admin/manage/categories:analytics]]</a>
<a class="btn btn-ghost btn-sm d-flex gap-2 align-items-center" href="{config.relative_path}/admin/manage/categories/{category.cid}/analytics"><i class="fa fa-fw fa-chart-simple text-primary"></i> [[admin/manage/categories:analytics]]</a>
<a href="{config.relative_path}/admin/manage/privileges/{category.cid}" class="btn-ghost-sm justify-content-start">
<a href="{config.relative_path}/admin/manage/privileges/{category.cid}" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center">
<i class="fa fa-fw fa-lock text-primary"></i> [[admin/manage/categories:privileges]]
</a>
<a href="{config.relative_path}/category/{category.cid}" class="btn-ghost-sm justify-content-start">
<a href="{config.relative_path}/category/{category.cid}" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center">
<i class="fa fa-fw fa-eye text-primary"></i> [[admin/manage/categories:view-category]]
</a>
<hr class="my-1"/>
<button data-action="toggle" data-disabled="{category.disabled}" class="btn-ghost-sm justify-content-start">
<button data-action="toggle" data-disabled="{category.disabled}" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center">
{{{ if category.disabled }}}
<i class="fa fa-fw fa-check text-success"></i>
<span class="label">[[admin/manage/categories:enable]]</span>
@@ -196,7 +196,7 @@
{{{ end }}}
</button>
<button class="btn-ghost-sm purge justify-content-start">
<button class="btn btn-ghost btn-sm d-flex gap-2 align-items-center">
<i class="fa fa-fw fa-trash text-danger"></i> [[admin/manage/categories:purge]]
</button>

View File

@@ -6,7 +6,7 @@
<h4 class="fw-bold tracking-tight mb-0">[[admin/manage/groups:edit-group]]</h4>
<div component="group-selector" class="btn-group">
<button type="button" class="btn-ghost-sm dropdown-toggle w-100" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button type="button" class="btn btn-ghost btn-sm dropdown-toggle w-100" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span component="group-selector-selected">{group.displayName}</span> <span class="caret"></span>
</button>
<div component="group-selector-search" class="hidden position-absolute w-100">
@@ -148,13 +148,13 @@
<div class="col-12 col-md-4 px-0 px-md-3 acp-sidebar">
<div class="p-2 d-flex flex-column text-bg-light border rounded-1 gap-1">
<a href="{config.relative_path}/admin/manage/groups" class="btn-ghost-sm justify-content-start"><i class="fa fa-fw fa-chevron-left text-primary"></i> [[admin/manage/groups:back-to-groups]]</a>
<a href="{config.relative_path}/admin/manage/groups" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center"><i class="fa fa-fw fa-chevron-left text-primary"></i> [[admin/manage/groups:back-to-groups]]</a>
<hr class="my-1"/>
<div class="edit-privileges-selector w-100">
<div component="category-selector" class="btn-group w-100">
<button type="button" class="btn-ghost-sm justify-content-start flex-fill dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button type="button" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center flex-fill dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-fw fa-lock text-primary"></i> <span>[[admin/manage/groups:privileges]]</span> <span class="caret"></span>
</button>
<div component="category-selector-search" class="hidden position-absolute">
@@ -180,16 +180,16 @@
</div>
</div>
<a href="{config.relative_path}/api/admin/groups/{group.nameEncoded}/csv" class="btn-ghost-sm justify-content-start">
<a href="{config.relative_path}/api/admin/groups/{group.nameEncoded}/csv" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center">
<i class="fa fa-fw fa-file-csv text-primary"></i>[[admin/manage/groups:members-csv]]</a>
<a href="{config.relative_path}/groups/{group.slug}" class="btn-ghost-sm justify-content-start">
<a href="{config.relative_path}/groups/{group.slug}" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center">
<i class="fa fa-fw fa-eye text-primary"></i> [[admin/manage/groups:view-group]]
</a>
<hr class="my-1"/>
<button data-action="delete" class="btn-ghost-sm justify-content-start">
<button data-action="delete" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center">
<i class="fa fa-fw fa-trash text-danger"></i> [[admin/manage/groups:delete]]
</button>
</div>

View File

@@ -1,4 +1,4 @@
<button type="button" class="btn-ghost-sm dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button type="button" class="btn btn-ghost btn-sm dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span component="category-selector-selected">
<span class="category-item d-inline-flex align-items-center gap-1">
{{{ if (selectedCategory && !showCategorySelectLabel) }}}

View File

@@ -4,18 +4,18 @@
<!-- dashboard menu -->
<div class="d-flex flex-column">
<button class="btn-ghost justify-content-start" type="button" data-bs-toggle="collapse" data-bs-target="#collapseDashboard" aria-expanded="true" aria-controls="collapseDashboard">
<button class="btn btn-ghost btn-sm d-flex gap-2 align-items-center" type="button" data-bs-toggle="collapse" data-bs-target="#collapseDashboard" aria-expanded="true" aria-controls="collapseDashboard">
<i class="fa fa-fw fa-gauge"></i>
<div class="flex-1 font-serif text-sm fw-semibold">[[admin/menu:section-dashboard]]</div>
<div class="flex-1 font-serif text-sm fw-semibold text-start">[[admin/menu:section-dashboard]]</div>
</button>
<div id="collapseDashboard" class="accordion-collapse collapse" data-bs-parent="#accordionACP">
<div class="accordion-body p-0">
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/dashboard">[[admin/menu:dashboard/overview]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/dashboard/logins">[[admin/menu:dashboard/logins]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/dashboard/users">[[admin/menu:dashboard/users]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/dashboard/topics">[[admin/menu:dashboard/topics]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/dashboard/searches">[[admin/menu:dashboard/searches]]</a>
<div class="accordion-body p-0 d-grid">
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/dashboard">[[admin/menu:dashboard/overview]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/dashboard/logins">[[admin/menu:dashboard/logins]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/dashboard/users">[[admin/menu:dashboard/users]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/dashboard/topics">[[admin/menu:dashboard/topics]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/dashboard/searches">[[admin/menu:dashboard/searches]]</a>
</div>
</div>
</div>
@@ -23,40 +23,40 @@
<!-- manage menu -->
{{{ if showManageMenu }}}
<div class="d-flex flex-column">
<button class="btn-ghost justify-content-start" type="button" data-bs-toggle="collapse" data-bs-target="#collapseManage" aria-expanded="true" aria-controls="collapseManage">
<button class="btn btn-ghost btn-sm d-flex gap-2 align-items-center" type="button" data-bs-toggle="collapse" data-bs-target="#collapseManage" aria-expanded="true" aria-controls="collapseManage">
<i class="fa fa-fw fa-list"></i>
<div class="flex-1 font-serif text-sm fw-semibold">[[admin/menu:section-manage]]</div>
<div class="flex-1 font-serif text-sm fw-semibold text-start">[[admin/menu:section-manage]]</div>
</button>
<div id="collapseManage" class="accordion-collapse collapse" data-bs-parent="#accordionACP">
<div class="accordion-body p-0">
<div class="accordion-body p-0 d-grid">
{{{ if user.privileges.admin:categories }}}
<a class="btn-ghost-sm justify-content-start text-decoration-none" id="manage-categories" href="{relative_path}/admin/manage/categories">[[admin/menu:manage/categories]]</a>
<a class="btn btn-ghost btn-sm text-start" id="manage-categories" href="{relative_path}/admin/manage/categories">[[admin/menu:manage/categories]]</a>
{{{ end }}}
{{{ if user.privileges.admin:privileges }}}
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/manage/privileges">[[admin/menu:manage/privileges]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/manage/privileges">[[admin/menu:manage/privileges]]</a>
{{{ end }}}
{{{ if user.privileges.admin:users }}}
<a class="btn-ghost-sm justify-content-start text-decoration-none" id="manage-users" href="{relative_path}/admin/manage/users">[[admin/menu:manage/users]]</a>
<a class="btn btn-ghost btn-sm text-start" id="manage-users" href="{relative_path}/admin/manage/users">[[admin/menu:manage/users]]</a>
{{{ end }}}
{{{ if user.privileges.admin:groups }}}
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/manage/groups">[[admin/menu:manage/groups]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/manage/groups">[[admin/menu:manage/groups]]</a>
{{{ end }}}
{{{ if user.privileges.admin:admins-mods }}}
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/manage/admins-mods">[[admin/menu:manage/admins-mods]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/manage/admins-mods">[[admin/menu:manage/admins-mods]]</a>
{{{ end }}}
{{{ if user.privileges.admin:tags }}}
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/manage/tags">[[admin/menu:manage/tags]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/manage/tags">[[admin/menu:manage/tags]]</a>
{{{ end }}}
{{{ if user.privileges.superadmin }}}
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/manage/registration">[[admin/menu:manage/registration]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/manage/uploads">[[admin/menu:manage/uploads]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/manage/digest">[[admin/menu:manage/digest]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/manage/registration">[[admin/menu:manage/registration]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/manage/uploads">[[admin/menu:manage/uploads]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/manage/digest">[[admin/menu:manage/digest]]</a>
<hr/>
<h6 class="text-xs ps-4">[[pages:moderator-tools]]</h6>
<a class="btn-ghost-sm justify-content-start text-decoration-none" target="_top" href="{relative_path}/flags">[[admin/menu:manage/flagged-content]] <i class="fa fa-external-link"></i></a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" target="_top" href="{relative_path}/post-queue">[[admin/menu:manage/post-queue]] <i class="fa fa-external-link"></i></a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" target="_top" href="{relative_path}/ip-blacklist">[[admin/menu:manage/ip-blacklist]] <i class="fa fa-external-link"></i></a>
<a class="btn btn-ghost btn-sm text-start" target="_top" href="{relative_path}/flags">[[admin/menu:manage/flagged-content]] <i class="fa fa-external-link"></i></a>
<a class="btn btn-ghost btn-sm text-start" target="_top" href="{relative_path}/post-queue">[[admin/menu:manage/post-queue]] <i class="fa fa-external-link"></i></a>
<a class="btn btn-ghost btn-sm text-start" target="_top" href="{relative_path}/ip-blacklist">[[admin/menu:manage/ip-blacklist]] <i class="fa fa-external-link"></i></a>
{{{ end }}}
</div>
</div>
@@ -66,29 +66,29 @@
<!-- settings menu -->
{{{ if user.privileges.admin:settings }}}
<div class="d-flex flex-column">
<button class="btn-ghost justify-content-start" type="button" data-bs-toggle="collapse" data-bs-target="#collapseSettings" aria-expanded="true" aria-controls="collapseSettings">
<button class="btn btn-ghost btn-sm d-flex gap-2 align-items-center" type="button" data-bs-toggle="collapse" data-bs-target="#collapseSettings" aria-expanded="true" aria-controls="collapseSettings">
<i class="fa fa-fw fa-sliders"></i>
<div class="flex-1 font-serif text-sm fw-semibold">[[admin/menu:section-settings]]</div>
<div class="flex-1 font-serif text-sm fw-semibold text-start">[[admin/menu:section-settings]]</div>
</button>
<div id="collapseSettings" class="accordion-collapse collapse" data-bs-parent="#accordionACP">
<div class="accordion-body p-0">
<a class="btn-ghost-sm justify-content-start text-decoration-none" id="settings-general" href="{relative_path}/admin/settings/general">[[admin/menu:section-general]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/navigation">[[admin/menu:settings/navigation]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/user">[[admin/menu:settings/user]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/reputation">[[admin/menu:settings/reputation]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/group">[[admin/menu:settings/group]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/tags">[[admin/menu:manage/tags]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/post">[[admin/menu:settings/post]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/uploads">[[admin/menu:settings/uploads]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/email">[[admin/menu:settings/email]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/chat">[[admin/menu:settings/chat]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/pagination">[[admin/menu:settings/pagination]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/notifications">[[admin/menu:settings/notifications]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/api">[[admin/menu:settings/api]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/cookies">[[admin/menu:settings/cookies]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/web-crawler">[[admin/menu:settings/web-crawler]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/settings/advanced">[[admin/menu:settings/advanced]]</a>
<div class="accordion-body p-0 d-grid">
<a class="btn btn-ghost btn-sm text-start" id="settings-general" href="{relative_path}/admin/settings/general">[[admin/menu:section-general]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/navigation">[[admin/menu:settings/navigation]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/user">[[admin/menu:settings/user]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/reputation">[[admin/menu:settings/reputation]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/group">[[admin/menu:settings/group]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/tags">[[admin/menu:manage/tags]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/post">[[admin/menu:settings/post]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/uploads">[[admin/menu:settings/uploads]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/email">[[admin/menu:settings/email]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/chat">[[admin/menu:settings/chat]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/pagination">[[admin/menu:settings/pagination]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/notifications">[[admin/menu:settings/notifications]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/api">[[admin/menu:settings/api]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/cookies">[[admin/menu:settings/cookies]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/web-crawler">[[admin/menu:settings/web-crawler]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/settings/advanced">[[admin/menu:settings/advanced]]</a>
</div>
</div>
</div>
@@ -96,16 +96,16 @@
<!-- appearance menu -->
<div class="d-flex flex-column">
<button class="btn-ghost justify-content-start" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAppearance" aria-expanded="true" aria-controls="collapseAppearance">
<button class="btn btn-ghost btn-sm d-flex gap-2 align-items-center" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAppearance" aria-expanded="true" aria-controls="collapseAppearance">
<i class="fa fa-fw fa-paintbrush"></i>
<div class="flex-1 font-serif text-sm fw-semibold">[[admin/menu:section-appearance]]</div>
<div class="flex-1 font-serif text-sm fw-semibold text-start">[[admin/menu:section-appearance]]</div>
</button>
<div id="collapseAppearance" class="accordion-collapse collapse" data-bs-parent="#accordionACP">
<div class="accordion-body p-0">
<a class="btn-ghost-sm justify-content-start text-decoration-none" id="appearance-themes" href="{relative_path}/admin/appearance/themes">[[admin/menu:appearance/themes]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" id="appearance-skins" href="{relative_path}/admin/appearance/skins">[[admin/menu:appearance/skins]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" id="appearance-customise" href="{relative_path}/admin/appearance/customise">[[admin/menu:appearance/customise]]</a>
<div class="accordion-body p-0 d-grid">
<a class="btn btn-ghost btn-sm text-start" id="appearance-themes" href="{relative_path}/admin/appearance/themes">[[admin/menu:appearance/themes]]</a>
<a class="btn btn-ghost btn-sm text-start" id="appearance-skins" href="{relative_path}/admin/appearance/skins">[[admin/menu:appearance/skins]]</a>
<a class="btn btn-ghost btn-sm text-start" id="appearance-customise" href="{relative_path}/admin/appearance/customise">[[admin/menu:appearance/customise]]</a>
</div>
</div>
</div>
@@ -113,16 +113,16 @@
<!-- extend menu -->
<div class="d-flex flex-column">
<button class="btn-ghost justify-content-start" type="button" data-bs-toggle="collapse" data-bs-target="#collapseExtend" aria-expanded="true" aria-controls="collapseExtend">
<button class="btn btn-ghost btn-sm d-flex gap-2 align-items-center" type="button" data-bs-toggle="collapse" data-bs-target="#collapseExtend" aria-expanded="true" aria-controls="collapseExtend">
<i class="fa fa-fw fa-wrench"></i>
<div class="flex-1 font-serif text-sm fw-semibold">[[admin/menu:section-extend]]</div>
<div class="flex-1 font-serif text-sm fw-semibold text-start">[[admin/menu:section-extend]]</div>
</button>
<div id="collapseExtend" class="accordion-collapse collapse" data-bs-parent="#accordionACP">
<div class="accordion-body p-0">
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/extend/plugins">[[admin/menu:extend/plugins]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/extend/widgets">[[admin/menu:extend/widgets]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/extend/rewards">[[admin/menu:extend/rewards]]</a>
<div class="accordion-body p-0 d-grid">
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/extend/plugins">[[admin/menu:extend/plugins]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/extend/widgets">[[admin/menu:extend/widgets]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/extend/rewards">[[admin/menu:extend/rewards]]</a>
</div>
</div>
</div>
@@ -130,26 +130,26 @@
<!-- plugins menu -->
{{{ if plugins.length }}}
<div class="d-flex flex-column">
<button class="btn-ghost justify-content-start" type="button" data-bs-toggle="collapse" data-bs-target="#collapsePlugins" aria-expanded="true" aria-controls="collapsePlugins">
<button class="btn btn-ghost btn-sm d-flex gap-2 align-items-center" type="button" data-bs-toggle="collapse" data-bs-target="#collapsePlugins" aria-expanded="true" aria-controls="collapsePlugins">
<i class="fa fa-fw fa-plug"></i>
<div class="flex-1 font-serif text-sm fw-semibold">[[admin/menu:section-plugins]]</div>
<div class="flex-1 font-serif text-sm fw-semibold text-start">[[admin/menu:section-plugins]]</div>
</button>
<div id="collapsePlugins" class="accordion-collapse collapse" data-bs-parent="#accordionACP">
<div class="accordion-body p-0">
<div class="accordion-body p-0 d-grid">
{{{ each plugins }}}
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin{./route}">{./name}</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin{./route}">{./name}</a>
{{{ end }}}
{{{ if authentication.length }}}
<hr/>
<div class="text-sm ms-4">[[admin/menu:section-social-auth]]</div>
{{{ each authentication }}}
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin{./route}">{./name}</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin{./route}">{./name}</a>
{{{ end }}}
{{{ end }}}
<hr/>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/extend/plugins#download">[[admin/menu:extend/plugins.install]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/extend/plugins#download">[[admin/menu:extend/plugins.install]]</a>
</div>
</div>
</div>
@@ -159,21 +159,21 @@
<!-- advanced menu -->
{{{ if user.privileges.superadmin }}}
<div class="d-flex flex-column">
<button class="btn-ghost justify-content-start" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAdvanced" aria-expanded="true" aria-controls="collapseAdvanced">
<button class="btn btn-ghost btn-sm d-flex gap-2 align-items-center" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAdvanced" aria-expanded="true" aria-controls="collapseAdvanced">
<i class="fa fa-fw fa-superpowers"></i>
<div class="flex-1 font-serif text-sm fw-semibold">[[admin/menu:section-advanced]]</div>
<div class="flex-1 font-serif text-sm fw-semibold text-start">[[admin/menu:section-advanced]]</div>
</button>
<div id="collapseAdvanced" class="accordion-collapse collapse" data-bs-parent="#accordionACP">
<div class="accordion-body p-0">
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/advanced/database">[[admin/menu:advanced/database]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/advanced/events">[[admin/menu:advanced/events]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/advanced/hooks">[[admin/menu:advanced/hooks]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/advanced/cache">[[admin/menu:advanced/cache]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/advanced/errors">[[admin/menu:advanced/errors]]</a>
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/advanced/logs">[[admin/menu:advanced/logs]]</a>
<div class="accordion-body p-0 d-grid">
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/advanced/database">[[admin/menu:advanced/database]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/advanced/events">[[admin/menu:advanced/events]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/advanced/hooks">[[admin/menu:advanced/hooks]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/advanced/cache">[[admin/menu:advanced/cache]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/advanced/errors">[[admin/menu:advanced/errors]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/advanced/logs">[[admin/menu:advanced/logs]]</a>
{{{ if env }}}
<a class="btn-ghost-sm justify-content-start text-decoration-none" href="{relative_path}/admin/development/logger">[[admin/menu:development/logger]]</a>
<a class="btn btn-ghost btn-sm text-start" href="{relative_path}/admin/development/logger">[[admin/menu:development/logger]]</a>
{{{ end }}}
</div>
</div>

View File

@@ -2,7 +2,7 @@
<div class="offcanvas-body flex-0 pb-0 overflow-visible d-flex flex-column gap-1 ff-secondary">
<!-- IMPORT admin/partials/quick_actions/alerts.tpl -->
<a href="{config.relative_path}/" class="btn-ghost fw-semibold text-decoration-none justify-content-start"><i class="fa fa-fw fa-home"></i> [[admin/menu:view-forum]]</a>
<a href="{config.relative_path}/" class="btn btn-ghost btn-sm d-flex gap-2 fw-semibold text-decoration-none align-items-center justify-content-start"><i class="fa fa-fw fa-home"></i> [[admin/menu:view-forum]]</a>
<!-- IMPORT admin/partials/search.tpl -->
</div>

View File

@@ -1,7 +1,7 @@
{{{ if user.privileges.superadmin }}}
<button component="rebuild-and-restart" class="btn-ghost fw-semibold text-decoration-none justify-content-start" ><i class="fa fa-fw fa-refresh"></i> [[admin/menu:rebuild-and-restart]]</button>
<button component="rebuild-and-restart" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center fw-semibold text-decoration-none justify-content-start" ><i class="fa fa-fw fa-refresh"></i> [[admin/menu:rebuild-and-restart]]</button>
<button component="restart" class="btn-ghost fw-semibold text-decoration-none justify-content-start" ><i class="fa fa-fw fa-repeat"></i> [[admin/menu:restart]]</button>
<button component="restart" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center fw-semibold text-decoration-none justify-content-start" ><i class="fa fa-fw fa-repeat"></i> [[admin/menu:restart]]</button>
{{{ end }}}
<button component="logout" class="btn-ghost fw-semibold text-decoration-none justify-content-start" ><i class="fa fa-fw fa-sign-out"></i> [[admin/menu:logout]]</button>
<button component="logout" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center fw-semibold text-decoration-none justify-content-start" ><i class="fa fa-fw fa-sign-out"></i> [[admin/menu:logout]]</button>

View File

@@ -3,7 +3,7 @@
<!-- IMPORT admin/partials/quick_actions/alerts.tpl -->
<a href="{config.relative_path}/" class="btn-ghost fw-semibold text-decoration-none justify-content-start"><i class="fa fa-fw fa-home"></i> [[admin/menu:view-forum]]</a>
<a href="{config.relative_path}/" class="btn btn-ghost btn-sm d-flex gap-2 align-items-center fw-semibold text-decoration-none"><i class="fa fa-fw fa-home"></i> [[admin/menu:view-forum]]</a>
<!-- IMPORT admin/partials/search.tpl -->
</div>

View File

@@ -4,7 +4,7 @@
<div class="modal-header d-flex gap-4 justify-content-between">
<div class="fs-6 flex-grow-1 fw-semibold tracking-tight text-truncate text-nowrap" component="chat/room/name" data-icon="{icon}">{{{ if ./roomName }}}<i class="fa {icon} text-muted"></i> {roomName}{{{ else }}}{./chatWithMessage}{{{ end}}}</div>
<div class="d-flex gap-1 align-items-center">
<button type="button" class="btn-ghost-sm d-none d-md-flex" data-action="maximize" title="[[modules:chat.maximize]]" data-bs-toggle="tooltip" data-bs-placement="bottom">
<button type="button" class="btn btn-ghost btn-sm d-none d-md-flex align-self-stretch align-items-center" data-action="maximize" title="[[modules:chat.maximize]]" data-bs-toggle="tooltip" data-bs-placement="bottom">
<i class="fa fa-fw fa-expand text-muted"></i>
</button>

View File

@@ -12,14 +12,14 @@
<div class="d-flex flex-column gap-1">
<div class="d-flex gap-1 align-items-center justify-content-between justify-content-lg-start">
<button class="btn-ghost-sm p-1 order-1 order-lg-0" data-bs-toggle="collapse" data-bs-target="#public-rooms"
<button class="btn btn-ghost btn-sm p-1 order-1 order-lg-0" data-bs-toggle="collapse" data-bs-target="#public-rooms"
onclick="$(this).find('i').toggleClass('fa-rotate-180');"><i class="fa fa-fw fa-chevron-up" style="transition: 0.25s ease;"></i></button>
<label class="text-sm text-muted lh-1">[[modules:chat.public-rooms, {publicRooms.length}]]</label>
</div>
<div id="public-rooms" component="chat/public" class="collapse show">
<div class="d-flex gap-1 flex-column">
{{{ each publicRooms }}}
<div component="chat/public/room" class="btn-ghost-sm ff-sans justify-content-between hover-parent {{{ if ./unread}}}unread{{{ end }}}" data-roomid="{./roomId}">
<div component="chat/public/room" class="btn btn-ghost btn-sm ff-sans d-flex justify-content-between hover-parent {{{ if ./unread}}}unread{{{ end }}}" data-roomid="{./roomId}">
<div class="d-flex gap-1 align-items-center"><i class="fa {./icon} text-muted"></i> {./roomName} <div component="chat/public/room/unread/count" data-count="{./unreadCount}" class="badge border bg-light text-primary {{{ if !./unreadCount }}}hidden{{{ end }}}">{./unreadCountText}</div></div>
<div>
<div component="chat/public/room/sort/handle" class="text-muted {{{ if isAdmin }}}hover-d-block{{{ else }}}d-none{{{ end }}}" style="cursor:grab;"><i class="fa fa-bars"></i></div>
@@ -36,7 +36,7 @@
<div class="d-flex flex-column gap-1 overflow-auto">
{{{ if rooms.length }}}
<div class="d-flex gap-1 align-items-center justify-content-between justify-content-lg-start">
<button class="btn-ghost-sm p-1 order-1 order-lg-0" data-bs-toggle="collapse" data-bs-target="#private-rooms"
<button class="btn btn-ghost btn-sm p-1 order-1 order-lg-0" data-bs-toggle="collapse" data-bs-target="#private-rooms"
onclick="$(this).find('i').toggleClass('fa-rotate-180')"><i class="fa fa-fw fa-chevron-up" style="transition: 0.25s ease;"></i></button>
<label class="text-sm text-muted lh-1">[[modules:chat.private-rooms, {privateRoomCount}]]</label>
</div>

View File

@@ -1,17 +1,17 @@
<div component="chat/composer" class="d-flex flex-column border-top pt-2 align-items-start">
<div component="chat/composer/replying-to" data-tomid="" class="text-sm px-2 mb-1 d-flex gap-2 align-items-center hidden">
<div component="chat/composer/replying-to-text"></div> <button component="chat/composer/replying-to-cancel" class="btn-ghost-sm px-2 py-1"><i class="fa fa-times"></i></button>
<div component="chat/composer/replying-to-text"></div> <button component="chat/composer/replying-to-cancel" class="btn btn-ghost btn-sm px-2 py-1"><i class="fa fa-times"></i></button>
</div>
<div class="w-100 flex-grow-1 flex-nowrap position-relative d-flex rounded-2 border border-secondary p-1 align-items-end">
<button component="chat/upload/button" class="btn-ghost-sm px-2" type="button" title="[[global:upload]]" data-bs-toggle="tooltip"><i class="fa fa-fw fa-upload"></i></button>
<button component="chat/upload/button" class="btn btn-ghost btn-sm d-flex p-2" type="button" title="[[global:upload]]" data-bs-toggle="tooltip"><i class="fa fa-fw fa-upload"></i></button>
<div class="flex-grow-1 align-self-center">
<textarea component="chat/input" placeholder="{{{ if roomName }}}[[modules:chat.placeholder.message-room, {roomName}]]{{{ else }}}[[modules:chat.placeholder.mobile]]{{{ end }}}" class="bg-transparent text-body form-control chat-input mousetrap rounded-0 border-0 shadow-none px-1 py-0" style="min-height: 1.5rem;height:0;max-height:30vh;resize:none;"></textarea>
</div>
<div class="d-flex gap-1">
{{{ each composerActions }}}
<button data-action="{./action}" class="btn-ghost-sm px-2 {./class}" type="button" title="{./title}" data-bs-toggle="tooltip"><i class="fa {./icon}"></i></button>
<button data-action="{./action}" class="btn btn-ghost btn-sm d-flex p-2 {./class}" type="button" title="{./title}" data-bs-toggle="tooltip"><i class="fa {./icon}"></i></button>
{{{ end }}}
<button class="btn-ghost-sm px-2" type="button" data-action="send" title="[[modules:chat.send]]" data-bs-toggle="tooltip"><i class="fa fa-fw fa-paper-plane text-primary"></i></button>
<button class="btn btn-ghost btn-sm d-flex p-2" type="button" data-action="send" title="[[modules:chat.send]]" data-bs-toggle="tooltip"><i class="fa fa-fw fa-paper-plane text-primary"></i></button>
</div>
</div>
<div class="d-flex justify-content-between align-items-center text-xs w-100 px-2 mt-1">

View File

@@ -1,6 +1,6 @@
<div class="d-flex gap-1 align-items-stretch">
<!-- search -->
<button class="btn-ghost-sm" component="chat/room/search/toggle" data-manual-tooltip="1" title="[[global:header.search]]">
<button class="btn btn-ghost btn-sm" component="chat/room/search/toggle" data-manual-tooltip="1" title="[[global:header.search]]">
<i class="fa fa-search text-muted"></i>
</button>
<div component="chat/room/search/container" class="position-relative hidden align-self-center">
@@ -13,7 +13,7 @@
<!-- notification dropdown -->
<div class="dropdown d-flex" data-manual-tooltip="1" title="[[modules:chat.notification-settings]]" component="chat/notification/setting">
<button class="btn-ghost-sm position-relative" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button class="btn btn-ghost btn-sm position-relative" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-bell text-muted"></i>
<span class="position-absolute top-0 end-0 text-xs text-muted opacity-50" style="font-size: 10px!important; padding: 1px; line-height: 10px;">
<i component="chat/notification/setting/icon" class="fa {notificationOptionsIcon}"></i>
@@ -43,13 +43,13 @@
</div>
<!-- pinned messages -->
<button component="chat/pinned/messages/btn" class="btn-ghost-sm d-none d-lg-flex flex-nowrap" title="[[modules:chat.pinned-messages]]" data-bs-toggle="tooltip" data-bs-placement="bottom">
<button component="chat/pinned/messages/btn" class="btn btn-ghost btn-sm d-none d-lg-block flex-nowrap" title="[[modules:chat.pinned-messages]]" data-bs-toggle="tooltip" data-bs-placement="bottom">
<i class="fa fa-thumb-tack text-muted"></i>
</button>
<!-- manage/options dropdown -->
<div class="dropdown d-flex" data-manual-tooltip="1" title="[[modules:chat.options]]">
<button component="chat/controlsToggle" class="btn-ghost-sm" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<button component="chat/controlsToggle" class="btn btn-ghost btn-sm" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="fa fa-gear text-muted"></i>
</button>
<ul class="dropdown-menu dropdown-menu-end p-1 text-sm" component="chat/controls" role="menu">
@@ -82,7 +82,7 @@
<!-- users toggle -->
{{{ if users.length }}}
<div component="chat/user/list/btn" class="btn-ghost-sm d-none d-lg-flex flex-nowrap gap-3" title="[[modules:chat.view-users-list]]" data-bs-toggle="tooltip" data-bs-placement="bottom">
<div component="chat/user/list/btn" class="btn btn-ghost btn-sm d-none d-lg-flex flex-nowrap gap-3" title="[[modules:chat.view-users-list]]" data-bs-toggle="tooltip" data-bs-placement="bottom">
<div class="d-flex text-nowrap">
{{{ if ./users.0 }}}
<span style="width: 18px; z-index: 3;" class="text-decoration-none" href="{config.relative_path}/user/{./users.0.userslug}">{buildAvatar(./users.0, "24px", true)}</span>

View File

@@ -1,5 +1,5 @@
<div class="d-flex ms-4 mb-2 align-items-center">
<div component="chat/message/parent" data-parent-mid="{messages.parent.mid}" data-uid="{messages.parent.fromuid}" class="btn-ghost-sm ff-secondary align-items-start flex-row w-100">
<div component="chat/message/parent" data-parent-mid="{messages.parent.mid}" data-uid="{messages.parent.fromuid}" class="btn btn-ghost btn-sm d-flex gap-2 ff-secondary text-start flex-row w-100">
<div class="d-flex gap-2 text-sm text-nowrap">
<div><i class="fa fa-sm fa-reply opacity-50"></i></div>
<div class="d-flex flex-nowrap gap-1 align-items-center">

View File

@@ -3,7 +3,7 @@
{{{ end }}}
<div component="chat/recent/room" data-roomid="{./roomId}" data-full="1" class="rounded-1 {{{ if ./unread }}}unread{{{ end }}}">
<div class="d-flex gap-1 justify-content-between">
<div class="chat-room-btn position-relative d-flex flex-grow-1 gap-2 justify-content-start align-items-start btn-ghost-sm ff-sans">
<div class="chat-room-btn position-relative d-flex flex-grow-1 gap-2 justify-content-start align-items-start btn btn-ghost btn-sm ff-sans text-start">
<div class="main-avatar">
{{{ if ./users.length }}}
{{{ if ./groupChat}}}
@@ -35,7 +35,7 @@
</div>
</div>
<div>
<button class="mark-read btn-ghost-sm" style="width: 1.5rem; height: 1.5rem;">
<button class="mark-read btn btn-ghost btn-sm d-flex align-items-center justify-content-center flex-grow-0 flex-shrink-0 p-1" style="width: 1.5rem; height: 1.5rem;">
<i class="unread fa fa-2xs fa-circle text-primary {{{ if !./unread }}}hidden{{{ end }}}" aria-label="[[unread:mark-as-read]]"></i>
<i class="read fa fa-2xs fa-circle-o text-secondary {{{ if ./unread }}}hidden{{{ end }}}" aria-label="[[unread:mark-as-unread]]"></i>
</button>

View File

@@ -1,6 +1,6 @@
<div component="chat/user/list" class="border-start hidden d-flex flex-column gap-1 p-1 overflow-auto ghost-scrollbar" style="min-width:240px; width: 240px;">
{{{ each users }}}
<a data-index="{./index}" data-uid="{./uid}" class="btn-ghost-sm ff-secondary d-flex justify-content-start align-items-center gap-2 {{{ if ./online }}}online{{{ end}}}" href="{config.relative_path}/uid/{./uid}">
<a data-index="{./index}" data-uid="{./uid}" class="btn btn-ghost btn-sm d-flex ff-secondary d-flex justify-content-start align-items-center gap-2 {{{ if ./online }}}online{{{ end}}}" href="{config.relative_path}/uid/{./uid}">
<div>{buildAvatar(users, "24px", true)}</div>
<div class="d-flex gap-1 flex-grow-1 text-nowrap text-truncate">
<span component="chat/user/list/username" class="text-truncate">{./username}</span>