mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-01-08 19:45:08 +00:00
(QuickChat) Added docs page
This commit is contained in:
parent
9f97d74911
commit
c21c362b84
|
@ -0,0 +1,58 @@
|
||||||
|
<div class="flex flex-col flex-auto min-w-0">
|
||||||
|
|
||||||
|
<!-- Header -->
|
||||||
|
<div class="flex flex-col sm:flex-row flex-0 sm:items-center sm:justify-between p-6 sm:py-8 sm:px-10 border-b bg-card dark:bg-transparent">
|
||||||
|
<div class="flex-1 min-w-0">
|
||||||
|
<!-- Breadcrumbs -->
|
||||||
|
<div class="flex flex-wrap items-center font-medium">
|
||||||
|
<div>
|
||||||
|
<a class="whitespace-nowrap text-primary-500">Documentation</a>
|
||||||
|
</div>
|
||||||
|
<div class="flex items-center ml-1 whitespace-nowrap">
|
||||||
|
<mat-icon
|
||||||
|
class="icon-size-5 text-secondary"
|
||||||
|
[svgIcon]="'heroicons_solid:chevron-right'"></mat-icon>
|
||||||
|
<a class="ml-1 text-primary-500">Other Components</a>
|
||||||
|
</div>
|
||||||
|
<div class="flex items-center ml-1 whitespace-nowrap">
|
||||||
|
<mat-icon
|
||||||
|
class="icon-size-5 text-secondary"
|
||||||
|
[svgIcon]="'heroicons_solid:chevron-right'"></mat-icon>
|
||||||
|
<span class="ml-1 text-secondary">Common</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- Title -->
|
||||||
|
<div class="mt-2">
|
||||||
|
<h2 class="text-3xl md:text-4xl font-extrabold tracking-tight leading-7 sm:leading-10 truncate">
|
||||||
|
Quick Chat
|
||||||
|
</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<button
|
||||||
|
class="-ml-3 sm:ml-0 mb-2 sm:mb-0 order-first sm:order-last"
|
||||||
|
mat-icon-button
|
||||||
|
(click)="toggleDrawer()">
|
||||||
|
<mat-icon [svgIcon]="'heroicons_outline:menu'"></mat-icon>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex-auto max-w-3xl p-6 sm:p-10 prose prose-sm">
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Quick Chat is a simple component to show a Chat sidebar across the entire layout. You can remove the component from
|
||||||
|
the template file of your preferred layout to remove the Quick Chat completely.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<h2>Usage</h2>
|
||||||
|
<p>
|
||||||
|
Here's the basic usage of the component:
|
||||||
|
</p>
|
||||||
|
<textarea
|
||||||
|
fuse-highlight
|
||||||
|
lang="html">
|
||||||
|
<quick-chat></quick-chat>
|
||||||
|
</textarea>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
|
@ -0,0 +1,29 @@
|
||||||
|
import { Component } from '@angular/core';
|
||||||
|
import { OtherComponentsComponent } from 'app/modules/admin/ui/other-components/other-components.component';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector : 'quick-chat',
|
||||||
|
templateUrl: './quick-chat.component.html'
|
||||||
|
})
|
||||||
|
export class QuickChatComponent
|
||||||
|
{
|
||||||
|
/**
|
||||||
|
* Constructor
|
||||||
|
*/
|
||||||
|
constructor(private _otherComponentsComponent: OtherComponentsComponent)
|
||||||
|
{
|
||||||
|
}
|
||||||
|
|
||||||
|
// -----------------------------------------------------------------------------------------------------
|
||||||
|
// @ Public methods
|
||||||
|
// -----------------------------------------------------------------------------------------------------
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Toggle the drawer
|
||||||
|
*/
|
||||||
|
toggleDrawer(): void
|
||||||
|
{
|
||||||
|
// Toggle the drawer
|
||||||
|
this._otherComponentsComponent.matDrawer.toggle();
|
||||||
|
}
|
||||||
|
}
|
|
@ -59,6 +59,12 @@ export class OtherComponentsComponent implements OnInit, OnDestroy
|
||||||
type : 'basic',
|
type : 'basic',
|
||||||
link : '/ui/other-components/common/notifications'
|
link : '/ui/other-components/common/notifications'
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
id : 'other-components.common.quick-chat',
|
||||||
|
title: 'Quick chat',
|
||||||
|
type : 'basic',
|
||||||
|
link : '/ui/other-components/common/quick-chat'
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id : 'other-components.common.search',
|
id : 'other-components.common.search',
|
||||||
title: 'Search',
|
title: 'Search',
|
||||||
|
|
|
@ -13,6 +13,7 @@ import { OverviewComponent } from 'app/modules/admin/ui/other-components/common/
|
||||||
import { LanguagesComponent } from 'app/modules/admin/ui/other-components/common/languages/languages.component';
|
import { LanguagesComponent } from 'app/modules/admin/ui/other-components/common/languages/languages.component';
|
||||||
import { MessagesComponent } from 'app/modules/admin/ui/other-components/common/messages/messages.component';
|
import { MessagesComponent } from 'app/modules/admin/ui/other-components/common/messages/messages.component';
|
||||||
import { NotificationsComponent } from 'app/modules/admin/ui/other-components/common/notifications/notifications.component';
|
import { NotificationsComponent } from 'app/modules/admin/ui/other-components/common/notifications/notifications.component';
|
||||||
|
import { QuickChatComponent } from 'app/modules/admin/ui/other-components/common/quick-chat/quick-chat.component';
|
||||||
import { SearchComponent } from 'app/modules/admin/ui/other-components/common/search/search.component';
|
import { SearchComponent } from 'app/modules/admin/ui/other-components/common/search/search.component';
|
||||||
import { ShortcutsComponent } from 'app/modules/admin/ui/other-components/common/shortcuts/shortcuts.component';
|
import { ShortcutsComponent } from 'app/modules/admin/ui/other-components/common/shortcuts/shortcuts.component';
|
||||||
import { UserComponent } from 'app/modules/admin/ui/other-components/common/user/user.component';
|
import { UserComponent } from 'app/modules/admin/ui/other-components/common/user/user.component';
|
||||||
|
@ -29,6 +30,7 @@ import { otherComponentsRoutes } from 'app/modules/admin/ui/other-components/oth
|
||||||
LanguagesComponent,
|
LanguagesComponent,
|
||||||
MessagesComponent,
|
MessagesComponent,
|
||||||
NotificationsComponent,
|
NotificationsComponent,
|
||||||
|
QuickChatComponent,
|
||||||
SearchComponent,
|
SearchComponent,
|
||||||
ShortcutsComponent,
|
ShortcutsComponent,
|
||||||
UserComponent,
|
UserComponent,
|
||||||
|
|
|
@ -4,6 +4,7 @@ import { OverviewComponent } from 'app/modules/admin/ui/other-components/common/
|
||||||
import { LanguagesComponent } from 'app/modules/admin/ui/other-components/common/languages/languages.component';
|
import { LanguagesComponent } from 'app/modules/admin/ui/other-components/common/languages/languages.component';
|
||||||
import { MessagesComponent } from 'app/modules/admin/ui/other-components/common/messages/messages.component';
|
import { MessagesComponent } from 'app/modules/admin/ui/other-components/common/messages/messages.component';
|
||||||
import { NotificationsComponent } from 'app/modules/admin/ui/other-components/common/notifications/notifications.component';
|
import { NotificationsComponent } from 'app/modules/admin/ui/other-components/common/notifications/notifications.component';
|
||||||
|
import { QuickChatComponent } from 'app/modules/admin/ui/other-components/common/quick-chat/quick-chat.component';
|
||||||
import { SearchComponent } from 'app/modules/admin/ui/other-components/common/search/search.component';
|
import { SearchComponent } from 'app/modules/admin/ui/other-components/common/search/search.component';
|
||||||
import { ShortcutsComponent } from 'app/modules/admin/ui/other-components/common/shortcuts/shortcuts.component';
|
import { ShortcutsComponent } from 'app/modules/admin/ui/other-components/common/shortcuts/shortcuts.component';
|
||||||
import { UserComponent } from 'app/modules/admin/ui/other-components/common/user/user.component';
|
import { UserComponent } from 'app/modules/admin/ui/other-components/common/user/user.component';
|
||||||
|
@ -50,6 +51,10 @@ export const otherComponentsRoutes: Route[] = [
|
||||||
path : 'search',
|
path : 'search',
|
||||||
component: SearchComponent
|
component: SearchComponent
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path : 'quick-chat',
|
||||||
|
component: QuickChatComponent
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path : 'shortcuts',
|
path : 'shortcuts',
|
||||||
component: ShortcutsComponent
|
component: ShortcutsComponent
|
||||||
|
|
Loading…
Reference in New Issue
Block a user