Git Product home page Git Product logo

angular-pro-sidebar's Introduction

Angular Pro Sidebar

A responsive sidebar template with dropdown menu built with angular 7 and bootstrap 4

This project was generated with Angular CLI version 7.1.2.

Demo

Live preview

Screenshot

sidebar

Quick start

npm install 

ng serve

Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Resources

License

This code is released under the MIT license.

angular-pro-sidebar's People

Contributors

azouaoui-med avatar

Stargazers

avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar

Watchers

avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar

Forkers

katson95 mmmika nwservices igakigongo raihanm95 webbello gaoqingaoping beaend hariprasanth09 mihirukongahage snoopy4ever aloysmose hasimyigit phuongnhi123 avmaisak shady1910 ddleblanc matiasquevedo elaiyarasan-ideas ajitsinghit2 pks-os wallacerodrigon zano5 sximoinc sweng29 marcosguilhermef skoditu rahulmeshram hellhoundcats sanskarsakya prashant13a anibalmorales sophanetyut bhanu49 milanfeind ugur0855 ducka23 sridevgit riciolle lopes-leandro soufien1 ezgibalikci roshanlakmal frivas0708 sebamella nxviyx trps-agra mohammedennekhli salmondev pabonlieu45 alfxp thiagoroc seido2411 brimos mirkitogonzalez bouthaynadhifaoui olfaarous ocnerf saber13812002 kazu2012 blackyout walidum gitdealdo daynizyvc wildosk eestevez addino cattamoru luiggiegn shubham-kumar10 mjavadtatari mohamedassem96 mrjelveh shrikantwinjit nready-rnd hamzacd nguyenviethien arunkumar-n albert-ihits tarabogart13 nerosoft lcsouzamenezes hypephilosophy edpelaezc maryum778 cyberdudej neyron1002 jdefreites lucianocorreia syedmdkamruzzaman vergilskye kartech06 sanathpathiraja belalatallah rademanfrik 69inquisidor minhnq1618 fljv77 irtyamine benjadir

angular-pro-sidebar's Issues

found an issue when run script 'ng serve'

ERROR in ./src/styles.scss (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss)
Module build failed (from ./node_modules/sass-loader/lib/loader.js):
Error: Cannot find module 'node-sass'
Require stack:

  • H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\loadLoader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\LoaderRunner.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModule.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModuleFactory.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\Compiler.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\webpack.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\webpack\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-angular\src\dev-server\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\architect.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\architect-command.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\commands\build-impl.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\export-ref.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\utilities\json-schema.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\command-runner.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\lib\cli\index.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\lib\init.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\bin\ng
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17)
    at Function.Module._load (internal/modules/cjs/loader.js:686:27)
    at Module.require (internal/modules/cjs/loader.js:848:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object.sassLoader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js:46:72)
    ERROR in ./src/app/app.component.scss
    Module build failed (from ./node_modules/sass-loader/lib/loader.js):
    Error: Cannot find module 'node-sass'
    Require stack:
  • H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\loadLoader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\LoaderRunner.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModule.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModuleFactory.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\Compiler.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\webpack.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\webpack\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-angular\src\dev-server\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\architect.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\architect-command.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\commands\build-impl.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\export-ref.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\utilities\json-schema.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\command-runner.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\lib\cli\index.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\lib\init.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\bin\ng
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17)
    at Function.Module._load (internal/modules/cjs/loader.js:686:27)
    at Module.require (internal/modules/cjs/loader.js:848:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object.sassLoader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js:46:72)
    ERROR in ./src/app/sidebar/sidebar.component.scss
    Module build failed (from ./node_modules/sass-loader/lib/loader.js):
    Error: Cannot find module 'node-sass'
    Require stack:
  • H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\loadLoader.js
  • H:\Github\angular-pro-sidebar\node_modules\loader-runner\lib\LoaderRunner.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModule.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\NormalModuleFactory.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\Compiler.js
  • H:\Github\angular-pro-sidebar\node_modules\webpack\lib\webpack.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\webpack\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-webpack\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\build-angular\src\dev-server\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\architect.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\architect\src\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\architect-command.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\commands\build-impl.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\export-ref.js
  • H:\Github\angular-pro-sidebar\node_modules@angular-devkit\schematics\tools\index.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\utilities\json-schema.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\models\command-runner.js
  • H:\Github\angular-pro-sidebar\node_modules@angular\cli\lib\cli\index.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\lib\init.js
  • C:\Users\Leo\AppData\Roaming\npm\node_modules@angular\cli\bin\ng
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17)
    at Function.Module._load (internal/modules/cjs/loader.js:686:27)
    at Module.require (internal/modules/cjs/loader.js:848:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object.sassLoader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\lib\loader.js:46:72)

and then I run 'npm install sass-loader node-sass webpack --save-dev'๏ผŒ it showed:
ERROR in ./src/styles.scss (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./node_modules/sass-loader/dist/cjs.js??ref--14-3!./src/styles.scss)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
ValidationError: Invalid options object. Sass Loader has been initialized using an options object that does not match the API schema.

  • options has an unknown property 'includePaths'. These properties are valid:
    object { implementation?, sassOptions?, prependData?, sourceMap?, webpackImporter? }
    at validate (H:\Github\angular-pro-sidebar\node_modules\sass-loader\node_modules\schema-utils\dist\validate.js:85:11)
    at Object.loader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\dist\index.js:36:28)
    ERROR in ./src/app/app.component.scss
    Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
    ValidationError: Invalid options object. Sass Loader has been initialized using an options object that does not match the API schema.
  • options has an unknown property 'includePaths'. These properties are valid:
    object { implementation?, sassOptions?, prependData?, sourceMap?, webpackImporter? }
    at validate (H:\Github\angular-pro-sidebar\node_modules\sass-loader\node_modules\schema-utils\dist\validate.js:85:11)
    at Object.loader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\dist\index.js:36:28)
    ERROR in ./src/app/sidebar/sidebar.component.scss
    Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
    ValidationError: Invalid options object. Sass Loader has been initialized using an options object that does not match the API schema.
  • options has an unknown property 'includePaths'. These properties are valid:
    object { implementation?, sassOptions?, prependData?, sourceMap?, webpackImporter? }
    at validate (H:\Github\angular-pro-sidebar\node_modules\sass-loader\node_modules\schema-utils\dist\validate.js:85:11)
    at Object.loader (H:\Github\angular-pro-sidebar\node_modules\sass-loader\dist\index.js:36:28)

Could you please help me out with this ?

Multi-level dropdown

Hi,
Nice template.
Is it possible to add multi-level dropdown to the template?
Thanks

Html dist package ?

This is the best sidebar I've found. Do you have an HTML version? Can you provide a package like dist? Thank you for your efforts!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.