Your Theme is simple and beautiful. The best Angular 2 theme I saw so far. Keep up the good work
I'm glad you like our template. We do our best.
Angular2 Full CLI Project
It is SmartResizeDirective. You will finf code here: src/app/shared/smart-resize.directive.ts
elihayun PURCHASED
I have few questions:
1) How do I remove the left side panel?
2) How do I put it on the right side?

elihayun PURCHASED
I have removed it with off-canvas.
The problem is that whan the screen is small it will not show up again when clicking on the display button. I think it is a bug.

Thank you for your comment.

I will check it and remove in next release.

elihayun PURCHASED
Thanks. Is there a way to see the sidebar on the right side instead of left side?
Template looks great, can you please add form validation page also with Angular2. Also can you please add a form with form error messages in error color(red).
I'm glad you like my admin template. I will add form validation in future releases.
Are you planning to add bootstrap Modal samples in near future?
Ok. I will do this.
Hello, wondering if someone can be of assistance. I am using Bootstrap 4 and Angular 2 on the Meteor 1.4 platform

I've pulled the scss folder into my project and meteor compile is complaining about the vendor scss references to variables.

Does someone have a suggestion to resolve?

While processing files with angular2-compilers (for target web.browser):
/client/scss/vendors/angular2-calendar/angular2-calendar.scss: Scss compiler error: Undefined variable:

/client/scss/vendors/angular2-calendar/day-view.scss: Scss compiler error: Undefined variable:

/client/scss/vendors/angular2-calendar/month-view.scss: Scss compiler error: Undefined variable:

/client/scss/vendors/angular2-calendar/week-view.scss: Scss compiler error: Undefined variable:

/client/scss/vendors/chart.js/chart.scss: Scss compiler error: no mixin named border-radius


/client/scss/vendors/daterangepicker/daterangepicker.scss: Scss compiler error: no mixin named


/client/scss/vendors/fullcalendar/fullcalendar.scss: Scss compiler error: Undefined variable:

/client/scss/vendors/gauge.js/gaugejs.scss: Scss compiler error: Undefined variable: "$text-muted".

/client/scss/vendors/ionRangeSlider/ionRangeSlider.scss: Scss compiler error: Undefined variable:

/client/scss/vendors/toastr/toastr.scss: Scss compiler error: no mixin named border-radius

You should add import section to this files and then import following scss files

@import "bootstrap-variables";
@import "custom-variables";
@import "bootstrap_src/mixins";
@import "core/mixins";
I added this to angular2-calendar.scss

@import "{}/client/scss/bootstrap-variables";
@import "{}/client/scss/custom-variables";
@import "{}/client/scss/bootstrap_src/mixins";
@import "{}/client/scss/core/mixins";

The same errors still return
simon1231 PURCHASED
Does the price include any PSD's or instructions. I've been through the live demo, looks impressive.
We don't offer any PSD files, but you will find documentation in repository.

Hey Lukasz, great work on the theme.

What would be a realistic estimation for the full Vue version of the theme?

Hi, Vue.js version should be ready at the end of next month.
I bought the template Clever Bootstrap 4 Admin + Angular 2, I am using angular 2, it works wonderfully I have problem with a question that is the following: how to call and pass data from one component to another, I am trying to call as follows and not it works.

<div class="card-block">
<blockquote class="card-blockquote">
<a [routerLink]="['/components/frase-detalle/', frase.id ]" class="btn btn-info">Ver Frase</a>
<a href="#" class="btn btn-success">Editar</a>
<a href="#" class="btn btn-danger">Eliminar</a>

I'm trying to call the sentence-detail component / and step as data frase.id

But it does not work which is the correct way to call

thank you
Excellent theme and really well set out.

Thank you very much.
I have ported this theme over to Meteor 1.4. I have been finding occasional issues. My latest issue is the dynamic setting style min-height.

<body class="navbar-fixed sidebar-nav" style="min-height: 2203px;"

Can someone tell me what sets this style?

Which version of Clever are you using?

Angular 2 Full CLI
Disregard, it was a rendering issue in the <main class="main"> section.
It is working now.
Thank you for your message.

your theme is impressive, I really like it,
I have a question before buying this theme
1. Is there any profile page?
2. I am trying to print the invoice, but it seems, it is not print friendly, is there any fix in the next release?
3. Is there any feed timeline page?

Thank you
I meet a problem. I use the project "Angular2_CLI_Full_Projecj", when I use the develop tool in Chrome to debug the website with mobile mode , the sidebar-toggler does not work, the menus can't be shown, and the switch of the sidebar-toggler shows "?" not "δΈ‰".

but it's ok in the live demo. is there any files mistake ?

theme version is 2.2.0.
Hi Lukasz,

I have bought your theme, may I know how to install it? since the youtube video say its a playback error,
what I did
1. npm install,
2. npm install [email protected]
3. npm install @angular/[email protected]
4. npm install @angular/[email protected]
5. ng-serve

When I run it, it shows several errors, like

57% building modules 398/431 modules 33 active ...ect/node_modules/debug/src/browser.jsError: No module factory available for dependency type: ContextElementDependency
at Compilation.addModuleDependencies (/Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:190:20)
at Compilation.processModuleDependencies (/Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:179:7)
at /Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:319:12
at /Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:126:4
at Array.forEach (native)
at callback (/Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:125:12)
at /Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:149:10
at ContextModule.<anonymous> (/Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/angular-cli/node_modules/webpack/lib/ContextModule.js:118:3)
at /Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/@ngtools/webpack/src/utils.js:11:13
at /Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/@ngtools/webpack/src/plugin.js:196:124
at ContextModule.resolveDependencies (/Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/@ngtools/webpack/src/utils.js:5:9)
at ContextModule.build (/Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/angular-cli/node_modules/webpack/lib/ContextModule.js:99:7)
at Compilation.buildModule (/Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:129:9)
at factoryCallback (/Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/angular-cli/node_modules/webpack/lib/Compilation.js:308:10)
at /Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/angular-cli/node_modules/webpack/lib/ContextModuleFactory.js:96:12
at /Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/tapable/lib/Tapable.js:204:11
at /Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/@ngtools/webpack/src/plugin.js:197:28
at tryCatch (/Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/es6-promise/dist/es6-promise.js:410:12)
at invokeCallback (/Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/es6-promise/dist/es6-promise.js:425:13)
at /Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/es6-promise/dist/es6-promise.js:172:16
at flush (/Users/macbook/Documents/test/ADMIN/Clever4_Angular/Clever 2.2.1 Bootstrap 4/Angular2_CLI_Full_Project/node_modules/es6-promise/dist/es6-promise.js:121:5)
at doNTCallback0 (node.js:419:9)
at process._tickCallback (node.js:348:13)
70% building modules 733/733 modules 0 active

Best Regards
All you need to do is:
1. $ npm install
2. $ ng serve

Don't install following dependencies:
1. npm install [email protected]
2. npm install @angular/[email protected]
3. npm install @angular/[email protected]
Thank you it is working,

also may I ask how to make the invoice printable? since it is showing a paper header, and paper footer, and showing sticky header?

Best Regards
elciomgdf PURCHASED
Hi, first, this theme is great, congratulations! I have a problem with ng2-select. It's doesn't work anymore, look at your example. How can I fix it? Those options does not appear
Hi, thank you for your comment. I will check what is wrong.
Hi Lukasz,
You've done amazing work with this theme!
There is small problem with ng2-select on clever angular2 setup. It doesn't show options to user.
How can i get around this problem?

Thank you!

Hi Milos,

Thank you for your message. We're working on this issue. We will fix it in next release. It should be ready at the end of this week.

Hi, just bought the theme
I did npm install but when i run ng serve
i get

throw new Error("Cannot find module '" + x + "' from '" + y + "'");

Error: Cannot find module 'ng-factory' from 'C:\Users\giorgos\Documents\_Code\Admin_starter\Angular2_CLI_Full_Project'
at Function.module.exports [as sync] (C:\Users\giorgos\AppData\Roaming\npm\node_modules\ng-cli\node_modules\resolve\lib\sync.js:36:11)
at module.exports (C:\Users\giorgos\AppData\Roaming\npm\node_modules\ng-cli\node_modules\resolve-require\lib\index.js:10:24)
at Command.<anonymous> (C:\Users\giorgos\AppData\Roaming\npm\node_modules\ng-cli\lib\index.js:49:5)
at Command.listener (C:\Users\giorgos\AppData\Roaming\npm\node_modules\ng-cli\node_modules\commander\index.js:301:8)
at emitTwo (events.js:106:13)
at Command.emit (events.js:191:7)
at Command.parseArgs (C:\Users\giorgos\AppData\Roaming\npm\node_modules\ng-cli\node_modules\commander\index.js:615:12)
at Command.parse (C:\Users\giorgos\AppData\Roaming\npm\node_modules\ng-cli\node_modules\commander\index.js:458:21)
at Object.<anonymous> (C:\Users\giorgos\AppData\Roaming\npm\node_modules\ng-cli\lib\index.js:55:9)
at Module._compile (module.js:570:32)
Hi, which version of node and npm are you using?
node v6.9.4
npm 4.2.0
finally worked by running npm start... very weird, ng serve still doesn't work
Can you check you ng --version ?

Write a comment

This is a great way to give the seller feedback and ask them questions about their item.

You must sign in to write a comment

Sign in or sign up to make a purchase


Licenses: Details »

Single application $98
  • HTML Template
Bootstrap: Compatible with 4.x
  • Responsive
  • Fluid
  • Fixed-width
  • IE 10, 11
  • Latest Chrome
  • Latest Edge
  • Latest Firefox
  • Latest Safari
Uses Less:Yes
Uses Sass:Yes
Topic: General
Labels: admin, angular, angular 5, angularjs, bootstrap 4, dashboard, inspinia, react, smartadmin, vue
Released:4 years ago
Updated:8 months ago
Sold exclusively on WrapBootstrap


Signed up 5 years ago

Need a front-end template?

About Bootstrap

Bootstrap is designed to help people of all skill levels – designer or developer, huge nerd or early beginner. Use it as a complete kit or use it to start something more complex.

Unlike other front-end toolkits, Bootstrap was designed first and foremost as a styleguide to document not only its features, but best practices and living, coded examples.

Built to support new HTML5 elements and syntax with progressively enhanced components.

Browser support

Bootstrap is tested and supported in major modern browsers like Chrome, Firefox, and Internet Explorer.

Tested and supported in Chrome, Safari, Firefox, Internet Explorer, and Opera.
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
  • Latest Edge
  • Internet Explorer 10/11
  • Latest Opera

Features & includes

Bootstrap provides an unparalleled array of features and reusable components that let you hit the ground running:

  • Responsive 12-column grid
  • 12 custom, modular jQuery plugins
  • CSS styles for forms, navigation & more
  • Dozens of reusable components
  • Components are scaled according to a range of resolutions and devices
  • Built with Sass (CSS included)
  • Complete styleguide documentation