Material Design Admin Template & Landing HTML
Themeforest Material Design Admin Template & Landing HTML
Intro
Material is a Google Material Design inspired admin template built with Bootstrap and AngularJS. It uses Sass CSS which makes it easy to modify
Features
2 in 1, both admin template & landing page.
Google Material Design inspired admin/dashboard template.
Clean JS Code – simple and clean JavaScript code
Responsive Design – mobile-ready design adopt to any device
Web App – single page application with Bootstrap and AngularJSFully AJAX powered, never refresh the entire page again. Faster, smoother, cooler.
Powerful Layout – multiple layouts to choose from. Including Wide and Boxed layout, Vertical, Horizontal and Collapsed menu, toggle for fixed top header and sidebar menu.- Multiple Colors – 18 predefined color schemes and you can build your own by change a few variables.
Internationalization – internationalization (i18n) and Localization (l10n) support. Add English, Spanish, Portuguese, Japanese, Chinese, Russian for demo.
Nested routing with ui-router- Built with Sass – Easy modification with variables
Solid Workflow – solid workflow with Yeoman (GruntJS, Bower) just like Twitter Bootstrap project, make all things organized.- Use whatever back end you prefer, Python, Ruby, PHP, NodeJS… you name it. It takes no assumption on your backend language.
Bootstrap 3 – built with popular Bootstrap 3.x- Work with jQuery – yes, you can use your favorite jQuery
- Retina Ready – better display on high-resolution devices
- Realtime Validation – realtime form validation
- Tons of widgets and components.
- Valid HTML5 and CSS3
- Cross Browsers
- And much more.
Please rate it if you like it, thanks so much! And if you have any questions that are beyond the scope of the documentation, please feel free to contact me.
Credits
Bootstrap The most popular front-end framework for developing responsive, mobile first projects on the web.
jQuery Write less, do more.
AngularJS HTML enhanced for web Apps
angular-material Material design for Angular
angular-ui-router The de-facto solution to flexible routing with nested views in AngularJS
angular-bootstrap Native AngularJS (Angular) directives for Twitter’s Bootstrap.
angular-translate i18n in your Angular apps, made easy.
Yeoman, Twitter Bower, Grunt for modern web Apps.
Material Design Iconic Font Material Design Iconic Font and CSS toolkit
Font Awesome the awesome icon fonts.
flot Attractive JavaScript charts for jQuery- Google map
Changelog
Note: If you have any questions, please feel free to contact me, I’ll be glad to help!
VERSION 1.5.0 (01/06/2016)
- Feat: Upgrade angular-material to 1.0.x
- Feat: Upgrade angular-bootstrap to 0.14.x
- Feat: Upgrade Bower component to latest version, including font-awesome (4.5.x), angular-scroll (1.0.x), angular-ui-tree (2.13.x)
- Fix: Replace custom validateEquals with validation.match
- Fix: Replace ui-wave directive with angular-material md-button
- Style: Change header height from 50px to 64px
- Fix: Remove Google map sensor parameter as it's no longer required
- Chore: Remove jquery-spinner
VERSION 1.4.0 (10/09/2015)
- Feat: Upgrade Bower components to latest version, including angular (1.4.x), angular-material (0.11.x), fontawesome (4.4.x)...
- Feat: Upgrade NPM packages to latest version
- Chore: Clean up
VERSION 1.3.0 (05/10/2015)
- Feat: Upgrade plugins to latest version, including angular-material (0.9.x), angular-bootstrap (0.13.x), angular-translate (2.7.x), angular-ui-tree (2.4.x), angular-scroll (0.7.x), angular-chart.js (0.7.x)
- Fix: Fix Date picker of angular-bootstrap
- Style: Use dark text color for yellow background header, thanks @iwakeapp
- Chore: Chores
VERSION 1.2.0 (04/20/2015)
- Fix: Fix click event fire twice bug, Thanks @DIIT, @blabno
- Feat: Update plugins to latest version, including angular-translate (0.6.x), textAngular (1.3.x), angular-ui-tree (2.2.x), ngmap (1.7.x), ng-tags-input (2.3.x), angular-loading-bar (0.7.x), angular-chart.js (0.6.x)
VERSION 1.1.0 (03/15/2015)
- Feat: Add a landing page
- Fix(Firefox): Fix web fonts in sidebar overstriking bug.
- Docs: Update documentation
VERSION 1.0.0 (03/12/2015)
- Initial release
Hello. I’m having trouble getting a WYSIWYG editor to render properly inside of a wizard. The applicable plugins are textAngular and jquery-steps.
ReplyDeleteWhen the editor loads, it looks like the expected WYSIWYG editor, but none of the toolbar buttons work, and it’s overflowing the container for the wizard.
Here is the relevant code (simplified):
Some Title
I looked at the docs for textAngular and there’s a textAngularManager, but I get an unknown dependency error when attempting to inject that service in the steps directive, though I am able to access angular.module(‘textAngular’)?
Thanks!
Hi, thanks for purchasing.
ReplyDeleteThe wizard now (jQuery-step) is a bit primitive, sorry about it.
I am gonna update it in the next update coming this month
It’s a nice plugin, it just apparently doesn’t work well with Angular. FYI – angular’s model binding doesn’t seem to work inside of the steps plugin either. I’ve yet to find a good alternative aside from rolling your own, which I may need to do anyways for my use case. Anyways, thanks for the theme! Super well organized and easy to work with!
ReplyDeleteHi, thanks for your warm words, really appreciate it
ReplyDeleteI probably gonna use [angular-wizard](https://github.com/mgonto/angular-wizard) to replace it.
Hope this helps
Looks nice! I’m currently playing around with https://github.com/troch/angular-multi-step-form
ReplyDeleteIt’s not as feature rich as the one you’re looking at, but it works pretty well. Thanks again, keep up the great work!
Cool, I’ll take a look at it as well.
ReplyDeleteThanks for telling me this, really appreciate it
Hi, thanks for providing the error message.
ReplyDeleteHowever it doesn’t format well in ThemeForest comment box, can you email me through [my profile page](http://themeforest.net/user/arousing) ?
Thanks!
please see(http://themeforest.net/collections/5803142-errors)
ReplyDeleteHi, sorry for the late reply.
ReplyDeleteCan you email me through [my profile page](http://themeforest.net/user/arousing) ?
I open the page link you sent me, it says “This collection is empty”
can I talk with chat?my chat is 360kele,Thanks
ReplyDeleteHi, better if you can email me, hope you understand.
ReplyDeletewhat’s your email?
ReplyDeleteHi, thanks for keeping in touch.
ReplyDeleteYou can email me through my profile page: http://themeforest.net/user/arousing
The email box is at lower right corner
Hi, I see there are images for languages. How can I easily change the american flag used for english into a british/uk flag?
ReplyDeleteHi, thanks for purchasing.
ReplyDeletematerial/client/styles/ui/images/flags.png is the file for image CSS sprites, and material/client/styles/ui/components/_sprites.scss contains the css code for image positioning.
Basically, you need to build your own image sprites and replace the old one.
Of course, you can use separate image files if you like. If you don’t have much languages to support, let’s say, only two, I think separate ones might be better.
Hope this helps
Hi, thanks thats better, I will do that. I only need 2 for the moment: English and German
ReplyDeleteHi, if you don’t want to change the flag image, you just remove the ones you don’t want in HTML, no need to change CSS.
ReplyDeleteHowever, if you do want to change flag images, you can download the flag images here: http://www.softicons.com/web-icons/flags-flat-icons-by-gosquared
and you need to update corresponding CSS code.
Hope this helps
Hello Arousing team, when are you guys updating this template to Angular 2. Once that is done then we will buy. Cheers
ReplyDeleteHi, thanks for your interest.
ReplyDeleteIt’s done and have been uploaded for review now.
If things go well, it should be available in a week (Depends on the review time of ThemeForest team, usually, in a week)
Cheers
Hello, can you tell me the new version release plan what time?
ReplyDelete