File size: 11.12Kb
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Getting Started | Chatvia - Responsive TailwindCSS Chat App</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="Chatvia Premium Multipurpose Admin & Dashboard Template documentation of HTML" name="description" />
<meta content="Themesbrand" name="author" />
<meta name="keywords" content="Chatvia HTML documentation">
<!-- App favicon -->
<link rel="shortcut icon" href="assets/images/favicon.ico">
<!-- TailwindCSS Css -->
<link href="assets/css/bootstrap.min.css" id="bootstrap-style" rel="stylesheet" type="text/css" />
<!-- Icons Css -->
<link href="assets/css/icons.min.css" rel="stylesheet" type="text/css" />
<!-- App Css-->
<link href="assets/css/app.min.css" id="app-style" rel="stylesheet" type="text/css" />
</head>
<body data-topbar="dark" data-spy="scroll" data-target=".right-side-nav" data-offset="175">
<!-- Begin page -->
<div id="layout-wrapper">
<header id="page-topbar">
<div class="navbar-header">
<div class="d-flex">
<!-- LOGO -->
<div class="navbar-brand-box">
<a href="index.html" class="logo logo-light">
<span class="logo-sm">
<img src="assets/images/logo.svg" alt="" height="25">
</span>
<span class="logo-lg">
<img src="assets/images/logo-light.png" alt="" height="22"> <span class="badge badge-soft-success ml-2">HTML</span>
</span>
</a>
</div>
<button type="button" class="btn btn-sm px-3 font-size-24 header-item waves-effect d-lg-none" id="vertical-menu-btn">
<i class="mdi mdi-menu"></i>
</button>
</div>
<div class="d-flex">
<div class="d-inline-block">
<a href="index.html#" target="_blank" class="header-item">Support</a>
</div>
<div class="d-none d-md-inline-block">
<a href="https://docs.google.com/forms/d/e/1FAIpQLSfiP9bDHzIQdQoMXFrYvJx00wyFzSu_cqBWP0N0uUHpqjrbzQ/viewform" target="_blank" class="header-item">Need Customization?</a>
</div>
<div class="d-inline-block">
<a href="https://1.envato.market/chatvia-tailwind-css-chat-app" target="_blank" class="header-item">Buy Now</a>
</div>
<div class="d-inline-block">
<h5 class="header-item m-0"><span class="badge badge-danger">v1.0.0</span></h5>
</div>
</div>
</div>
</header>
<!-- ========== Left Sidebar Start ========== -->
<div class="vertical-menu">
<div data-simplebar class="h-100">
<!--- Sidemenu -->
<div id="sidebar-menu">
<!-- Left Menu Start -->
<ul class="metismenu list-unstyled" id="side-menu">
<li class="menu-title">Docs</li>
<li>
<a href="index.html" class="waves-effect">
<i class="mdi mdi-text-box-outline"></i>
<span>Introduction</span>
</a>
</li>
<li>
<a href="setup.html" class=" waves-effect">
<i class="mdi mdi-cog-outline"></i>
<span>Setup</span>
</a>
</li>
<li class="menu-title">Themes</li>
<li>
<a href="light.html" class=" waves-effect">
<i class="mdi mdi-white-balance-sunny"></i>
<span>Light Version</span>
</a>
</li>
<li>
<a href="dark.html" class=" waves-effect">
<i class="mdi mdi-weather-night"></i>
<span>Dark Version</span>
</a>
</li>
<li>
<a href="rtl.html" class=" waves-effect">
<i class="mdi mdi-web"></i>
<span>RTL Version</span>
</a>
</li>
<li>
<a href="colors.html" class=" waves-effect">
<i class="mdi mdi-palette"></i>
<span>Color Version</span>
</a>
</li>
<li class="menu-title">Other</li>
<li>
<a href="changelog.html" class=" waves-effect">
<i class="mdi mdi-format-list-bulleted"></i>
<span>Changelog</span>
</a>
</li>
</ul>
</div>
<!-- Sidebar -->
</div>
</div>
<!-- Left Sidebar End -->
<!-- ============================================================== -->
<!-- Start right Content here -->
<!-- ============================================================== -->
<div class="main-content">
<div class="page-content">
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<div class="card">
<div class="card-body">
<div class="d-xl-flex">
<div class="w-100">
<div class="p-lg-1">
<div id="intro" class="mb-5">
<h4 class="mt-0 mb-4">Introduction</h4>
<p>
Thank you for purchasing Chatvia - Responsive Chat App Template.
</p>
<p>
Chatvia is built with <strong>TailwindCSS</strong> in HTML, css with responsive with all devices and supported with Dark, light, RTL modes. You can change mode very quickly by doing a single change. It has many features like one to one chat, group chat, contact, send files, online users, read and unread new messages from users, authentication pages and many more.
</p>
</div>
<div id="structure" class="mb-5">
<h5 class="mt-0 mb-4">📁 Folder & Files Structure</h5>
<div class="row">
<div class="col-md-6">
<pre class="mb-0">
├── Documentation
├── HTML
├── dist
├── src directory
├── assets
├── php
├── images
├── js
└── css
├── custom
├── fonts
├── icons
├── plugins
├── structure
├── icons.css
└── tailwind.css
├── partials
└── all html pages
├── postcss.config.js
├── vite.config.js
├── package.json
└── tailwind.config.js
</pre>
</div>
</div>
</div>
</div> <!-- end padding-->
</div>
<!-- Start right-side-nav -->
<div class="d-none d-xl-block">
<div class="right-side-nav">
<ul class="nav nav-pills flex-column">
<li class="nav-item">
<a href="index.html#intro" class="nav-link">Introduction</a>
</li>
<li class="nav-item">
<a href="index.html#structure" class="nav-link">Folder & Files Structure</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<!--end card body-->
</div> <!-- end card-->
</div>
</div>
<!-- end row -->
</div> <!-- container-fluid -->
</div>
<!-- End Page-content -->
<footer class="footer">
<div class="container-fluid">
<div class="row">
<div class="col-sm-6">
<script>document.write(new Date().getFullYear())</script> © Themesbrand.
</div>
<div class="col-sm-6">
<div class="text-sm-right d-none d-sm-block">
Crafted with <i class="mdi mdi-heart text-danger"></i> by <a href="https://themesbrand.com/" target="_blank" class="text-muted">Themesbrand</a>
</div>
</div>
</div>
</div>
</footer>
</div>
<!-- end main content-->
</div>
<!-- END layout-wrapper -->
<!-- JAVASCRIPT -->
<script src="assets/libs/jquery/jquery.min.js"></script>
<script src="assets/libs/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/libs/simplebar/simplebar.min.js"></script>
<script src="assets/libs/jquery.easing/jquery.easing.min.js"></script>
<script src="assets/js/app.js"></script>
</body>
</html>