Andreas/ngx-admin
1
0
Fork 0
mirror of https://github.com/akveo/ngx-admin.git synced 2026-01-05 17:18:50 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Updates

Browse source
This commit is contained in:
Alexander Zhukov 2017-04-28 16:56:56 +03:00
parent 00a47bf22f
commit c318193502
9 changed files with 97 additions and 90 deletions
Download patch file Download diff file Expand all files Collapse all files

14
articles/001-getting-started/index.html
View file

@ -51,7 +51,7 @@
<div class="inner-content">
<h1>Getting Started</h1>
<div class="subHeader"></div><h2 id="what-is-ng2-admin-">What is ng2-admin?</h2>
<p>ng2-admin is a front-end Admin Dashboard template based on Angular 2, Bootstrap 4 and Webpack. That means all the
<p>ng2-admin is a front-end Admin Dashboard template based on Angular, Bootstrap 4 and Angular <span class="caps">CLI</span>. That means all the
data you can see on graphs, charts and tables is mocked in Javascript so you can use the
backend of your choice with no<span class="widont">&nbsp;</span>limitations.</p>
<h2 id="how-can-it-help-me-">How can it help<span class="widont">&nbsp;</span>me?</h2>
@ -60,12 +60,12 @@ backend of your choice with no<span class="widont">&nbsp;</span>limitations.</p>
ecosystem for building production-ready application or<span class="widont">&nbsp;</span>prototypes.</p>
<p>Frameworks like Bootstrap provide a number of components, but usually it’s not enough to
build a real-world app. This template comes with lots of popular <span class="caps">UI</span> components with a unified color scheme,
plus it is based on a modern Angular 2 framework and has a flexible component based<span class="widont">&nbsp;</span>structure.</p>
<p>You can also use ng2-admin for the purpose of learning Angular<span class="widont">&nbsp;</span>2.</p>
plus it is based on a modern Angular framework and has a flexible component based<span class="widont">&nbsp;</span>structure.</p>
<p>You can also use ng2-admin for the purpose of learning<span class="widont">&nbsp;</span>Angular.</p>
<h2 id="list-of-features">List of features</h2>
<ul>
<li>Angular 2</li>
<li>Webpack 2</li>
<li>Angular 2+</li>
<li>Angular <span class="caps">CLI</span></li>
<li>Bootstrap 4 <span class="caps">CSS</span><span class="widont">&nbsp;</span>Framework</li>
<li><span class="caps">SASS</span></li>
<li><a href="http://akveo.com/ng2-admin/#/pages/tables/smarttables">Smart Table</a></li>
@ -86,8 +86,8 @@ There we describe how you can download and run the template on your local<span c
</div>
</section>
<footer class="wrap">
<div class="left">Powered by Angular 2, Bootstrap 4, Webpack and many more...</div>
<div class="right">© 2015–2016 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
<div class="left">Powered by Angular, Bootstrap 4, Angular CLI and many more...</div>
<div class="right">© 2017 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
</footer>
</div><a href="https://github.com/akveo/ng2-admin" title="Star &amp; Fork on GitHub" class="github-fork-ribbon"></a>
</body>

18
articles/002-installation-guidelines/index.html
View file

@ -59,7 +59,7 @@ The following instructions allow you to run a local copy on your<span class="wid
<li>Download and install <a href="https://git-scm.com/">git</a></li>
<li>Download and install nodejs <a href="https://nodejs.org">https://nodejs.org</a></li>
</ul>
<p><strong>Note</strong>: Make sure you have Node version &gt;= 4.0 and <span class="caps">NPM</span> &gt;=<span class="widont">&nbsp;</span>3</p>
<p><strong>Note</strong>: Make sure you have Node version &gt;= 6.0 and <span class="caps">NPM</span> &gt;=<span class="widont">&nbsp;</span>3</p>
<h2 id="clone-repository-and-install-dependencies">Clone repository and install<span class="widont">&nbsp;</span>dependencies</h2>
<p>You will need to clone the source code of ng2-admin GitHub<span class="widont">&nbsp;</span>repository:</p>
<pre><code class="lang-bash">git <span class="built_in">clone</span> https://github.com/akveo/ng2-admin.git
@ -68,26 +68,32 @@ The following instructions allow you to run a local copy on your<span class="wid
<pre><code class="lang-bash"><span class="built_in">cd</span> ng2-admin
npm install
</code></pre>
<p>or</p>
<pre><code class="lang-bash"><span class="built_in">cd</span> ng2-admin
yarn
</code></pre>
<p>This will setup a working copy of ng2-admin on your local<span class="widont">&nbsp;</span>machine.</p>
<h2 id="running-local-copy">Running local copy</h2>
<p>To run a local copy in development mode,<span class="widont">&nbsp;</span>execute:</p>
<pre><code class="lang-bash">npm start
</code></pre>
<p>Go to <a href="http://0.0.0.0:3000">http://0.0.0.0:3000</a> or <a href="http://localhost:3000">http://localhost:3000</a> in your<span class="widont">&nbsp;</span>browser.</p>
<p>Go to <a href="http://0.0.0.0:4200">http://0.0.0.0:4200</a> or <a href="http://localhost:4200">http://localhost:4200</a> in your<span class="widont">&nbsp;</span>browser.</p>
<p>To run the local copy in production mode and build the sources,<span class="widont">&nbsp;</span>execute:</p>
<pre><code class="lang-bash">npm run prebuild:prod &amp;&amp; npm run build:prod &amp;&amp; npm run server:prod
<pre><code class="lang-bash">npm run start:prod
</code></pre>
<p>or in <span class="caps">AOT</span><span class="widont">&nbsp;</span>mode</p>
<pre><code class="lang-bash">npm run start:prod:aot
</code></pre>
<p>This will clear up your dist folder (where release files are located), generate a release build and start the
built-in server.
Now you can copy the sources from the <code>dist</code> folder and use it with any backend framework or
simply put it under a web<span class="widont">&nbsp;</span>server.</p>
<p>For addition information about creating a build, please check out <a href="https://github.com/AngularClass/angular2-webpack-starter">Angular2 Webpack Starter<span class="widont">&nbsp;</span>documentation</a></p>
</div>
</section>
<footer class="wrap">
<div class="left">Powered by Angular 2, Bootstrap 4, Webpack and many more...</div>
<div class="right">© 2015–2016 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
<div class="left">Powered by Angular, Bootstrap 4, Angular CLI and many more...</div>
<div class="right">© 2017 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
</footer>
</div><a href="https://github.com/akveo/ng2-admin" title="Star &amp; Fork on GitHub" class="github-fork-ribbon"></a>
</body>

8
articles/011-changing-color-scheme/index.html
View file

@ -51,14 +51,14 @@
<div class="inner-content">
<h1>Changing Color Scheme</h1>
<div class="subHeader"></div><p>We tried to make the process of color scheme customization as easy as<span class="widont">&nbsp;</span>possible. </p>
<p>By default ng2-admin has three built-in color profiles: ng2 (default blue sheme), mint and blur.
<p>By default ng2-admin has three built-in color profiles: ng2 (default blue scheme), mint and blur.
This article will help you to create your own color profile.
Let’s say you want to make ng2-admin dark<span class="widont">&nbsp;</span>theme.</p>
<p>First we advise you to take some existing colorscheme file as a starting point.
For light themes we suggest taking <code>src/app/theme/sass/conf/colorScheme/_mint.scss</code> and for
dark <code>src/app/theme/sass/conf/colorScheme/_blue.scss</code>.
As we want a dark theme, we’re taking <code>blue</code>.</p>
<p>1) Copy <code>src/app/theme/sass/conf/colorScheme/_mint.scss</code> to <code>src/app/theme/sass/conf/colorScheme/_dark.scss</code>:
<p>1) Copy <code>src/app/theme/sass/conf/colorScheme/_blue.scss</code> to <code>src/app/theme/sass/conf/colorScheme/_dark.scss</code>:
<br><br></p>
<p>2) Include your colorscheme file in <code>src/app/theme/sass/conf/conf.scss</code>.</p>
<p>To do this,<span class="widont">&nbsp;</span>replace</p>
@ -148,8 +148,8 @@ We also defined a couple of custom colors for dashboard<span class="widont">&nbs
</div>
</section>
<footer class="wrap">
<div class="left">Powered by Angular 2, Bootstrap 4, Webpack and many more...</div>
<div class="right">© 2015–2016 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
<div class="left">Powered by Angular, Bootstrap 4, Angular CLI and many more...</div>
<div class="right">© 2017 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
</footer>
</div><a href="https://github.com/akveo/ng2-admin" title="Star &amp; Fork on GitHub" class="github-fork-ribbon"></a>
</body>

91
articles/012-project-structure/index.html
View file

@ -50,67 +50,64 @@
</div>
<div class="inner-content">
<h1>Project Structure</h1>
<div class="subHeader"></div><p>The project structure is originally based on <a href="https://github.com/AngularClass/angular2-webpack-starter#file-structure">Angular2 Webpack Starter</a>. We made some changes we thought would be better in our particular<span class="widont">&nbsp;</span>case.</p>
<p>The directory structure of this template is as<span class="widont">&nbsp;</span>follows:</p>
<div class="subHeader"></div><p>The directory structure of this template is as<span class="widont">&nbsp;</span>follows:</p>
<pre><code>ng2-admin/
├──config/ * webpack build configuration
│ ├──head-config.common.js * configuration for head elements in index.html
├──e2e/
│ ├──tsconfig.e2e.json * typescript config that protractor use for e2e tests
│
├──src/ * source files that will be compiled to javascript
│ ├──typings.d.ts * custom typings for third-party modules
│ │
│ ├──helpers.js * helper functions for our configuration files
│ ├──index.html * application layout
│ │
│ ├──webpack.dev.js * development webpack config
│ ├──main.ts * entry file for our browser environment
│ │
│ ├──webpack.prod.js * production webpack config
│ ├──polyfills.ts * polyfills file
│ │
│ ├──webpack.test.js * testing webpack config
│ │
│ ├──electron/ * electron webpack config
│ │
│ └──html-elements-plugin/ * html elements plugin
│
├──src/ * source files that will be compiled to javascript
│ ├──custom-typings.d.ts * custom typings for third-party modules
│ │
│ ├──desktop.ts * electron window initialization
│ │
│ ├──index.html * application layout
│ │
│ ├──main.browser.ts * entry file for our browser environment
│ │
│ ├──package.json * electrons package.json
│ │
│ ├──polyfills.browser.ts * polyfills file
│ │
│ ├──vendor.browser.ts * vendors file
│ │
│ ├──app/ * application code - our working directory
│ ├──app/ * application code - our working directory
│ │ ├──pages/
│ │ │ ├──pages.menu.ts * menu pages routes
│ │ │
│ │ ├──app.component.ts * main application component
│ │ ├──app.component.ts * main application component
│ │ │
│ │ ├──app.module.ts * main application module
│ │ │
│ │ ├──app.menu.ts * menu pages routes
│ │ │
│ │ ├──app.module.ts * main application module
│ │ │
│ │ ├──app.routes.ts * application routes
│ │ ├──app.routing.ts * application routes
│ │ │
│ │ ├──app.translation.module.ts * main translation module
│ │ │
│ │ ├──global.state.ts * global application state for data exchange between components
│ │ ├──global.state.ts * global application state for data exchange between components
│ │ │
│ │ ├──environment.ts * environment provider
│ │ ├──environment.ts * environment provider
│ │ │
│ │ ├──app.scss * application styles
│ │ ├──app.component.scss * application styles
│ │ │
│ │ ├──pages/ * application pages components, place where you can create pages and fill them with components
│ │ ├──pages/ * application pages components, place where you can create pages and fill them with components
│ │ │
│ │ └──theme/ * template global components/directives/pipes and styles
│ │ └──theme/ * template global components/directives/pipes and styles
│ │
│ └──assets/ * static assets are served here
│ └──assets/ * static assets are served here
│
│
├──tslint.json * typescript lint config
├──typedoc.json * typescript documentation generator
├──tsconfig.json * config that webpack uses for typescript
└──package.json * what npm uses to manage it&#39;s dependencies
├──.angular-cli.json * Angular CLI config
│
├──Dockerfile * Docker config
│
├──karma.conf.js * config that karma use for unit tests
│
├──protractor.conf.js * config that protractor use for e2e tests
│
├──.angular-cli.json * Angular CLI config
│
├──.stylelintrc.json * SASS/CSS lint config
│
├──tslint.json * typescript lint config
│
├──typedoc.json * typescript documentation generator
│
├──tsconfig.json * config that webpack uses for typescript
│
└──package.json * what npm uses to manage it&#39;s dependencies
</code></pre><p>In our template we tried to separate the theme layer and presentation layer. We believe most of other templates
have them combined. That’s why when you start developing using them, it gets very hard for you to remove things you
don’t<span class="widont">&nbsp;</span>need.</p>
@ -118,8 +115,8 @@ don’t<span class="widont">&nbsp;</span>need.</p>
</div>
</section>
<footer class="wrap">
<div class="left">Powered by Angular 2, Bootstrap 4, Webpack and many more...</div>
<div class="right">© 2015–2016 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
<div class="left">Powered by Angular, Bootstrap 4, Angular CLI and many more...</div>
<div class="right">© 2017 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
</footer>
</div><a href="https://github.com/akveo/ng2-admin" title="Star &amp; Fork on GitHub" class="github-fork-ribbon"></a>
</body>

28
articles/013-create-new-page/index.html
View file

@ -50,28 +50,29 @@
</div>
<div class="inner-content">
<h1>Create New Page</h1>
<div class="subHeader"></div><p>ng2-admin uses <a href="https://angular.io/docs/ts/latest/guide/router.html">Angular 2 Component Router</a> for<span class="widont">&nbsp;</span>navigation.</p>
<div class="subHeader"></div><p>ng2-admin uses <a href="https://angular.io/docs/ts/latest/guide/router.html">Angular Component Router</a> for<span class="widont">&nbsp;</span>navigation.</p>
<p>We strongly recommend to follow this page structure in your application.
If it does not fit your needs please create a GitHub issue and tell us why. We would be glad to<span class="widont">&nbsp;</span>discuss. </p>
<p>Basically any page is just a common Angular 2 Component with a route defined for<span class="widont">&nbsp;</span>it.</p>
<p>Basically any page is just a common Angular Component with a route defined for<span class="widont">&nbsp;</span>it.</p>
<h2 id="let-s-create-a-blank-page-in-6-easy-steps">Let’s create a blank page in 6 easy<span class="widont">&nbsp;</span>steps</h2>
<p>1) Create a new directory for our new page inside of <code>src/app/pages</code>. We can call the directory <code>new</code>.
<br><br></p>
<p>2) Then let’s create a blank angular 2 component for our page called ‘new.component.ts’ inside of <code>src/app/pages/new</code>:</p>
<pre><code class="lang-javascript"><span class="keyword">import</span> {Component} <span class="keyword">from</span> <span class="string">'@angular/core'</span>;
<p>2) Then let’s create a blank angular component for our page called ‘new.component.ts’ inside of <code>src/app/pages/new</code>:</p>
<pre><code class="lang-javascript"><span class="keyword">import</span> { Component } <span class="keyword">from</span> <span class="string">'@angular/core'</span>;
@Component({
selector: <span class="string">'new'</span>,
template: <span class="string">`&lt;strong&gt;My page content here&lt;/strong&gt;`</span>
template: <span class="string">`&lt;strong&gt;My page content here&lt;/strong&gt;`</span>,
})
<span class="keyword">export</span> <span class="class"><span class="keyword">class</span> <span class="title">NewComponent</span> </span>{
constructor() {}
}
</code></pre>
<p>This will create a simple Angular 2 component. For more detail please check out <a href="https://angular.io/docs/ts/latest/guide/displaying-data.html">official Angular 2 documentation</a>.
<p>This will create a simple Angular component. For more detail please check out <a href="https://angular.io/docs/ts/latest/guide/displaying-data.html">official Angular documentation</a>.
<br><br></p>
<p>3) After that we should create our component routing called <code>new.routing.ts</code> in the <code>new</code> directory.</p>
<pre><code class="lang-javascript"><span class="keyword">import</span> { Routes, RouterModule } <span class="keyword">from</span> <span class="string">'@angular/router'</span>;
<pre><code class="lang-javascript"><span class="keyword">import</span> { Routes, RouterModule } <span class="keyword">from</span> <span class="string">'@angular/router'</span>;
<span class="keyword">import</span> { NewComponent } <span class="keyword">from</span> <span class="string">'./new.component'</span>;
<span class="keyword">const</span> routes: Routes = [
@ -87,12 +88,15 @@ If it does not fit your needs please create a GitHub issue and tell us why. We w
<p>4) And now we should create <code>new.module.ts</code> in <code>src/app/pages/new</code> directory and import <code>new.component.ts</code> and <code>new.routing.ts</code> in it.</p>
<pre><code class="lang-javascript"><span class="keyword">import</span> { NgModule } <span class="keyword">from</span> <span class="string">'@angular/core'</span>;
<span class="keyword">import</span> { CommonModule } <span class="keyword">from</span> <span class="string">'@angular/common'</span>;
<span class="keyword">import</span> { FormsModule } <span class="keyword">from</span> <span class="string">'@angular/forms'</span>;
<span class="keyword">import</span> { NewComponent } <span class="keyword">from</span> <span class="string">'./new.component'</span>;
<span class="keyword">import</span> { routing } <span class="keyword">from</span> <span class="string">'./new.routing'</span>;
@NgModule({
imports: [
CommonModule,
FormsModule,
routing
],
declarations: [
@ -148,22 +152,22 @@ you navigated to some child route - the item will be highlighted.
component: Pages,
children: [
{ path: <span class="string">''</span>, redirectTo: <span class="string">'dashboard'</span>, pathMatch: <span class="string">'full'</span> },
{ path: <span class="string">'dashboard'</span>, loadChildren: <span class="string">'app/pages/dashboard/dashboard.module#DashboardModule'</span> },
{ path: <span class="string">'new'</span>, loadChildren: <span class="string">'app/pages/new/new.module#NewModule'</span> }
{ path: <span class="string">'dashboard'</span>, loadChildren: <span class="string">'./dashboard/dashboard.module#DashboardModule'</span> },
{ path: <span class="string">'new'</span>, loadChildren: <span class="string">'./new/new.module#NewModule'</span> }
]
}
];
</code></pre>
<p><br></p>
<p>And that’s it! Now your page is available by the following this url <a href="http://localhost:3000/#/pages/new">http://localhost:3000/#/pages/new</a>.
<p>And that’s it! Now your page is available by the following this url <a href="http://localhost:4200/#/pages/new">http://localhost:4200/#/pages/new</a>.
Plus, your page is registered inside the sidebar menu. If you don’t want to have a link
in the menu - just remove the <code>menu</code> declaration from the <code>pages.menu.ts</code> file.</p>
</div>
</section>
<footer class="wrap">
<div class="left">Powered by Angular 2, Bootstrap 4, Webpack and many more...</div>
<div class="right">© 2015–2016 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
<div class="left">Powered by Angular, Bootstrap 4, Angular CLI and many more...</div>
<div class="right">© 2017 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
</footer>
</div><a href="https://github.com/akveo/ng2-admin" title="Star &amp; Fork on GitHub" class="github-fork-ribbon"></a>
</body>

6
articles/014-switch-to-blur-theme/index.html
View file

@ -107,7 +107,7 @@ To do so replace theme in <code>src/app/theme/sass/conf/conf.scss</code>:</p>
<p>to</p>
<pre><code class="lang-scss"><span class="at_rule">@<span class="keyword">import</span> <span class="string">'colorSchemes/blur'</span>;</span>
</code></pre>
<p>Additionaly, if you would like to use some different background, replace the following<span class="widont">&nbsp;</span>images:</p>
<p>Additionally, if you would like to use some different background, replace the following<span class="widont">&nbsp;</span>images:</p>
<ul>
<li><code>src/assets/img/blur-bg.jpg</code> (main background<span class="widont">&nbsp;</span>image)</li>
<li><code>src/assets/img/blur-bg-blurred.jpg</code> (blurred background image used on<span class="widont">&nbsp;</span>panels)</li>
@ -119,8 +119,8 @@ That’s it! You have successfully blurred your theme! Run <code>npm start</code
</div>
</section>
<footer class="wrap">
<div class="left">Powered by Angular 2, Bootstrap 4, Webpack and many more...</div>
<div class="right">© 2015–2016 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
<div class="left">Powered by Angular, Bootstrap 4, Angular CLI and many more...</div>
<div class="right">© 2017 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
</footer>
</div><a href="https://github.com/akveo/ng2-admin" title="Star &amp; Fork on GitHub" class="github-fork-ribbon"></a>
</body>

6
articles/015-sidebar/index.html
View file

@ -65,7 +65,7 @@ All menu items information is defined inside the <code>data</code> property of a
path: <span class="string">'dashboard'</span>,
component: Dashboard,
data: {
<span class="comment">// here additionaly we define how the menu item should look</span>
<span class="comment">// here additionally we define how the menu item should look</span>
menu: {
title: <span class="string">'Dashboard'</span>, <span class="comment">// menu title</span>
icon: <span class="string">'ion-android-home'</span>, <span class="comment">// menu icon</span>
@ -131,8 +131,8 @@ All menu items information is defined inside the <code>data</code> property of a
</div>
</section>
<footer class="wrap">
<div class="left">Powered by Angular 2, Bootstrap 4, Webpack and many more...</div>
<div class="right">© 2015–2016 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
<div class="left">Powered by Angular, Bootstrap 4, Angular CLI and many more...</div>
<div class="right">© 2017 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
</footer>
</div><a href="https://github.com/akveo/ng2-admin" title="Star &amp; Fork on GitHub" class="github-fork-ribbon"></a>
</body>

6
articles/016-spinner/index.html
View file

@ -52,7 +52,7 @@
<h1>Theme Spinner</h1>
<div class="subHeader"></div><p>Theme Spinner <code>BaThemeSpinner</code> is a small service helper allowing you to show a preloader spinner while
executing some long-running tasks.
This is the same spinner you can see after reloading a page - it is shown while the application is initializing Angular 2 and loading charts and<span class="widont">&nbsp;</span>images.</p>
This is the same spinner you can see after reloading a page - it is shown while the application is initializing Angular and loading charts and<span class="widont">&nbsp;</span>images.</p>
<p>The user interface in quite simple: there are two public methods: <code>show</code> and <code>hide</code>.</p>
<p>Theme Spinner comes with another small helper called <code>BaThemePreloader</code>.
This service is globally integrated into the application and connected to the<span class="widont">&nbsp;</span>spinner.</p>
@ -90,8 +90,8 @@ Say you have a long-running task on the Charts page (you need to receive some da
</div>
</section>
<footer class="wrap">
<div class="left">Powered by Angular 2, Bootstrap 4, Webpack and many more...</div>
<div class="right">© 2015–2016 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
<div class="left">Powered by Angular, Bootstrap 4, Angular CLI and many more...</div>
<div class="right">© 2017 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
</footer>
</div><a href="https://github.com/akveo/ng2-admin" title="Star &amp; Fork on GitHub" class="github-fork-ribbon"></a>
</body>

10
index.html
View file

@ -5,7 +5,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width">
<meta name="keywords" content="admin,dashboard,template,angular,bootstrap,blur,panel,html,css,javascript">
<title>Admin HTML template based on Angular 2, Bootstrap 4 and Webpack</title>
<title>Admin HTML template based on Angular, Bootstrap 4 and Angular CLI</title>
<link rel="alternate" href="http://localhost:8080/feed.xml" type="application/rss+xml" title="">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900italic,900|Anonymous+Pro:400,700,400italic,700italic&amp;subset=latin,greek,greek-ext,vietnamese,cyrillic-ext,latin-ext,cyrillic">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.0/gh-fork-ribbon.min.css">
@ -26,7 +26,7 @@
<div class="hero-content">
<div class="wrap">
<div class="text"><strong>ng2-<span class="white-text">admin</span></strong></div>
<div class="minitext">Angular 2 admin panel front-end framework</div>
<div class="minitext">Angular admin panel front-end framework</div>
<div class="buttons-unit"><a href="/ng2-admin/articles/002-installation-guidelines/" class="button">Installation guidelines</a><a href="/ng2-admin/articles/001-getting-started/" class="button">Documentation</a></div>
<div class="admin-screenshots">
<div class="admin-screenshot">
@ -42,7 +42,7 @@
<div class="why-items">
<div class="why-item"><img src="/ng2-admin/images/why-structure.svg">
<h4>Awesome structure</h4>
<p>Component-based structure is the best choice for large Angular 2 applications.</p>
<p>Component-based structure is the best choice for large Angular applications.</p>
</div>
<div class="why-item"><img src="/ng2-admin/images/why-design.svg">
<h4>Neat design</h4>
@ -80,8 +80,8 @@
</div>
</div>
<footer class="wrap">
<div class="left">Powered by Angular 2, Bootstrap 4, Webpack and many more...</div>
<div class="right">© 2015–2016 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
<div class="left">Powered by Angular, Bootstrap 4, Angular CLI and many more...</div>
<div class="right">© 2017 Akveo LLC<br />Documentation licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.</div>
</footer>
</div><a href="https://github.com/akveo/ng2-admin" title="Star &amp; Fork on GitHub" class="github-fork-ribbon"></a>
</body>