Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2025-12-22 01:44:25 +04:00
Code Issues Projects Releases Wiki Activity
Files
80e63b200ca11e315f23b968123c546e0e3ee7cc
tabler/dist/docs/index.html
chomik b293328ce1 version 0.0.21
2018-04-04 16:20:23 +02:00

310 lines
18 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!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">
<link rel="icon" href="../favicon.ico" type="image/x-icon"/>
<link rel="shortcut icon" type="image/x-icon" href="../favicon.ico" />
<!-- Generated: 2018-04-04 16:20:21 +0200 -->
<title>Introduction - Documentation - tabler.github.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&amp;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>
<!-- Google Maps Plugin -->
<link href="../assets/plugins/maps-google/plugin.css" rel="stylesheet" />
<script src="../assets/plugins/maps-google/plugin.js"></script>
<!-- Input Mask Plugin -->
<script src="../assets/plugins/input-mask/plugin.js"></script>
</head>
<body class="">
<div class="page">
<div class="page-main">
<div class="header">
<div class="container">
<div class="d-flex">
<a class="navbar-brand" href="../index.html">
<img src="../demo/brand/tabler.svg" class="navbar-brand-img" alt="tabler.io">
</a>
<div class="ml-auto d-flex 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>
<div class="dropdown d-none d-md-flex">
<a class="nav-link icon" data-toggle="dropdown">
<i class="fe fe-message-square"></i>
</a>
<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
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="nav-unread"></span>
</a>
<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow px-4">
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 pr-0" data-toggle="dropdown">
<span class="avatar" style="background-image: url(../demo/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 dropdown-menu-arrow">
<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="../index.html" 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>
<a href="../pricing-cards.html" class="nav-item ">Pricing cards</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="javascript:void(0)" class="nav-link"><i class="fe fe-file"></i> Pages</a>
<div class="nav-submenu nav">
<a href="../profile.html" class="nav-item ">Profile</a>
<a href="../login.html" class="nav-item ">Login</a>
<a href="../register.html" class="nav-item ">Register</a>
<a href="../forgot-password.html" class="nav-item ">Forgot password</a>
<a href="../400.html" class="nav-item ">400 error</a>
<a href="../401.html" class="nav-item ">401 error</a>
<a href="../403.html" class="nav-item ">403 error</a>
<a href="../404.html" class="nav-item ">404 error</a>
<a href="../500.html" class="nav-item ">500 error</a>
<a href="../503.html" class="nav-item ">503 error</a>
<a href="../email.html" class="nav-item ">Email</a>
<a href="../empty.html" class="nav-item ">Empty page</a>
</div>
</li>
<li class="nav-item">
<a href="../form-elements.html" class="nav-link"><i class="fe fe-check-square"></i> Forms</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="../docs/index.html" class="nav-link active"><i class="fe fe-file-text"></i> Documentation</a>
</li>
</ul>
</div>
<div class="col-3 ml-auto">
<form class="input-icon">
<input type="search" class="form-control header-search" placeholder="Search&hellip;" 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">
Documentation
</h1>
</div>
<div class="row">
<div class="col-lg-3 order-lg-1 mb-4">
<a href="https://github.com/tabler/tabler" class="btn btn-block btn-primary mb-6">
<i class="fe fe-github mr-2"></i>Browse source code
</a>
<!-- Getting started -->
<div class="list-group list-group-transparent mb-0">
<a href="../docs/index.html" class="list-group-item list-group-item-action active"><span class="icon mr-3"><i class="fe fe-flag"></i></span>Introduction</a>
</div>
<!-- Components -->
<div class="list-group list-group-transparent mb-0">
<a href="../docs/alerts.html" class="list-group-item list-group-item-action"><span class="icon mr-3"><i class="fe fe-alert-triangle"></i></span>Alerts</a>
<a href="../docs/avatars.html" class="list-group-item list-group-item-action"><span class="icon mr-3"><i class="fe fe-user"></i></span>Avatars</a>
<a href="../docs/buttons.html" class="list-group-item list-group-item-action"><span class="icon mr-3"><i class="fe fe-plus-square"></i></span>Buttons</a>
<a href="../docs/colors.html" class="list-group-item list-group-item-action"><span class="icon mr-3"><i class="fe fe-feather"></i></span>Colors</a>
<a href="../docs/cards.html" class="list-group-item list-group-item-action"><span class="icon mr-3"><i class="fe fe-image"></i></span>Cards</a>
<a href="../docs/charts.html" class="list-group-item list-group-item-action"><span class="icon mr-3"><i class="fe fe-pie-chart"></i></span>Charts</a>
<a href="../docs/form-components.html" class="list-group-item list-group-item-action"><span class="icon mr-3"><i class="fe fe-check-square"></i></span>Form components</a>
<a href="../docs/tags.html" class="list-group-item list-group-item-action"><span class="icon mr-3"><i class="fe fe-tag"></i></span>Tags</a>
<a href="../docs/typography.html" class="list-group-item list-group-item-action"><span class="icon mr-3"><i class="fe fe-type"></i></span>Typography</a>
</div>
<div class="d-none d-lg-block mt-6">
<a href="https://github.com/tabler/tabler/edit/dev/src/_docs/index.md" class="text-muted">Edit this page</a>
</div>
</div>
<div class="col-lg-9">
<div class="card">
<div class="card-body">
<div class="text-wrap p-lg-6">
<h2 class="mt-0 mb-4">Introduction</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>
<h3 id="setup-environment">Setup environment</h3>
<p>To use our build system and run our documentation locally, you’ll need a copy of Tabler’s source files and Node. Follow these steps:</p>
<ol>
<li><a href="https://nodejs.org/download/">Download and install Node.js</a>, which we use to manage our dependencies.</li>
<li>Navigate to the root <code class="highlighter-rouge">/tabler</code> directory and run <code class="highlighter-rouge">npm install</code> to install our local dependencies listed in <code class="highlighter-rouge">package.json</code>.</li>
<li>
<p><a href="https://www.ruby-lang.org/en/documentation/installation/">Install Ruby</a>, install <a href="https://bundler.io/">Bundler</a> with <code class="highlighter-rouge">gem install bundler</code>, and finally run <code class="highlighter-rouge">bundle install</code>. This will install all Ruby dependencies, such as Jekyll and plugins.</p>
<p><strong>Windows users:</strong> Read <a href="https://jekyllrb.com/docs/windows/">this guide</a> to get Jekyll up and running without problems.</p>
</li>
</ol>
<p>When completed, you’ll be able to run the various commands provided from the command line.</p>
<h3 id="build-tabler-locally">Build Tabler locally</h3>
<ol>
<li>From the root <code class="highlighter-rouge">/tabler</code> directory, run <code class="highlighter-rouge">npm run serve</code> in the command line.</li>
<li>Open <a href="http://localhost:4000">http://localhost:4000</a> in your browser, and voilà.</li>
<li>Any change in <code class="highlighter-rouge">/src</code> directory will build application and refresh the page.</li>
</ol>
<div class="alert alert-warning">
<strong>Warning!</strong> all changes made in <code>_site/</code> folder would be overwriten on application build.
</div>
<h3 id="bugs-and-feature-requests">Bugs and feature requests</h3>
<p>Have a bug or a feature request? <a href="https://github.com/tabler/tabler/issues/new">Please open a new issue</a>.</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="#">First link</a></li>
<li><a href="#">Second link</a></li>
</ul>
</div>
<div class="col-6 col-md-3">
<ul class="list-unstyled mb-0">
<li><a href="#">Third link</a></li>
<li><a href="#">Fourth link</a></li>
</ul>
</div>
<div class="col-6 col-md-3">
<ul class="list-unstyled mb-0">
<li><a href="#">Fifth link</a></li>
<li><a href="#">Sixth link</a></li>
</ul>
</div>
<div class="col-6 col-md-3">
<ul class="list-unstyled mb-0">
<li><a href="#">Other link</a></li>
<li><a href="#">Last link</a></li>
</ul>
</div>
</div>
</div>
<div class="col-lg-4 mt-4 mt-lg-0">
Premium and Open Source dashboard template with responsive and high quality UI. For Free!
</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</a>. Theme by <a href="https://codecalm.net" target="_blank">codecalm.net</a> All rights reserved.
</div>
</div>
</div>
</footer>
</div>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink