mirror of
https://github.com/tabler/tabler.git
synced 2026-08-14 07:12:22 +04:00
390 lines
12 KiB
HTML
390 lines
12 KiB
HTML
<!doctype html>
|
||
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
|
||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||
<meta http-equiv="Content-Language" content="en" />
|
||
|
||
<meta name="msapplication-TileColor" content="#2d89ef">
|
||
<meta name="theme-color" content="#4188c9">
|
||
|
||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
|
||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||
<meta name="mobile-web-app-capable" content="yes">
|
||
<meta name="HandheldFriendly" content="True">
|
||
<meta name="MobileOptimized" content="320">
|
||
|
||
<title>Getting started - Documentation - tabler.io - a responsive, flat and full featured admin template</title>
|
||
|
||
|
||
|
||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
|
||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300i,400,400i,500,500i,600,600i,700,700i&subset=latin-ext">
|
||
<script src="../assets/js/require.min.js"></script>
|
||
<script>
|
||
requirejs.config({
|
||
baseUrl: '..'
|
||
});
|
||
</script>
|
||
|
||
<!-- Dashboard Core -->
|
||
<link href="../assets/css/dashboard.css" rel="stylesheet" />
|
||
<script src="../assets/js/dashboard.js"></script>
|
||
|
||
|
||
<!-- c3.js Charts Plugin -->
|
||
<link href="../assets/plugins/charts-c3/plugin.css" rel="stylesheet" />
|
||
<script src="../assets/plugins/charts-c3/plugin.js"></script>
|
||
|
||
|
||
</head>
|
||
<body class="">
|
||
|
||
<div class="page">
|
||
|
||
|
||
<div class="page-main">
|
||
|
||
<div class="header">
|
||
<div class="container">
|
||
<div class="navbar p-0">
|
||
<a class="navbar-brand" href="#">
|
||
<img src="./assets/images/logo.svg" class="navbar-brand-img" alt="tabler.io">
|
||
<span class="d-none d-lg-inline-block">Bootstrap</span>
|
||
</a>
|
||
<div class="nav order-lg-2">
|
||
<div class="nav-item">
|
||
<a href="https://github.com/tabler/tabler" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
|
||
</div>
|
||
<a class="nav-link icon">
|
||
<i class="fe fe-maximize"></i>
|
||
</a>
|
||
<div class="dropdown d-none d-md-flex">
|
||
<a class="nav-link icon" data-toggle="dropdown">
|
||
<i class="fe fe-message-square"></i>
|
||
<span class="badge badge-pill badge-danger">1</span>
|
||
</a>
|
||
<div class="dropdown-menu dropdown-menu-right">
|
||
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
|
||
delectus dolore dolores maxime nesciunt qui quia totam.
|
||
</div>
|
||
</div>
|
||
<div class="dropdown d-none d-md-flex">
|
||
<a class="nav-link icon" data-toggle="dropdown">
|
||
<i class="fe fe-bell"></i>
|
||
<span class="badge badge-pill badge-danger">10</span>
|
||
</a>
|
||
<div class="dropdown-menu dropdown-menu-right">
|
||
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
|
||
delectus dolore dolores maxime nesciunt qui quia totam.
|
||
</div>
|
||
</div>
|
||
<div class="dropdown">
|
||
<a href="#" class="nav-link" data-toggle="dropdown">
|
||
<span class="avatar" style="background-image: url(assets/images/faces/female/25.jpg)"></span>
|
||
<span class="ml-2 d-none d-lg-block">
|
||
<span class="text-default">Jane Pearson</span>
|
||
<small class="text-muted d-block mt-1">Administrator</small>
|
||
</span>
|
||
</a>
|
||
<div class="dropdown-menu dropdown-menu-right">
|
||
<a class="dropdown-item" href="#">
|
||
<span>Profile</span>
|
||
</a>
|
||
<a class="dropdown-item" href="#">
|
||
<span>Settings</span>
|
||
</a>
|
||
<a class="dropdown-item" href="#">
|
||
<span class="float-right"><span class="badge badge-primary">6</span></span>
|
||
<span>Inbox</span>
|
||
</a>
|
||
<a class="dropdown-item" href="#">
|
||
<span>Message</span>
|
||
</a>
|
||
<div class="dropdown-divider"></div>
|
||
<a class="dropdown-item" href="#">Need help? </a>
|
||
<a class="dropdown-item" href="#">Sign out</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="collapse navbar-collapse order-lg-1" id="navbarToggler">
|
||
<ul class="navbar-nav mt-2 mt-lg-0 mx-0 mx-lg-2">
|
||
<li class="nav-item"><a href="#" class="nav-link">Dashboard</a></li>
|
||
<li class="nav-item dropdown">
|
||
<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Projects</a>
|
||
<div class="dropdown-menu mt-2 text-color" role="menu">
|
||
<a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-tag"></i> Action </a>
|
||
<a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-pencil"></i> Another action </a>
|
||
<a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-reply"></i> Something else here</a>
|
||
<div class="dropdown-divider"></div>
|
||
<a href="#" class="dropdown-item"><i class="dropdown-icon fa fa-ellipsis-h"></i> Separated link</a>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="header-nav d-none d-lg-flex">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col">
|
||
<ul class="nav nav-tabs">
|
||
|
||
|
||
|
||
|
||
<li class="nav-item">
|
||
|
||
|
||
<a href="../." class="nav-link"><i class="fe fe-home"></i> Home</a>
|
||
|
||
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
|
||
|
||
<a href="javascript:void(0)" class="nav-link"><i class="fe fe-box"></i> Interface</a>
|
||
|
||
|
||
<div class="nav-submenu nav">
|
||
|
||
|
||
|
||
<a href="../cards.html" class="nav-item ">Cards design</a>
|
||
|
||
|
||
|
||
<a href="../charts.html" class="nav-item ">Charts</a>
|
||
|
||
</div>
|
||
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
|
||
|
||
<a href="javascript:void(0)" class="nav-link"><i class="fe fe-calendar"></i> Components</a>
|
||
|
||
|
||
<div class="nav-submenu nav">
|
||
|
||
|
||
|
||
<a href="../maps.html" class="nav-item ">Maps</a>
|
||
|
||
|
||
|
||
<a href="../icons.html" class="nav-item ">Icons</a>
|
||
|
||
|
||
|
||
<a href="../store.html" class="nav-item ">Store</a>
|
||
|
||
|
||
|
||
<a href="../blog.html" class="nav-item ">Blog</a>
|
||
|
||
</div>
|
||
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
|
||
|
||
<a href="../profile.html" class="nav-link"><i class="fe fe-user"></i> Profile</a>
|
||
|
||
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
|
||
|
||
<a href="../gallery.html" class="nav-link"><i class="fe fe-image"></i> Gallery</a>
|
||
|
||
|
||
</li>
|
||
|
||
<li class="nav-item">
|
||
|
||
|
||
<a href="../form-elements.html" class="nav-link"><i class="fe fe-check-square"></i> Forms</a>
|
||
|
||
|
||
</li>
|
||
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="col-3 ml-auto">
|
||
<form class="input-icon">
|
||
<input type="search" class="form-control header-search" placeholder="Search…" tabindex="1">
|
||
<div class="input-icon-addon">
|
||
<i class="fe fe-search"></i>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<div class="page-content">
|
||
|
||
|
||
<div class="container">
|
||
<div class="page-header">
|
||
<h1 class="page-title">
|
||
<i class=" page-title-icon"></i>
|
||
|
||
Documentation
|
||
</h1>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
</div>
|
||
|
||
<div class="row">
|
||
<div class="col-lg-3">
|
||
<div class="card">
|
||
<div class="card-body">
|
||
<ul class="list">
|
||
|
||
<li><a href="../docs/blog.html">Blog components</a></li>
|
||
|
||
<li><a href="../docs/buttons.html">Buttons</a></li>
|
||
|
||
<li><a href="../docs/charts.html">Charts</a></li>
|
||
|
||
<li><a href="../docs/form-components.html">Form components</a></li>
|
||
|
||
<li><a href="../docs/index.html">Getting started</a></li>
|
||
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-9">
|
||
<div class="card">
|
||
<div class="card-body">
|
||
|
||
|
||
<div class="text-wrap">
|
||
<h2 class="mt-0 mb-4">Getting started</h2>
|
||
|
||
|
||
|
||
<p>We’ve created this admin panel for everyone who wants to create any templates based on our ready components. Our mission is to deliver a user-friendly, clear and easy administration panel, that can be used by both, simple websites and sophisticated systems. The only requirement is a basic HTML and CSS knowledge—as a reward, you’ll be able to manage and visualize different types of data in the easiest possible way!</p>
|
||
|
||
<p>After using many of different admin panels, no matter free or paid, we’ve noticed they all had a lot of defects—and the main one was resource intensity.
|
||
They were loading loads of useless components that you wouldn’t ever use, so we’ve decided to choose a different way. The whole system is plugin-based, what means that you have a control over what is needed and what not.</p>
|
||
|
||
<p>To make the system works fast and reliable, we’ve converted most of the components to CSS. Thanks to this, you don’t have to load a lot of unnecessary libraries into your browser what really boosts the overall speed.</p>
|
||
|
||
<p>In this documentation we’re going to describe common use-cases for most of our components since we want to make our tool be accessible to everyone.</p>
|
||
|
||
<p>If you miss any component, feel free to drop us a line at: [email]—we’ll do our best to add it.</p>
|
||
|
||
<h3 id="whats-included">What’s included</h3>
|
||
|
||
<p>Within template you’ll find the following directories and files, grouping common resources and providing both compiled and minified distribution files, as well as raw source files. It’s up to you how you’re going to use them.</p>
|
||
|
||
<div class="highlighter-rouge"><div class="highlight"><pre class=""><code>tabler.io/
|
||
├── assets/
|
||
├── docs/
|
||
└── README.md
|
||
</code></pre></div></div>
|
||
|
||
<h3 id="browser-support">Browser Support</h3>
|
||
|
||
<p>tabler.io is build in Bootstrap, which supports the latest, stable releases of all major browsers and platforms. On Windows, we support Internet Explorer 10-11 / Microsoft Edge.</p>
|
||
|
||
<h3 id="license">License</h3>
|
||
|
||
<p>tabler.io is released under MIT license. tabler.io is a free Bootstrap 4 admin template developed from <a href="http://codecalm.net">codecalm.net</a>. Feel free to download it, use it, share it, get creative with it.</p>
|
||
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="footer">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-8">
|
||
<div class="row">
|
||
<div class="col-6 col-md-3">
|
||
<ul class="list-unstyled mb-0">
|
||
<li><a href="..">Advertise</a></li>
|
||
<li><a href="..">Help Center</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-6 col-md-3">
|
||
<ul class="list-unstyled mb-0">
|
||
<li><a href="..">Invite friends</a></li>
|
||
<li><a href="..">Tag photos</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-6 col-md-3">
|
||
<ul class="list-unstyled mb-0">
|
||
<li><a href="..">Stock photos</a></li>
|
||
<li><a href="..">Photobooks</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-6 col-md-3">
|
||
<ul class="list-unstyled mb-0">
|
||
<li><a href="..">Press Kit</a></li>
|
||
<li><a href="..">Contact</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 mt-4 mt-lg-0">
|
||
Lorem ipsum dolor sit amet, consectetur adipisicing elit. A consequatur corporis debitis dolore doloribus esse.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<footer class="footer">
|
||
<div class="container">
|
||
<div class="row align-items-center flex-row-reverse">
|
||
<div class="col-auto ml-auto">
|
||
<div class="row align-items-center">
|
||
<div class="col-auto">
|
||
<ul class="list-inline list-inline-dots mb-0">
|
||
<li class="list-inline-item"><a href="../docs/index.html">Documentation</a></li>
|
||
<li class="list-inline-item"><a href="../faq.html">FAQ</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-auto">
|
||
<a href="https://github.com/tabler/tabler" class="btn btn-outline-primary btn-sm">Source code</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12 col-lg-auto mt-3 mt-lg-0 text-center">
|
||
Copyright © 2018 <a href="..">tabler.io</a>. Theme by <a href="https://codecalm.net" target="_blank">codecalm.net</a> All rights reserved.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
</body>
|
||
</html> |