├── .editorconfig ├── .gitignore ├── README.md ├── angular.json ├── azure-pipelines.yml ├── browserslist ├── e2e ├── protractor.conf.js ├── src │ ├── app.e2e-spec.ts │ └── app.po.ts └── tsconfig.json ├── karma.conf.js ├── package-lock.json ├── package.json ├── src ├── app │ ├── app-routing.module.ts │ ├── app.component.html │ ├── app.component.scss │ ├── app.component.spec.ts │ ├── app.component.ts │ ├── app.module.ts │ ├── core │ │ └── core.module.ts │ ├── shared │ │ └── shared.module.ts │ └── starter │ │ ├── starter-routing.module.ts │ │ ├── starter.module.ts │ │ └── starter │ │ ├── content │ │ ├── content.component.html │ │ ├── content.component.scss │ │ ├── content.component.spec.ts │ │ └── content.component.ts │ │ ├── control-side-bar │ │ ├── control-side-bar.component.html │ │ ├── control-side-bar.component.scss │ │ ├── control-side-bar.component.spec.ts │ │ └── control-side-bar.component.ts │ │ ├── footer │ │ ├── footer.component.html │ │ ├── footer.component.scss │ │ ├── footer.component.spec.ts │ │ └── footer.component.ts │ │ ├── main-side-bar │ │ ├── main-side-bar.component.html │ │ ├── main-side-bar.component.scss │ │ ├── main-side-bar.component.spec.ts │ │ └── main-side-bar.component.ts │ │ ├── nav-bar │ │ ├── nav-bar.component.html │ │ ├── nav-bar.component.scss │ │ ├── nav-bar.component.spec.ts │ │ └── nav-bar.component.ts │ │ ├── starter.component.html │ │ ├── starter.component.scss │ │ ├── starter.component.spec.ts │ │ └── starter.component.ts ├── assets │ ├── .gitkeep │ └── img │ │ ├── AdminLTELogo.png │ │ ├── avatar.png │ │ ├── avatar04.png │ │ ├── avatar2.png │ │ ├── avatar3.png │ │ ├── avatar5.png │ │ ├── boxed-bg.jpg │ │ ├── boxed-bg.png │ │ ├── credit │ │ ├── american-express.png │ │ ├── cirrus.png │ │ ├── mastercard.png │ │ ├── mestro.png │ │ ├── paypal.png │ │ ├── paypal2.png │ │ └── visa.png │ │ ├── default-150x150.png │ │ ├── icons.png │ │ ├── photo1.png │ │ ├── photo2.png │ │ ├── photo3.jpg │ │ ├── photo4.jpg │ │ ├── prod-1.jpg │ │ ├── prod-2.jpg │ │ ├── prod-3.jpg │ │ ├── prod-4.jpg │ │ ├── prod-5.jpg │ │ ├── user1-128x128.jpg │ │ ├── user2-160x160.jpg │ │ ├── user3-128x128.jpg │ │ ├── user4-128x128.jpg │ │ ├── user5-128x128.jpg │ │ ├── user6-128x128.jpg │ │ ├── user7-128x128.jpg │ │ └── user8-128x128.jpg ├── environments │ ├── environment.prod.ts │ └── environment.ts ├── favicon.ico ├── index.html ├── main.ts ├── polyfills.ts ├── styles.scss ├── styles │ ├── bootstrap-functions.scss │ ├── bootstrap-variables.scss │ └── variables.scss └── test.ts ├── tsconfig.app.json ├── tsconfig.json ├── tsconfig.spec.json └── tslint.json /.editorconfig: -------------------------------------------------------------------------------- 1 | # Editor configuration, see https://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | charset = utf-8 6 | indent_style = space 7 | indent_size = 2 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | max_line_length = off 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See http://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # compiled output 4 | /dist 5 | /tmp 6 | /out-tsc 7 | # Only exists if Bazel was run 8 | /bazel-out 9 | 10 | # dependencies 11 | /node_modules 12 | 13 | # profiling files 14 | chrome-profiler-events*.json 15 | speed-measure-plugin*.json 16 | 17 | # IDEs and editors 18 | /.idea 19 | .project 20 | .classpath 21 | .c9/ 22 | *.launch 23 | .settings/ 24 | *.sublime-workspace 25 | 26 | # IDE - VSCode 27 | .vscode/* 28 | !.vscode/settings.json 29 | !.vscode/tasks.json 30 | !.vscode/launch.json 31 | !.vscode/extensions.json 32 | .history/* 33 | 34 | # misc 35 | /.sass-cache 36 | /connect.lock 37 | /coverage 38 | /libpeerconnection.log 39 | npm-debug.log 40 | yarn-error.log 41 | testem.log 42 | /typings 43 | 44 | # System Files 45 | .DS_Store 46 | Thumbs.db 47 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Introduction 2 | ============ 3 | 4 | This is the **Angular** version of **AdminLTE** -- what is a fully responsive administration template. Based on **[Bootstrap 4](https://getbootstrap.com)** framework. 5 | Highly customizable and easy to use. Fits many screen resolutions from small mobile devices to large desktops. 6 | 7 | **Preview on [AdminLTE.io](https://adminlte.io/themes/v3)** 8 | 9 | Installation 10 | ------------ 11 | 12 | - Fork the repository ([here is the guide](https://help.github.com/articles/fork-a-repo/)). 13 | - Clone to your machine 14 | - Install Angular Cli. 15 | ```bash 16 | npm install -g @angular/cli 17 | ``` 18 | - Clone the repository 19 | ```bash 20 | git clone https://github.com/YOUR_USERNAME/angularAdminLTE.git 21 | ``` 22 | 23 | - Install the packages 24 | ```bash 25 | cd angularAdminLTE 26 | npm install 27 | ``` 28 | 29 | Running the application 30 | ------------ 31 | - On the folder project 32 | ``` 33 | ng serve -o 34 | ``` 35 | - For starter page Navigate to [http://localhost:4200/](http://localhost:4200/) 36 | - For admin page Navigate to [http://localhost:4200/admin](http://localhost:4200/admin) 37 | 38 | Browser Support 39 | --------------- 40 | - Firefox (latest) 41 | - Chrome (latest) 42 | - Safari (latest) 43 | - Opera (latest) 44 | - No IE support 45 | 46 | Contribution 47 | ------------ 48 | Contribution are always **welcome and recommended**! Here is how: 49 | 50 | - Fork the repository ([here is the guide](https://help.github.com/articles/fork-a-repo/)). 51 | - Clone to your machine ```git clone https://github.com/YOUR_USERNAME/angularAdminLTE.git``` 52 | - Make your changes 53 | - Create a pull request 54 | 55 | #### Contribution Requirements: 56 | - Contributions are only accepted through Github pull requests. 57 | - Finally, contributed code must work in all supported browsers (see above for browser support). 58 | 59 | License 60 | ------- 61 | angularAdminLTE is an open source project by that is licensed under [MIT](http://opensource.org/licenses/MIT). 62 | 63 | Credits 64 | ------------- 65 | [AdminLTE.IO](https://adminlte.io/) 66 | -------------------------------------------------------------------------------- /angular.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "./node_modules/@angular/cli/lib/config/schema.json", 3 | "version": 1, 4 | "newProjectRoot": "projects", 5 | "projects": { 6 | "angularAdminLTE": { 7 | "projectType": "application", 8 | "schematics": { 9 | "@schematics/angular:component": { 10 | "style": "scss" 11 | } 12 | }, 13 | "root": "", 14 | "sourceRoot": "src", 15 | "prefix": "app", 16 | "architect": { 17 | "build": { 18 | "builder": "@angular-devkit/build-angular:browser", 19 | "options": { 20 | "outputPath": "dist/angularAdminLTE", 21 | "index": "src/index.html", 22 | "main": "src/main.ts", 23 | "polyfills": "src/polyfills.ts", 24 | "tsConfig": "tsconfig.app.json", 25 | "aot": true, 26 | "assets": [ 27 | "src/favicon.ico", 28 | "src/assets" 29 | ], 30 | "stylePreprocessorOptions": { 31 | "includePaths": [ 32 | "src/styles" 33 | ] 34 | }, 35 | "styles": [ 36 | "src/styles.scss" 37 | ], 38 | "scripts": [ 39 | "node_modules/jquery/dist/jquery.js", 40 | "node_modules/bootstrap/dist/js/bootstrap.bundle.js", 41 | "node_modules/admin-lte/dist/js/adminlte.js" 42 | ] 43 | }, 44 | "configurations": { 45 | "production": { 46 | "fileReplacements": [ 47 | { 48 | "replace": "src/environments/environment.ts", 49 | "with": "src/environments/environment.prod.ts" 50 | } 51 | ], 52 | "optimization": true, 53 | "outputHashing": "all", 54 | "sourceMap": false, 55 | "extractCss": true, 56 | "namedChunks": false, 57 | "extractLicenses": true, 58 | "vendorChunk": false, 59 | "buildOptimizer": true, 60 | "budgets": [ 61 | { 62 | "type": "initial", 63 | "maximumWarning": "2mb", 64 | "maximumError": "5mb" 65 | }, 66 | { 67 | "type": "anyComponentStyle", 68 | "maximumWarning": "6kb", 69 | "maximumError": "10kb" 70 | } 71 | ] 72 | } 73 | } 74 | }, 75 | "serve": { 76 | "builder": "@angular-devkit/build-angular:dev-server", 77 | "options": { 78 | "browserTarget": "angularAdminLTE:build" 79 | }, 80 | "configurations": { 81 | "production": { 82 | "browserTarget": "angularAdminLTE:build:production" 83 | } 84 | } 85 | }, 86 | "extract-i18n": { 87 | "builder": "@angular-devkit/build-angular:extract-i18n", 88 | "options": { 89 | "browserTarget": "angularAdminLTE:build" 90 | } 91 | }, 92 | "test": { 93 | "builder": "@angular-devkit/build-angular:karma", 94 | "options": { 95 | "main": "src/test.ts", 96 | "polyfills": "src/polyfills.ts", 97 | "tsConfig": "tsconfig.spec.json", 98 | "karmaConfig": "karma.conf.js", 99 | "assets": [ 100 | "src/favicon.ico", 101 | "src/assets" 102 | ], 103 | "styles": [ 104 | "src/styles.scss" 105 | ], 106 | "scripts": [] 107 | } 108 | }, 109 | "lint": { 110 | "builder": "@angular-devkit/build-angular:tslint", 111 | "options": { 112 | "tsConfig": [ 113 | "tsconfig.app.json", 114 | "tsconfig.spec.json", 115 | "e2e/tsconfig.json" 116 | ], 117 | "exclude": [ 118 | "**/node_modules/**" 119 | ] 120 | } 121 | }, 122 | "e2e": { 123 | "builder": "@angular-devkit/build-angular:protractor", 124 | "options": { 125 | "protractorConfig": "e2e/protractor.conf.js", 126 | "devServerTarget": "angularAdminLTE:serve" 127 | }, 128 | "configurations": { 129 | "production": { 130 | "devServerTarget": "angularAdminLTE:serve:production" 131 | } 132 | } 133 | } 134 | } 135 | } 136 | }, 137 | "defaultProject": "angularAdminLTE" 138 | } 139 | -------------------------------------------------------------------------------- /azure-pipelines.yml: -------------------------------------------------------------------------------- 1 | # Node.js with Angular 2 | # Build a Node.js project that uses Angular. 3 | # Add steps that analyze code, save build artifacts, deploy, and more: 4 | # https://docs.microsoft.com/azure/devops/pipelines/languages/javascript 5 | 6 | trigger: 7 | - master 8 | 9 | pool: 10 | vmImage: 'ubuntu-latest' 11 | 12 | steps: 13 | - task: NodeTool@0 14 | inputs: 15 | versionSpec: '10.x' 16 | displayName: 'Install Node.js' 17 | 18 | - script: | 19 | npm install -g @angular/cli 20 | npm install 21 | ng build --prod 22 | displayName: 'npm install and build' 23 | -------------------------------------------------------------------------------- /browserslist: -------------------------------------------------------------------------------- 1 | # This file is used by the build system to adjust CSS and JS output to support the specified browsers below. 2 | # For additional information regarding the format and rule options, please see: 3 | # https://github.com/browserslist/browserslist#queries 4 | 5 | # You can see what browsers were selected by your queries by running: 6 | # npx browserslist 7 | 8 | > 0.5% 9 | last 2 versions 10 | Firefox ESR 11 | not dead 12 | not IE 9-11 # For IE 9-11 support, remove 'not'. -------------------------------------------------------------------------------- /e2e/protractor.conf.js: -------------------------------------------------------------------------------- 1 | // @ts-check 2 | // Protractor configuration file, see link for more information 3 | // https://github.com/angular/protractor/blob/master/lib/config.ts 4 | 5 | const { SpecReporter } = require('jasmine-spec-reporter'); 6 | 7 | /** 8 | * @type { import("protractor").Config } 9 | */ 10 | exports.config = { 11 | allScriptsTimeout: 11000, 12 | specs: [ 13 | './src/**/*.e2e-spec.ts' 14 | ], 15 | capabilities: { 16 | browserName: 'chrome' 17 | }, 18 | directConnect: true, 19 | baseUrl: 'http://localhost:4200/', 20 | framework: 'jasmine', 21 | jasmineNodeOpts: { 22 | showColors: true, 23 | defaultTimeoutInterval: 30000, 24 | print: function() {} 25 | }, 26 | onPrepare() { 27 | require('ts-node').register({ 28 | project: require('path').join(__dirname, './tsconfig.json') 29 | }); 30 | jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); 31 | } 32 | }; -------------------------------------------------------------------------------- /e2e/src/app.e2e-spec.ts: -------------------------------------------------------------------------------- 1 | import { AppPage } from './app.po'; 2 | import { browser, logging } from 'protractor'; 3 | 4 | describe('workspace-project App', () => { 5 | let page: AppPage; 6 | 7 | beforeEach(() => { 8 | page = new AppPage(); 9 | }); 10 | 11 | it('should display navigation title', () => { 12 | page.navigateTo(); 13 | expect(page.getNavTitleText()).toEqual('AdminLTE 3'); 14 | }); 15 | 16 | it('should display content title', () => { 17 | page.navigateTo(); 18 | expect(page.getContentTitleText()).toEqual('Starter Page'); 19 | }); 20 | 21 | afterEach(async () => { 22 | // Assert that there are no errors emitted from the browser 23 | const logs = await browser.manage().logs().get(logging.Type.BROWSER); 24 | expect(logs).not.toContain(jasmine.objectContaining({ 25 | level: logging.Level.SEVERE, 26 | } as logging.Entry)); 27 | }); 28 | }); 29 | -------------------------------------------------------------------------------- /e2e/src/app.po.ts: -------------------------------------------------------------------------------- 1 | import { browser, by, element } from 'protractor'; 2 | 3 | export class AppPage { 4 | navigateTo() { 5 | return browser.get(browser.baseUrl) as Promise; 6 | } 7 | 8 | getNavTitleText() { 9 | return element(by.css('app-root app-starter div app-starter-main-side-bar aside a span')).getText() as Promise; 10 | } 11 | 12 | getContentTitleText() { 13 | return element(by.css('app-content div div div div h1')).getText() as Promise; 14 | } 15 | 16 | } 17 | -------------------------------------------------------------------------------- /e2e/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "../out-tsc/e2e", 5 | "module": "commonjs", 6 | "target": "es5", 7 | "types": [ 8 | "jasmine", 9 | "jasminewd2", 10 | "node" 11 | ] 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /karma.conf.js: -------------------------------------------------------------------------------- 1 | // Karma configuration file, see link for more information 2 | // https://karma-runner.github.io/1.0/config/configuration-file.html 3 | 4 | module.exports = function (config) { 5 | config.set({ 6 | basePath: '', 7 | frameworks: ['jasmine', '@angular-devkit/build-angular'], 8 | plugins: [ 9 | require('karma-jasmine'), 10 | require('karma-chrome-launcher'), 11 | require('karma-jasmine-html-reporter'), 12 | require('karma-coverage-istanbul-reporter'), 13 | require('@angular-devkit/build-angular/plugins/karma') 14 | ], 15 | client: { 16 | clearContext: false // leave Jasmine Spec Runner output visible in browser 17 | }, 18 | coverageIstanbulReporter: { 19 | dir: require('path').join(__dirname, './coverage/angularAdminLTE'), 20 | reports: ['html', 'lcovonly', 'text-summary'], 21 | fixWebpackSourcePaths: true 22 | }, 23 | reporters: ['progress', 'kjhtml'], 24 | port: 9876, 25 | colors: true, 26 | logLevel: config.LOG_INFO, 27 | autoWatch: true, 28 | browsers: ['Chrome'], 29 | singleRun: false, 30 | restartOnFileChange: true 31 | }); 32 | }; 33 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "angular-admin-lte", 3 | "version": "0.0.0", 4 | "scripts": { 5 | "ng": "ng", 6 | "start": "ng serve", 7 | "build": "ng build", 8 | "test": "ng test", 9 | "lint": "ng lint", 10 | "e2e": "ng e2e" 11 | }, 12 | "private": true, 13 | "dependencies": { 14 | "@angular/animations": "~9.0.7", 15 | "@angular/common": "~9.0.7", 16 | "@angular/compiler": "~9.0.7", 17 | "@angular/core": "~9.0.7", 18 | "@angular/forms": "~9.0.7", 19 | "@angular/platform-browser": "~9.0.7", 20 | "@angular/platform-browser-dynamic": "~9.0.7", 21 | "@angular/router": "~9.0.7", 22 | "@fortawesome/fontawesome-free": "^5.12.1", 23 | "admin-lte": "^3.0.1", 24 | "rxjs": "~6.5.4", 25 | "tslib": "^1.10.0", 26 | "zone.js": "~0.10.2" 27 | }, 28 | "devDependencies": { 29 | "@angular-devkit/build-angular": "~0.900.7", 30 | "@angular/cli": "~9.0.7", 31 | "@angular/compiler-cli": "~9.0.7", 32 | "@angular/language-service": "~9.0.7", 33 | "@types/node": "^12.11.1", 34 | "@types/jasmine": "~3.5.0", 35 | "@types/jasminewd2": "~2.0.3", 36 | "codelyzer": "^5.1.2", 37 | "jasmine-core": "~3.5.0", 38 | "jasmine-spec-reporter": "~4.2.1", 39 | "karma": "~4.3.0", 40 | "karma-chrome-launcher": "~3.1.0", 41 | "karma-coverage-istanbul-reporter": "~2.1.0", 42 | "karma-jasmine": "~2.0.1", 43 | "karma-jasmine-html-reporter": "^1.4.2", 44 | "protractor": "~5.4.3", 45 | "ts-node": "~8.3.0", 46 | "tslint": "~5.18.0", 47 | "typescript": "~3.7.5" 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /src/app/app-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { Routes, RouterModule } from '@angular/router'; 3 | 4 | 5 | const routes: Routes = [ 6 | { 7 | path: '', 8 | loadChildren: () => import('./starter/starter.module').then(m => m.StarterModule) 9 | }, 10 | { 11 | path: 'starter', 12 | loadChildren: () => import('./starter/starter.module').then(m => m.StarterModule) 13 | } 14 | ]; 15 | 16 | @NgModule({ 17 | imports: [RouterModule.forRoot(routes)], 18 | exports: [RouterModule] 19 | }) 20 | export class AppRoutingModule { } 21 | -------------------------------------------------------------------------------- /src/app/app.component.html: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /src/app/app.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/app/app.component.scss -------------------------------------------------------------------------------- /src/app/app.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { TestBed, async } from '@angular/core/testing'; 2 | import { RouterTestingModule } from '@angular/router/testing'; 3 | import { AppComponent } from './app.component'; 4 | 5 | describe('AppComponent', () => { 6 | beforeEach(async(() => { 7 | TestBed.configureTestingModule({ 8 | imports: [ 9 | RouterTestingModule 10 | ], 11 | declarations: [ 12 | AppComponent 13 | ], 14 | }).compileComponents(); 15 | })); 16 | 17 | it('should create the app', () => { 18 | const fixture = TestBed.createComponent(AppComponent); 19 | const app = fixture.debugElement.componentInstance; 20 | expect(app).toBeTruthy(); 21 | }); 22 | 23 | it(`should have as title 'angularAdminLTE'`, () => { 24 | const fixture = TestBed.createComponent(AppComponent); 25 | const app = fixture.debugElement.componentInstance; 26 | expect(app.title).toEqual('angularAdminLTE'); 27 | }); 28 | 29 | }); 30 | -------------------------------------------------------------------------------- /src/app/app.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-root', 5 | templateUrl: './app.component.html', 6 | styleUrls: ['./app.component.scss'] 7 | }) 8 | export class AppComponent { 9 | title = 'angularAdminLTE'; 10 | } 11 | -------------------------------------------------------------------------------- /src/app/app.module.ts: -------------------------------------------------------------------------------- 1 | import { BrowserModule } from '@angular/platform-browser'; 2 | import { NgModule } from '@angular/core'; 3 | 4 | import { AppRoutingModule } from './app-routing.module'; 5 | import { AppComponent } from './app.component'; 6 | 7 | @NgModule({ 8 | declarations: [ 9 | AppComponent 10 | ], 11 | imports: [ 12 | BrowserModule, 13 | AppRoutingModule 14 | ], 15 | providers: [], 16 | bootstrap: [AppComponent] 17 | }) 18 | export class AppModule { } 19 | -------------------------------------------------------------------------------- /src/app/core/core.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | 4 | 5 | 6 | @NgModule({ 7 | declarations: [], 8 | imports: [ 9 | CommonModule 10 | ] 11 | }) 12 | export class CoreModule { } 13 | -------------------------------------------------------------------------------- /src/app/shared/shared.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | 4 | 5 | 6 | @NgModule({ 7 | declarations: [], 8 | imports: [ 9 | CommonModule 10 | ] 11 | }) 12 | export class SharedModule { } 13 | -------------------------------------------------------------------------------- /src/app/starter/starter-routing.module.ts: -------------------------------------------------------------------------------- 1 | import { ContentComponent } from './starter/content/content.component'; 2 | import { NgModule } from '@angular/core'; 3 | import { Routes, RouterModule } from '@angular/router'; 4 | import { StarterComponent } from './starter/starter.component'; 5 | 6 | 7 | const routes: Routes = [ 8 | { 9 | path: '', 10 | component: StarterComponent, 11 | children: [ 12 | { 13 | path: '', 14 | component: ContentComponent 15 | } 16 | ] 17 | } 18 | ]; 19 | 20 | @NgModule({ 21 | imports: [RouterModule.forChild(routes)], 22 | exports: [RouterModule] 23 | }) 24 | export class StarterRoutingModule { } 25 | -------------------------------------------------------------------------------- /src/app/starter/starter.module.ts: -------------------------------------------------------------------------------- 1 | import { NgModule } from '@angular/core'; 2 | import { CommonModule } from '@angular/common'; 3 | 4 | import { StarterRoutingModule } from './starter-routing.module'; 5 | import { StarterComponent } from './starter/starter.component'; 6 | import { ContentComponent } from './starter/content/content.component'; 7 | import { ControlSideBarComponent } from './starter/control-side-bar/control-side-bar.component'; 8 | import { MainSideBarComponent } from './starter/main-side-bar/main-side-bar.component'; 9 | import { NavBarComponent } from './starter/nav-bar/nav-bar.component'; 10 | import { FooterComponent } from './starter/footer/footer.component'; 11 | 12 | 13 | @NgModule({ 14 | declarations: [StarterComponent, ContentComponent, ControlSideBarComponent, MainSideBarComponent, NavBarComponent, FooterComponent], 15 | imports: [ 16 | CommonModule, 17 | StarterRoutingModule 18 | ] 19 | }) 20 | export class StarterModule { } 21 | -------------------------------------------------------------------------------- /src/app/starter/starter/content/content.component.html: -------------------------------------------------------------------------------- 1 | 2 |
3 |
4 |
5 |
6 |

Starter Page

7 |
8 |
9 |
    10 |
  1. Home
    2. 11 |
  2. Starter Page
    3. 12 |
13 |
14 |
15 |
16 |
17 | 18 | 19 | 20 |
21 |
22 |
23 |
24 |
25 |
26 |
Card title
27 | 28 |

29 | Some quick example text to build on the card title and make up the bulk of the card's 30 | content. 31 |

32 | 33 | Card link 34 | Another link 35 |
36 |
37 | 38 |
39 |
40 |
Card title
41 | 42 |

43 | Some quick example text to build on the card title and make up the bulk of the card's 44 | content. 45 |

46 | Card link 47 | Another link 48 |
49 |
50 |
51 | 52 |
53 |
54 |
55 |
Featured
56 |
57 |
58 |
Special title treatment
59 | 60 |

With supporting text below as a natural lead-in to additional content.

61 | Go somewhere 62 |
63 |
64 | 65 |
66 |
67 |
Featured
68 |
69 |
70 |
Special title treatment
71 | 72 |

With supporting text below as a natural lead-in to additional content.

73 | Go somewhere 74 |
75 |
76 |
77 | 78 |
79 | 80 |
81 |
82 | 83 | -------------------------------------------------------------------------------- /src/app/starter/starter/content/content.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/app/starter/starter/content/content.component.scss -------------------------------------------------------------------------------- /src/app/starter/starter/content/content.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ContentComponent } from './content.component'; 4 | 5 | describe('ContentComponent', () => { 6 | let component: ContentComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async(() => { 10 | TestBed.configureTestingModule({ 11 | declarations: [ ContentComponent ] 12 | }) 13 | .compileComponents(); 14 | })); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ContentComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | 26 | it('should render title', () => { 27 | fixture.detectChanges(); 28 | const compiled = fixture.debugElement.nativeElement; 29 | expect(compiled.querySelector('div div div div h1').textContent).toContain('Starter Page'); 30 | }); 31 | }); 32 | -------------------------------------------------------------------------------- /src/app/starter/starter/content/content.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-content', 5 | templateUrl: './content.component.html', 6 | styleUrls: ['./content.component.scss'] 7 | }) 8 | export class ContentComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /src/app/starter/starter/control-side-bar/control-side-bar.component.html: -------------------------------------------------------------------------------- 1 | 8 | -------------------------------------------------------------------------------- /src/app/starter/starter/control-side-bar/control-side-bar.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/app/starter/starter/control-side-bar/control-side-bar.component.scss -------------------------------------------------------------------------------- /src/app/starter/starter/control-side-bar/control-side-bar.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { ControlSideBarComponent } from './control-side-bar.component'; 4 | 5 | describe('ControlSideBarComponent', () => { 6 | let component: ControlSideBarComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async(() => { 10 | TestBed.configureTestingModule({ 11 | declarations: [ ControlSideBarComponent ] 12 | }) 13 | .compileComponents(); 14 | })); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(ControlSideBarComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/starter/starter/control-side-bar/control-side-bar.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-starter-control-side-bar', 5 | templateUrl: './control-side-bar.component.html', 6 | styleUrls: ['./control-side-bar.component.scss'] 7 | }) 8 | export class ControlSideBarComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /src/app/starter/starter/footer/footer.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | Anything you want 5 |
6 | 7 | Copyright © 2014-2019 AdminLTE.io. All rights reserved. 8 |
9 | -------------------------------------------------------------------------------- /src/app/starter/starter/footer/footer.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/app/starter/starter/footer/footer.component.scss -------------------------------------------------------------------------------- /src/app/starter/starter/footer/footer.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { FooterComponent } from './footer.component'; 4 | 5 | describe('FooterComponent', () => { 6 | let component: FooterComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async(() => { 10 | TestBed.configureTestingModule({ 11 | declarations: [ FooterComponent ] 12 | }) 13 | .compileComponents(); 14 | })); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(FooterComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/starter/starter/footer/footer.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-starter-footer', 5 | templateUrl: './footer.component.html', 6 | styleUrls: ['./footer.component.scss'] 7 | }) 8 | export class FooterComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /src/app/starter/starter/main-side-bar/main-side-bar.component.html: -------------------------------------------------------------------------------- 1 | 64 | -------------------------------------------------------------------------------- /src/app/starter/starter/main-side-bar/main-side-bar.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/app/starter/starter/main-side-bar/main-side-bar.component.scss -------------------------------------------------------------------------------- /src/app/starter/starter/main-side-bar/main-side-bar.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { MainSideBarComponent } from './main-side-bar.component'; 4 | 5 | describe('MainSideBarComponent', () => { 6 | let component: MainSideBarComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async(() => { 10 | TestBed.configureTestingModule({ 11 | declarations: [ MainSideBarComponent ] 12 | }) 13 | .compileComponents(); 14 | })); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(MainSideBarComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/starter/starter/main-side-bar/main-side-bar.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-starter-main-side-bar', 5 | templateUrl: './main-side-bar.component.html', 6 | styleUrls: ['./main-side-bar.component.scss'] 7 | }) 8 | export class MainSideBarComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /src/app/starter/starter/nav-bar/nav-bar.component.html: -------------------------------------------------------------------------------- 1 | 120 | -------------------------------------------------------------------------------- /src/app/starter/starter/nav-bar/nav-bar.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/app/starter/starter/nav-bar/nav-bar.component.scss -------------------------------------------------------------------------------- /src/app/starter/starter/nav-bar/nav-bar.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { NavBarComponent } from './nav-bar.component'; 4 | 5 | describe('NavBarComponent', () => { 6 | let component: NavBarComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async(() => { 10 | TestBed.configureTestingModule({ 11 | declarations: [ NavBarComponent ] 12 | }) 13 | .compileComponents(); 14 | })); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(NavBarComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/starter/starter/nav-bar/nav-bar.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-starter-nav-bar', 5 | templateUrl: './nav-bar.component.html', 6 | styleUrls: ['./nav-bar.component.scss'] 7 | }) 8 | export class NavBarComponent implements OnInit { 9 | 10 | constructor() { } 11 | 12 | ngOnInit() { 13 | } 14 | 15 | } 16 | -------------------------------------------------------------------------------- /src/app/starter/starter/starter.component.html: -------------------------------------------------------------------------------- 1 |
2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | -------------------------------------------------------------------------------- /src/app/starter/starter/starter.component.scss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/app/starter/starter/starter.component.scss -------------------------------------------------------------------------------- /src/app/starter/starter/starter.component.spec.ts: -------------------------------------------------------------------------------- 1 | import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 2 | 3 | import { StarterComponent } from './starter.component'; 4 | 5 | describe('StarterComponent', () => { 6 | let component: StarterComponent; 7 | let fixture: ComponentFixture; 8 | 9 | beforeEach(async(() => { 10 | TestBed.configureTestingModule({ 11 | declarations: [ StarterComponent ] 12 | }) 13 | .compileComponents(); 14 | })); 15 | 16 | beforeEach(() => { 17 | fixture = TestBed.createComponent(StarterComponent); 18 | component = fixture.componentInstance; 19 | fixture.detectChanges(); 20 | }); 21 | 22 | it('should create', () => { 23 | expect(component).toBeTruthy(); 24 | }); 25 | }); 26 | -------------------------------------------------------------------------------- /src/app/starter/starter/starter.component.ts: -------------------------------------------------------------------------------- 1 | import { Component, OnInit, OnDestroy } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'app-starter', 5 | templateUrl: './starter.component.html', 6 | styleUrls: ['./starter.component.scss'] 7 | }) 8 | export class StarterComponent implements OnInit, OnDestroy { 9 | 10 | body: HTMLBodyElement = document.getElementsByTagName('body')[0]; 11 | 12 | constructor() { } 13 | 14 | ngOnInit() { 15 | this.body.classList.add('sidebar-mini'); 16 | } 17 | 18 | ngOnDestroy() { 19 | // remove the the body classes 20 | this.body.classList.remove('sidebar-mini'); 21 | } 22 | 23 | } 24 | -------------------------------------------------------------------------------- /src/assets/.gitkeep: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/.gitkeep -------------------------------------------------------------------------------- /src/assets/img/AdminLTELogo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/AdminLTELogo.png -------------------------------------------------------------------------------- /src/assets/img/avatar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/avatar.png -------------------------------------------------------------------------------- /src/assets/img/avatar04.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/avatar04.png -------------------------------------------------------------------------------- /src/assets/img/avatar2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/avatar2.png -------------------------------------------------------------------------------- /src/assets/img/avatar3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/avatar3.png -------------------------------------------------------------------------------- /src/assets/img/avatar5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/avatar5.png -------------------------------------------------------------------------------- /src/assets/img/boxed-bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/boxed-bg.jpg -------------------------------------------------------------------------------- /src/assets/img/boxed-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/boxed-bg.png -------------------------------------------------------------------------------- /src/assets/img/credit/american-express.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/credit/american-express.png -------------------------------------------------------------------------------- /src/assets/img/credit/cirrus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/credit/cirrus.png -------------------------------------------------------------------------------- /src/assets/img/credit/mastercard.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/credit/mastercard.png -------------------------------------------------------------------------------- /src/assets/img/credit/mestro.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/credit/mestro.png -------------------------------------------------------------------------------- /src/assets/img/credit/paypal.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/credit/paypal.png -------------------------------------------------------------------------------- /src/assets/img/credit/paypal2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/credit/paypal2.png -------------------------------------------------------------------------------- /src/assets/img/credit/visa.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/credit/visa.png -------------------------------------------------------------------------------- /src/assets/img/default-150x150.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/default-150x150.png -------------------------------------------------------------------------------- /src/assets/img/icons.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/icons.png -------------------------------------------------------------------------------- /src/assets/img/photo1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/photo1.png -------------------------------------------------------------------------------- /src/assets/img/photo2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/photo2.png -------------------------------------------------------------------------------- /src/assets/img/photo3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/photo3.jpg -------------------------------------------------------------------------------- /src/assets/img/photo4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/photo4.jpg -------------------------------------------------------------------------------- /src/assets/img/prod-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/prod-1.jpg -------------------------------------------------------------------------------- /src/assets/img/prod-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/prod-2.jpg -------------------------------------------------------------------------------- /src/assets/img/prod-3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/prod-3.jpg -------------------------------------------------------------------------------- /src/assets/img/prod-4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/prod-4.jpg -------------------------------------------------------------------------------- /src/assets/img/prod-5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/prod-5.jpg -------------------------------------------------------------------------------- /src/assets/img/user1-128x128.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/user1-128x128.jpg -------------------------------------------------------------------------------- /src/assets/img/user2-160x160.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/user2-160x160.jpg -------------------------------------------------------------------------------- /src/assets/img/user3-128x128.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/user3-128x128.jpg -------------------------------------------------------------------------------- /src/assets/img/user4-128x128.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/user4-128x128.jpg -------------------------------------------------------------------------------- /src/assets/img/user5-128x128.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/user5-128x128.jpg -------------------------------------------------------------------------------- /src/assets/img/user6-128x128.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/user6-128x128.jpg -------------------------------------------------------------------------------- /src/assets/img/user7-128x128.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/user7-128x128.jpg -------------------------------------------------------------------------------- /src/assets/img/user8-128x128.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/assets/img/user8-128x128.jpg -------------------------------------------------------------------------------- /src/environments/environment.prod.ts: -------------------------------------------------------------------------------- 1 | export const environment = { 2 | production: true 3 | }; 4 | -------------------------------------------------------------------------------- /src/environments/environment.ts: -------------------------------------------------------------------------------- 1 | // This file can be replaced during build by using the `fileReplacements` array. 2 | // `ng build --prod` replaces `environment.ts` with `environment.prod.ts`. 3 | // The list of file replacements can be found in `angular.json`. 4 | 5 | export const environment = { 6 | production: false 7 | }; 8 | 9 | /* 10 | * For easier debugging in development mode, you can import the following file 11 | * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`. 12 | * 13 | * This import should be commented out in production mode because it will have a negative impact 14 | * on performance if an error is thrown. 15 | */ 16 | // import 'zone.js/dist/zone-error'; // Included with Angular CLI. 17 | -------------------------------------------------------------------------------- /src/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/csotomon/angularAdminLTE/1b952871b73963e80afeecb7f93a279c02dcfb22/src/favicon.ico -------------------------------------------------------------------------------- /src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | AngularAdminLTE 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /src/main.ts: -------------------------------------------------------------------------------- 1 | import { enableProdMode } from '@angular/core'; 2 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 3 | 4 | import { AppModule } from './app/app.module'; 5 | import { environment } from './environments/environment'; 6 | 7 | if (environment.production) { 8 | enableProdMode(); 9 | } 10 | 11 | platformBrowserDynamic().bootstrapModule(AppModule) 12 | .catch(err => console.error(err)); 13 | -------------------------------------------------------------------------------- /src/polyfills.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * This file includes polyfills needed by Angular and is loaded before the app. 3 | * You can add your own extra polyfills to this file. 4 | * 5 | * This file is divided into 2 sections: 6 | * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. 7 | * 2. Application imports. Files imported after ZoneJS that should be loaded before your main 8 | * file. 9 | * 10 | * The current setup is for so-called "evergreen" browsers; the last versions of browsers that 11 | * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera), 12 | * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile. 13 | * 14 | * Learn more in https://angular.io/guide/browser-support 15 | */ 16 | 17 | /*************************************************************************************************** 18 | * BROWSER POLYFILLS 19 | */ 20 | 21 | /** IE10 and IE11 requires the following for NgClass support on SVG elements */ 22 | // import 'classlist.js'; // Run `npm install --save classlist.js`. 23 | 24 | /** 25 | * Web Animations `@angular/platform-browser/animations` 26 | * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari. 27 | * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0). 28 | */ 29 | // import 'web-animations-js'; // Run `npm install --save web-animations-js`. 30 | 31 | /** 32 | * By default, zone.js will patch all possible macroTask and DomEvents 33 | * user can disable parts of macroTask/DomEvents patch by setting following flags 34 | * because those flags need to be set before `zone.js` being loaded, and webpack 35 | * will put import in the top of bundle, so user need to create a separate file 36 | * in this directory (for example: zone-flags.ts), and put the following flags 37 | * into that file, and then add the following code before importing zone.js. 38 | * import './zone-flags'; 39 | * 40 | * The flags allowed in zone-flags.ts are listed here. 41 | * 42 | * The following flags will work for all browsers. 43 | * 44 | * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame 45 | * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick 46 | * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames 47 | * 48 | * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js 49 | * with the following flag, it will bypass `zone.js` patch for IE/Edge 50 | * 51 | * (window as any).__Zone_enable_cross_context_check = true; 52 | * 53 | */ 54 | 55 | /*************************************************************************************************** 56 | * Zone JS is required by default for Angular itself. 57 | */ 58 | import 'zone.js/dist/zone'; // Included with Angular CLI. 59 | 60 | 61 | /*************************************************************************************************** 62 | * APPLICATION IMPORTS 63 | */ 64 | -------------------------------------------------------------------------------- /src/styles.scss: -------------------------------------------------------------------------------- 1 | /* You can add global styles to this file, and also import other style files */ 2 | 3 | /* 4 | Admin LTE customization 5 | */ 6 | 7 | // bootstrap functions customization 8 | @import "./styles/bootstrap-functions"; 9 | 10 | // bootstrap variables customization 11 | @import "./styles/bootstrap-variables"; 12 | 13 | //build boostrap library 14 | @import "../node_modules/bootstrap/scss/bootstrap"; 15 | 16 | @import "./styles/variables"; 17 | 18 | // build Font Awesome Icons 19 | @import "../node_modules/@fortawesome/fontawesome-free/scss/fontawesome"; 20 | @import "../node_modules/@fortawesome/fontawesome-free/scss/solid"; 21 | @import "../node_modules/@fortawesome/fontawesome-free/scss/regular"; 22 | @import "../node_modules/@fortawesome/fontawesome-free/scss/brands"; 23 | 24 | // build AdminLTE theme styles 25 | @import "../node_modules/admin-lte/build/scss/AdminLTE"; 26 | 27 | // Google Font: Source Sans Pro 28 | @import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700'); 29 | -------------------------------------------------------------------------------- /src/styles/bootstrap-functions.scss: -------------------------------------------------------------------------------- 1 | // Bootstrap functions 2 | // 3 | // Utility mixins and functions for evaluating source code across our variables, maps, and mixins. 4 | 5 | // Ascending 6 | // Used to evaluate Sass maps like our grid breakpoints. 7 | @mixin _assert-ascending($map, $map-name) { 8 | $prev-key: null; 9 | $prev-num: null; 10 | @each $key, $num in $map { 11 | @if $prev-num == null or unit($num) == "%" or unit($prev-num) == "%" { 12 | // Do nothing 13 | } @else if not comparable($prev-num, $num) { 14 | @warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !"; 15 | } @else if $prev-num >= $num { 16 | @warn "Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !"; 17 | } 18 | $prev-key: $key; 19 | $prev-num: $num; 20 | } 21 | } 22 | 23 | // Starts at zero 24 | // Used to ensure the min-width of the lowest breakpoint starts at 0. 25 | @mixin _assert-starts-at-zero($map, $map-name: "$grid-breakpoints") { 26 | $values: map-values($map); 27 | $first-value: nth($values, 1); 28 | @if $first-value != 0 { 29 | @warn "First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}."; 30 | } 31 | } 32 | 33 | // Replace `$search` with `$replace` in `$string` 34 | // Used on our SVG icon backgrounds for custom forms. 35 | // 36 | // @author Hugo Giraudel 37 | // @param {String} $string - Initial string 38 | // @param {String} $search - Substring to replace 39 | // @param {String} $replace ('') - New value 40 | // @return {String} - Updated string 41 | @function str-replace($string, $search, $replace: "") { 42 | $index: str-index($string, $search); 43 | 44 | @if $index { 45 | @return str-slice($string, 1, $index - 1) + $replace + 46 | str-replace( 47 | str-slice($string, $index + str-length($search)), 48 | $search, 49 | $replace 50 | ); 51 | } 52 | 53 | @return $string; 54 | } 55 | 56 | // See https://codepen.io/kevinweber/pen/dXWoRw 57 | @function escape-svg($string) { 58 | @if str-index($string, "data:image/svg+xml") { 59 | @each $char, $encoded in $escaped-characters { 60 | $string: str-replace($string, $char, $encoded); 61 | } 62 | } 63 | 64 | @return $string; 65 | } 66 | 67 | // Color contrast 68 | @function color-yiq($color, $dark: $yiq-text-dark, $light: $yiq-text-light) { 69 | $r: red($color); 70 | $g: green($color); 71 | $b: blue($color); 72 | 73 | $yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000; 74 | 75 | @if ($yiq >= $yiq-contrasted-threshold) { 76 | @return $dark; 77 | } @else { 78 | @return $light; 79 | } 80 | } 81 | 82 | // Retrieve color Sass maps 83 | @function color($key: "blue") { 84 | @return map-get($colors, $key); 85 | } 86 | 87 | @function theme-color($key: "primary") { 88 | @return map-get($theme-colors, $key); 89 | } 90 | 91 | @function gray($key: "100") { 92 | @return map-get($grays, $key); 93 | } 94 | 95 | // Request a theme color level 96 | @function theme-color-level($color-name: "primary", $level: 0) { 97 | $color: theme-color($color-name); 98 | $color-base: if($level > 0, $black, $white); 99 | $level: abs($level); 100 | 101 | @return mix($color-base, $color, $level * $theme-color-interval); 102 | } 103 | 104 | // Return valid calc 105 | @function add($value1, $value2, $return-calc: true) { 106 | @if $value1 == null { 107 | @return $value2; 108 | } 109 | 110 | @if $value2 == null { 111 | @return $value1; 112 | } 113 | 114 | @if type-of($value1) == 115 | number and 116 | type-of($value2) == 117 | number and 118 | comparable($value1, $value2) 119 | { 120 | @return $value1 + $value2; 121 | } 122 | 123 | @return if( 124 | $return-calc == true, 125 | calc(#{$value1} + #{$value2}), 126 | $value1 + unquote(" + ") + $value2 127 | ); 128 | } 129 | 130 | @function subtract($value1, $value2, $return-calc: true) { 131 | @if $value1 == null and $value2 == null { 132 | @return null; 133 | } 134 | 135 | @if $value1 == null { 136 | @return -$value2; 137 | } 138 | 139 | @if $value2 == null { 140 | @return $value1; 141 | } 142 | 143 | @if type-of($value1) == 144 | number and 145 | type-of($value2) == 146 | number and 147 | comparable($value1, $value2) 148 | { 149 | @return $value1 - $value2; 150 | } 151 | 152 | @return if( 153 | $return-calc == true, 154 | calc(#{$value1} - #{$value2}), 155 | $value1 + unquote(" - ") + $value2 156 | ); 157 | } 158 | -------------------------------------------------------------------------------- /src/styles/bootstrap-variables.scss: -------------------------------------------------------------------------------- 1 | // Variables 2 | // 3 | // Variables should follow the `$component-state-property-size` formula for 4 | // consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs. 5 | 6 | 7 | // 8 | // Color system 9 | // 10 | 11 | // stylelint-disable 12 | $white: #ffffff !default; 13 | $gray-100: #f8f9fa !default; 14 | $gray-200: #e9ecef !default; 15 | $gray-300: #dee2e6 !default; 16 | $gray-400: #ced4da !default; 17 | $gray-500: #adb5bd !default; 18 | $gray-600: #6c757d !default; 19 | $gray-700: #495057 !default; 20 | $gray-800: #343a40 !default; 21 | $gray-900: #212529 !default; 22 | $black: #000 !default; 23 | 24 | $grays: () !default; 25 | $grays: map-merge(( 26 | "100": $gray-100, 27 | "200": $gray-200, 28 | "300": $gray-300, 29 | "400": $gray-400, 30 | "500": $gray-500, 31 | "600": $gray-600, 32 | "700": $gray-700, 33 | "800": $gray-800, 34 | "900": $gray-900 35 | ), $grays); 36 | 37 | $blue: #007bff !default; 38 | $indigo: #6610f2 !default; 39 | $purple: #6f42c1 !default; 40 | $pink: #e83e8c !default; 41 | $red: #dc3545 !default; 42 | $orange: #fd7e14 !default; 43 | $yellow: #ffc107 !default; 44 | $green: #28a745 !default; 45 | $teal: #20c997 !default; 46 | $cyan: #17a2b8 !default; 47 | 48 | $colors: () !default; 49 | $colors: map-merge(( 50 | "blue": $blue, 51 | "indigo": $indigo, 52 | "purple": $purple, 53 | "pink": $pink, 54 | "red": $red, 55 | "orange": $orange, 56 | "yellow": $yellow, 57 | "green": $green, 58 | "teal": $teal, 59 | "cyan": $cyan, 60 | "white": $white, 61 | "gray": $gray-600, 62 | "gray-dark": $gray-800 63 | ), $colors); 64 | 65 | $primary: $blue !default; 66 | $secondary: $gray-600 !default; 67 | $success: $green !default; 68 | $info: $cyan !default; 69 | $warning: $yellow !default; 70 | $danger: $red !default; 71 | $light: $gray-100 !default; 72 | $dark: $gray-800 !default; 73 | 74 | $theme-colors: () !default; 75 | $theme-colors: map-merge(( 76 | "primary": $primary, 77 | "secondary": $secondary, 78 | "success": $success, 79 | "info": $info, 80 | "warning": $warning, 81 | "danger": $danger, 82 | "light": $light, 83 | "dark": $dark 84 | ), $theme-colors); 85 | // stylelint-enable 86 | 87 | // Set a specific jump point for requesting color jumps 88 | $theme-color-interval: 8% !default; 89 | 90 | // The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255. 91 | $yiq-contrasted-threshold: 150 !default; 92 | 93 | // Customize the light and dark text colors for use in our YIQ color contrast function. 94 | $yiq-text-dark: #1F2D3D !default; 95 | $yiq-text-light: $white !default; 96 | 97 | // Options 98 | // 99 | // Quickly modify global styling by enabling or disabling optional features. 100 | 101 | $enable-caret: true !default; 102 | $enable-rounded: true !default; 103 | $enable-shadows: true !default; 104 | $enable-gradients: false !default; 105 | $enable-transitions: true !default; 106 | $enable-prefers-reduced-motion-media-query: true !default; 107 | $enable-hover-media-query: false !default; // Deprecated, no longer affects any compiled CSS 108 | $enable-grid-classes: true !default; 109 | $enable-pointer-cursor-for-buttons: true !default; 110 | $enable-print-styles: true !default; 111 | $enable-responsive-font-sizes: false !default; 112 | $enable-validation-icons: true !default; 113 | $enable-deprecation-messages: true !default; 114 | 115 | // Spacing 116 | // 117 | // Control the default styling of most Bootstrap elements by modifying these 118 | // variables. Mostly focused on spacing. 119 | // You can add more entries to the $spacers map, should you need more variation. 120 | 121 | // stylelint-disable 122 | $spacer: 1rem !default; 123 | $spacers: () !default; 124 | $spacers: map-merge(( 125 | 0: 0, 126 | 1: ($spacer * .25), 127 | 2: ($spacer * .5), 128 | 3: $spacer, 129 | 4: ($spacer * 1.5), 130 | 5: ($spacer * 3) 131 | ), $spacers); 132 | 133 | // This variable affects the `.h-*` and `.w-*` classes. 134 | $sizes: () !default; 135 | $sizes: map-merge(( 136 | 25: 25%, 137 | 50: 50%, 138 | 75: 75%, 139 | 100: 100% 140 | ), $sizes); 141 | // stylelint-enable 142 | 143 | // Body 144 | // 145 | // Settings for the `` element. 146 | 147 | $body-bg: $white !default; 148 | $body-color: $gray-900 !default; 149 | 150 | // Links 151 | // 152 | // Style anchor elements. 153 | 154 | $link-color: theme-color("primary") !default; 155 | $link-decoration: none !default; 156 | $link-hover-color: darken($link-color, 15%) !default; 157 | $link-hover-decoration: none !default; 158 | 159 | // Paragraphs 160 | // 161 | // Style p element. 162 | 163 | $paragraph-margin-bottom: 1rem !default; 164 | 165 | 166 | // Grid breakpoints 167 | // 168 | // Define the minimum dimensions at which your layout will change, 169 | // adapting to different screen sizes, for use in media queries. 170 | 171 | $grid-breakpoints: ( 172 | xs: 0, 173 | sm: 576px, 174 | md: 768px, 175 | lg: 992px, 176 | xl: 1200px 177 | ) !default; 178 | 179 | @include _assert-ascending($grid-breakpoints, "$grid-breakpoints"); 180 | @include _assert-starts-at-zero($grid-breakpoints); 181 | 182 | 183 | // Grid containers 184 | // 185 | // Define the maximum width of `.container` for different screen sizes. 186 | 187 | $container-max-widths: ( 188 | sm: 540px, 189 | md: 720px, 190 | lg: 960px, 191 | xl: 1140px 192 | ) !default; 193 | 194 | @include _assert-ascending($container-max-widths, "$container-max-widths"); 195 | 196 | 197 | // Grid columns 198 | // 199 | // Set the number of columns and specify the width of the gutters. 200 | 201 | $grid-columns: 12 !default; 202 | $grid-gutter-width: 15px !default; 203 | 204 | // Components 205 | // 206 | // Define common padding and border radius sizes and more. 207 | 208 | $line-height-lg: 1.5 !default; 209 | $line-height-sm: 1.5 !default; 210 | 211 | $border-width: 1px !default; 212 | $border-color: $gray-300 !default; 213 | 214 | $border-radius: .25rem !default; 215 | $border-radius-lg: .3rem !default; 216 | $border-radius-sm: .2rem !default; 217 | 218 | $component-active-color: $white !default; 219 | $component-active-bg: theme-color("primary") !default; 220 | 221 | $caret-width: .3em !default; 222 | 223 | $transition-base: all .2s ease-in-out !default; 224 | $transition-fade: opacity .15s linear !default; 225 | $transition-collapse: height .35s ease !default; 226 | 227 | 228 | // Fonts 229 | // 230 | // Font, line-height, and color for body text, headings, and more. 231 | 232 | // stylelint-disable value-keyword-case 233 | $font-family-sans-serif: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default; 234 | $font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default; 235 | $font-family-base: $font-family-sans-serif !default; 236 | // stylelint-enable value-keyword-case 237 | 238 | $font-size-base: 1rem !default; // Assumes the browser default, typically `16px` 239 | $font-size-lg: ($font-size-base * 1.25) !default; 240 | $font-size-sm: ($font-size-base * .875) !default; 241 | 242 | $font-weight-light: 300 !default; 243 | $font-weight-normal: 400 !default; 244 | $font-weight-bold: 700 !default; 245 | 246 | $font-weight-base: $font-weight-normal !default; 247 | $line-height-base: 1.5 !default; 248 | 249 | $h1-font-size: $font-size-base * 2.5 !default; 250 | $h2-font-size: $font-size-base * 2 !default; 251 | $h3-font-size: $font-size-base * 1.75 !default; 252 | $h4-font-size: $font-size-base * 1.5 !default; 253 | $h5-font-size: $font-size-base * 1.25 !default; 254 | $h6-font-size: $font-size-base !default; 255 | 256 | $headings-margin-bottom: ($spacer / 2) !default; 257 | $headings-font-family: inherit !default; 258 | $headings-font-weight: 500 !default; 259 | $headings-line-height: 1.2 !default; 260 | $headings-color: inherit !default; 261 | 262 | $display1-size: 6rem !default; 263 | $display2-size: 5.5rem !default; 264 | $display3-size: 4.5rem !default; 265 | $display4-size: 3.5rem !default; 266 | 267 | $display1-weight: 300 !default; 268 | $display2-weight: 300 !default; 269 | $display3-weight: 300 !default; 270 | $display4-weight: 300 !default; 271 | $display-line-height: $headings-line-height !default; 272 | 273 | $lead-font-size: ($font-size-base * 1.25) !default; 274 | $lead-font-weight: 300 !default; 275 | 276 | $small-font-size: 80% !default; 277 | 278 | $text-muted: $gray-600 !default; 279 | 280 | $blockquote-small-color: $gray-600 !default; 281 | $blockquote-font-size: ($font-size-base * 1.25) !default; 282 | 283 | $hr-border-color: rgba($black, .1) !default; 284 | $hr-border-width: $border-width !default; 285 | 286 | $mark-padding: .2em !default; 287 | 288 | $dt-font-weight: $font-weight-bold !default; 289 | 290 | $kbd-box-shadow: inset 0 -.1rem 0 rgba($black, .25) !default; 291 | $nested-kbd-font-weight: $font-weight-bold !default; 292 | 293 | $list-inline-padding: .5rem !default; 294 | 295 | $mark-bg: #fcf8e3 !default; 296 | 297 | $hr-margin-y: $spacer !default; 298 | 299 | 300 | // Tables 301 | // 302 | // Customizes the `.table` component with basic values, each used across all table variations. 303 | 304 | $table-cell-padding: .75rem !default; 305 | $table-cell-padding-sm: .3rem !default; 306 | 307 | $table-bg: transparent !default; 308 | $table-accent-bg: rgba($black, .05) !default; 309 | $table-hover-bg: rgba($black, .075) !default; 310 | $table-active-bg: $table-hover-bg !default; 311 | 312 | $table-border-width: $border-width !default; 313 | $table-border-color: $gray-300 !default; 314 | 315 | $table-head-bg: $gray-200 !default; 316 | $table-head-color: $gray-700 !default; 317 | 318 | $table-dark-bg: $gray-900 !default; 319 | $table-dark-accent-bg: rgba($white, .05) !default; 320 | $table-dark-hover-bg: rgba($white, .075) !default; 321 | $table-dark-border-color: lighten($gray-900, 10%) !default; 322 | $table-dark-color: $body-bg !default; 323 | 324 | 325 | // Buttons + Forms 326 | // 327 | // Shared variables that are reassigned to `$input-` and `$btn-` specific variables. 328 | 329 | $input-btn-padding-y: .375rem !default; 330 | $input-btn-padding-x: .75rem !default; 331 | $input-btn-line-height: $line-height-base !default; 332 | 333 | $input-btn-focus-width: .2rem !default; 334 | $input-btn-focus-color: rgba($component-active-bg, .25) !default; 335 | $input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default; 336 | 337 | $input-btn-padding-y-sm: .25rem !default; 338 | $input-btn-padding-x-sm: .5rem !default; 339 | $input-btn-line-height-sm: $line-height-sm !default; 340 | 341 | $input-btn-padding-y-lg: .5rem !default; 342 | $input-btn-padding-x-lg: 1rem !default; 343 | $input-btn-line-height-lg: $line-height-lg !default; 344 | 345 | $input-btn-border-width: $border-width !default; 346 | 347 | 348 | // Buttons 349 | // 350 | // For each of Bootstrap's buttons, define text, background, and border color. 351 | 352 | $btn-padding-y: $input-btn-padding-y !default; 353 | $btn-padding-x: $input-btn-padding-x !default; 354 | $btn-line-height: $input-btn-line-height !default; 355 | 356 | $btn-padding-y-sm: $input-btn-padding-y-sm !default; 357 | $btn-padding-x-sm: $input-btn-padding-x-sm !default; 358 | $btn-line-height-sm: $input-btn-line-height-sm !default; 359 | 360 | $btn-padding-y-lg: $input-btn-padding-y-lg !default; 361 | $btn-padding-x-lg: $input-btn-padding-x-lg !default; 362 | $btn-line-height-lg: $input-btn-line-height-lg !default; 363 | 364 | $btn-border-width: $input-btn-border-width !default; 365 | 366 | $btn-font-weight: $font-weight-normal !default; 367 | $btn-box-shadow: none !default; 368 | $btn-focus-width: 0 !default; 369 | $btn-focus-box-shadow: none !default; 370 | $btn-disabled-opacity: .65 !default; 371 | $btn-active-box-shadow: none !default; 372 | 373 | $btn-link-disabled-color: $gray-600 !default; 374 | 375 | $btn-block-spacing-y: .5rem !default; 376 | 377 | // Allows for customizing button radius independently from global border radius 378 | $btn-border-radius: $border-radius !default; 379 | $btn-border-radius-lg: $border-radius-lg !default; 380 | $btn-border-radius-sm: $border-radius-sm !default; 381 | 382 | $btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; 383 | 384 | 385 | // Forms 386 | 387 | $input-padding-y: $input-btn-padding-y !default; 388 | $input-padding-x: $input-btn-padding-x !default; 389 | $input-line-height: $input-btn-line-height !default; 390 | 391 | $input-padding-y-sm: $input-btn-padding-y-sm !default; 392 | $input-padding-x-sm: $input-btn-padding-x-sm !default; 393 | $input-line-height-sm: $input-btn-line-height-sm !default; 394 | 395 | $input-padding-y-lg: $input-btn-padding-y-lg !default; 396 | $input-padding-x-lg: $input-btn-padding-x-lg !default; 397 | $input-line-height-lg: $input-btn-line-height-lg !default; 398 | 399 | $input-bg: $white !default; 400 | $input-disabled-bg: $gray-200 !default; 401 | 402 | $input-color: $gray-700 !default; 403 | $input-border-color: $gray-400 !default; 404 | $input-border-width: $input-btn-border-width !default; 405 | $input-box-shadow: inset 0 0 0 rgba($black, 0) !default; 406 | 407 | $input-border-radius: $border-radius !default; 408 | $input-border-radius-lg: $border-radius-lg !default; 409 | $input-border-radius-sm: $border-radius-sm !default; 410 | 411 | $input-focus-bg: $input-bg !default; 412 | $input-focus-border-color: lighten($component-active-bg, 25%) !default; 413 | $input-focus-color: $input-color !default; 414 | $input-focus-width: 0 !default; 415 | $input-focus-box-shadow: none !default; 416 | 417 | $input-placeholder-color: lighten($gray-600, 15%) !default; 418 | 419 | $input-height-border: $input-border-width * 2 !default; 420 | 421 | $input-height-inner: ($font-size-base * $input-btn-line-height) + ($input-btn-padding-y * 2) !default; 422 | $input-height-inner-half: calc(#{$input-line-height * .5em} + #{$input-padding-y}) !default; 423 | $input-height-inner-quarter: calc(#{$input-line-height * .25em} + #{$input-padding-y / 2}) !default; 424 | 425 | $input-height: calc(#{$input-height-inner} + #{$input-height-border}) !default; 426 | 427 | $input-height-inner-sm: ($font-size-sm * $input-btn-line-height-sm) + ($input-btn-padding-y-sm * 2) !default; 428 | $input-height-sm: calc(#{$input-height-inner-sm} + #{$input-height-border}) !default; 429 | 430 | $input-height-inner-lg: ($font-size-lg * $input-btn-line-height-lg) + ($input-btn-padding-y-lg * 2) !default; 431 | $input-height-lg: calc(#{$input-height-inner-lg} + #{$input-height-border}) !default; 432 | 433 | $input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default; 434 | 435 | $form-text-margin-top: .25rem !default; 436 | 437 | $form-check-input-gutter: 1.25rem !default; 438 | $form-check-input-margin-y: .3rem !default; 439 | $form-check-input-margin-x: .25rem !default; 440 | 441 | $form-check-inline-margin-x: .75rem !default; 442 | $form-check-inline-input-margin-x: .3125rem !default; 443 | 444 | $form-group-margin-bottom: 1rem !default; 445 | 446 | $input-group-addon-color: $input-color !default; 447 | $input-group-addon-bg: $gray-200 !default; 448 | $input-group-addon-border-color: $input-border-color !default; 449 | 450 | $custom-control-gutter: .5rem !default; 451 | $custom-control-spacer-x: 1rem !default; 452 | 453 | $custom-control-indicator-size: 1rem !default; 454 | $custom-control-indicator-bg: $gray-300 !default; 455 | $custom-control-indicator-bg-size: 50% 50% !default; 456 | $custom-control-indicator-box-shadow: inset 0 .25rem .25rem rgba($black, .1) !default; 457 | 458 | $custom-control-indicator-disabled-bg: $gray-200 !default; 459 | $custom-control-label-disabled-color: $gray-600 !default; 460 | 461 | $custom-control-indicator-checked-color: $component-active-color !default; 462 | $custom-control-indicator-checked-bg: $component-active-bg !default; 463 | $custom-control-indicator-checked-disabled-bg: rgba(theme-color("primary"), .5) !default; 464 | $custom-control-indicator-checked-box-shadow: none !default; 465 | 466 | $custom-control-indicator-focus-box-shadow: 0 0 0 1px $body-bg, $input-btn-focus-box-shadow !default; 467 | 468 | $custom-control-indicator-active-color: $component-active-color !default; 469 | $custom-control-indicator-active-bg: lighten($component-active-bg, 35%) !default; 470 | $custom-control-indicator-active-box-shadow: none !default; 471 | 472 | $custom-checkbox-indicator-border-radius: $border-radius !default; 473 | $custom-checkbox-indicator-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"), "#", "%23") !default; 474 | 475 | $custom-checkbox-indicator-indeterminate-bg: $component-active-bg !default; 476 | $custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color !default; 477 | $custom-checkbox-indicator-icon-indeterminate: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='#{$custom-checkbox-indicator-indeterminate-color}' d='M0 2h4'/%3E%3C/svg%3E"), "#", "%23") !default; 478 | $custom-checkbox-indicator-indeterminate-box-shadow: none !default; 479 | 480 | $custom-radio-indicator-border-radius: 50% !default; 481 | $custom-radio-indicator-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='#{$custom-control-indicator-checked-color}'/%3E%3C/svg%3E"), "#", "%23") !default; 482 | 483 | $custom-select-padding-y: .375rem !default; 484 | $custom-select-padding-x: .75rem !default; 485 | $custom-select-height: $input-height !default; 486 | $custom-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator 487 | $custom-select-line-height: $input-btn-line-height !default; 488 | $custom-select-color: $input-color !default; 489 | $custom-select-disabled-color: $gray-600 !default; 490 | $custom-select-bg: $white !default; 491 | $custom-select-disabled-bg: $gray-200 !default; 492 | $custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions 493 | $custom-select-indicator-color: $gray-800 !default; 494 | $custom-select-indicator: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"), "#", "%23") !default; 495 | $custom-select-border-width: $input-btn-border-width !default; 496 | $custom-select-border-color: $input-border-color !default; 497 | $custom-select-border-radius: $border-radius !default; 498 | 499 | $custom-select-focus-border-color: $input-focus-border-color !default; 500 | $custom-select-focus-box-shadow: none !default; 501 | 502 | $custom-select-font-size-sm: 75% !default; 503 | $custom-select-height-sm: $input-height-sm !default; 504 | 505 | $custom-select-font-size-lg: 125% !default; 506 | $custom-select-height-lg: $input-height-lg !default; 507 | 508 | $custom-file-height: $input-height !default; 509 | $custom-file-focus-border-color: $input-focus-border-color !default; 510 | $custom-file-focus-box-shadow: $custom-select-focus-box-shadow !default; 511 | 512 | $custom-file-padding-y: $input-btn-padding-y !default; 513 | $custom-file-padding-x: $input-btn-padding-x !default; 514 | $custom-file-line-height: $input-btn-line-height !default; 515 | $custom-file-color: $input-color !default; 516 | $custom-file-bg: $input-bg !default; 517 | $custom-file-border-width: $input-btn-border-width !default; 518 | $custom-file-border-color: $input-border-color !default; 519 | $custom-file-border-radius: $input-border-radius !default; 520 | $custom-file-box-shadow: $custom-select-focus-box-shadow !default; 521 | $custom-file-button-color: $custom-file-color !default; 522 | $custom-file-button-bg: $input-group-addon-bg !default; 523 | $custom-file-text: ( 524 | en: "Browse" 525 | ) !default; 526 | 527 | $custom-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-btn-focus-box-shadow !default; 528 | 529 | 530 | // Form validation 531 | $form-feedback-margin-top: $form-text-margin-top !default; 532 | $form-feedback-font-size: $small-font-size !default; 533 | $form-feedback-valid-color: theme-color("success") !default; 534 | $form-feedback-invalid-color: theme-color("danger") !default; 535 | 536 | 537 | // Dropdowns 538 | // 539 | // Dropdown menu container and contents. 540 | 541 | $dropdown-min-width: 10rem !default; 542 | $dropdown-padding-y: .5rem !default; 543 | $dropdown-spacer: .125rem !default; 544 | $dropdown-bg: $white !default; 545 | $dropdown-border-color: rgba($black, .15) !default; 546 | $dropdown-border-radius: $border-radius !default; 547 | $dropdown-border-width: $border-width !default; 548 | $dropdown-divider-bg: $gray-200 !default; 549 | $dropdown-box-shadow: 0 .5rem 1rem rgba($black, .175) !default; 550 | 551 | $dropdown-link-color: $gray-900 !default; 552 | $dropdown-link-hover-color: darken($gray-900, 5%) !default; 553 | $dropdown-link-hover-bg: $gray-100 !default; 554 | 555 | $dropdown-link-active-color: $component-active-color !default; 556 | $dropdown-link-active-bg: $component-active-bg !default; 557 | 558 | $dropdown-link-disabled-color: $gray-600 !default; 559 | 560 | $dropdown-item-padding-y: .25rem !default; 561 | $dropdown-item-padding-x: 1rem !default; 562 | 563 | $dropdown-header-color: $gray-600 !default; 564 | 565 | 566 | // Z-index master list 567 | // 568 | // Warning: Avoid customizing these values. They're used for a bird's eye view 569 | // of components dependent on the z-axis and are designed to all work together. 570 | 571 | $zindex-dropdown: 1000 !default; 572 | $zindex-sticky: 1020 !default; 573 | $zindex-fixed: 1030 !default; 574 | $zindex-modal-backdrop: 1040 !default; 575 | $zindex-modal: 1050 !default; 576 | $zindex-popover: 1060 !default; 577 | $zindex-tooltip: 1070 !default; 578 | 579 | // Navs 580 | 581 | $nav-link-padding-y: .5rem !default; 582 | $nav-link-padding-x: 1rem !default; 583 | $nav-link-disabled-color: $gray-600 !default; 584 | 585 | $nav-tabs-border-color: $gray-300 !default; 586 | $nav-tabs-border-width: $border-width !default; 587 | $nav-tabs-border-radius: $border-radius !default; 588 | $nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default; 589 | $nav-tabs-link-active-color: $gray-700 !default; 590 | $nav-tabs-link-active-bg: $body-bg !default; 591 | $nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default; 592 | 593 | $nav-pills-border-radius: $border-radius !default; 594 | $nav-pills-link-active-color: $component-active-color !default; 595 | $nav-pills-link-active-bg: $component-active-bg !default; 596 | 597 | // Navbar 598 | 599 | $navbar-padding-y: ($spacer / 2) !default; 600 | $navbar-padding-x: ($spacer / 2) !default; 601 | 602 | $navbar-nav-link-padding-x: 1rem !default; 603 | 604 | $navbar-brand-font-size: $font-size-lg !default; 605 | // Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link 606 | $nav-link-height: ($font-size-base * $line-height-base + $nav-link-padding-y * 2) !default; 607 | $navbar-brand-height: $navbar-brand-font-size * $line-height-base !default; 608 | $navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) / 2 !default; 609 | 610 | $navbar-toggler-padding-y: .25rem !default; 611 | $navbar-toggler-padding-x: .75rem !default; 612 | $navbar-toggler-font-size: $font-size-lg !default; 613 | $navbar-toggler-border-radius: $btn-border-radius !default; 614 | 615 | $navbar-dark-color: rgba($white, .75) !default; 616 | $navbar-dark-hover-color: rgba($white, 1) !default; 617 | $navbar-dark-active-color: $white !default; 618 | $navbar-dark-disabled-color: rgba($white, .25) !default; 619 | $navbar-dark-toggler-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-dark-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"), "#", "%23") !default; 620 | $navbar-dark-toggler-border-color: rgba($white, .1) !default; 621 | 622 | $navbar-light-color: rgba($black, .5) !default; 623 | $navbar-light-hover-color: rgba($black, .7) !default; 624 | $navbar-light-active-color: rgba($black, .9) !default; 625 | $navbar-light-disabled-color: rgba($black, .3) !default; 626 | $navbar-light-toggler-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-light-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"), "#", "%23") !default; 627 | $navbar-light-toggler-border-color: rgba($black, .1) !default; 628 | 629 | // Pagination 630 | 631 | $pagination-padding-y: .5rem !default; 632 | $pagination-padding-x: .75rem !default; 633 | $pagination-padding-y-sm: .25rem !default; 634 | $pagination-padding-x-sm: .5rem !default; 635 | $pagination-padding-y-lg: .75rem !default; 636 | $pagination-padding-x-lg: 1.5rem !default; 637 | $pagination-line-height: 1.25 !default; 638 | 639 | $pagination-color: $link-color !default; 640 | $pagination-bg: $white !default; 641 | $pagination-border-width: $border-width !default; 642 | $pagination-border-color: $gray-300 !default; 643 | 644 | $pagination-focus-box-shadow: $input-btn-focus-box-shadow !default; 645 | 646 | $pagination-hover-color: $link-hover-color !default; 647 | $pagination-hover-bg: $gray-200 !default; 648 | $pagination-hover-border-color: $gray-300 !default; 649 | 650 | $pagination-active-color: $component-active-color !default; 651 | $pagination-active-bg: $component-active-bg !default; 652 | $pagination-active-border-color: $pagination-active-bg !default; 653 | 654 | $pagination-disabled-color: $gray-600 !default; 655 | $pagination-disabled-bg: $white !default; 656 | $pagination-disabled-border-color: $gray-300 !default; 657 | 658 | 659 | // Jumbotron 660 | 661 | $jumbotron-padding: 2rem !default; 662 | $jumbotron-bg: $gray-200 !default; 663 | 664 | 665 | // Cards 666 | 667 | $card-spacer-y: .75rem !default; 668 | $card-spacer-x: 1.25rem !default; 669 | $card-border-width: 0 !default; //$border-width !default; 670 | $card-border-radius: $border-radius !default; 671 | $card-border-color: rgba($black, .125) !default; 672 | $card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width}) !default; 673 | $card-cap-bg: rgba($black, .03) !default; 674 | $card-bg: $white !default; 675 | 676 | $card-img-overlay-padding: 1.25rem !default; 677 | 678 | $card-group-margin: ($grid-gutter-width / 2) !default; 679 | $card-deck-margin: $card-group-margin !default; 680 | 681 | $card-columns-count: 3 !default; 682 | $card-columns-gap: 1.25rem !default; 683 | $card-columns-margin: $card-spacer-y !default; 684 | 685 | 686 | // Tooltips 687 | 688 | $tooltip-font-size: $font-size-sm !default; 689 | $tooltip-max-width: 200px !default; 690 | $tooltip-color: $white !default; 691 | $tooltip-bg: $black !default; 692 | $tooltip-border-radius: $border-radius !default; 693 | $tooltip-opacity: .9 !default; 694 | $tooltip-padding-y: .25rem !default; 695 | $tooltip-padding-x: .5rem !default; 696 | $tooltip-margin: 0 !default; 697 | 698 | $tooltip-arrow-width: .8rem !default; 699 | $tooltip-arrow-height: .4rem !default; 700 | $tooltip-arrow-color: $tooltip-bg !default; 701 | 702 | // Form tooltips must come after regular tooltips 703 | $form-feedback-tooltip-padding-y: $tooltip-padding-y !default; 704 | $form-feedback-tooltip-padding-x: $tooltip-padding-x !default; 705 | $form-feedback-tooltip-font-size: $tooltip-font-size !default; 706 | $form-feedback-tooltip-line-height: $line-height-base !default; 707 | $form-feedback-tooltip-opacity: $tooltip-opacity !default; 708 | $form-feedback-tooltip-border-radius: $tooltip-border-radius !default; 709 | 710 | // Popovers 711 | 712 | $popover-font-size: $font-size-sm !default; 713 | $popover-bg: $white !default; 714 | $popover-max-width: 276px !default; 715 | $popover-border-width: $border-width !default; 716 | $popover-border-color: rgba($black, .2) !default; 717 | $popover-border-radius: $border-radius-lg !default; 718 | $popover-box-shadow: 0 .25rem .5rem rgba($black, .2) !default; 719 | 720 | $popover-header-bg: darken($popover-bg, 3%) !default; 721 | $popover-header-color: $headings-color !default; 722 | $popover-header-padding-y: .5rem !default; 723 | $popover-header-padding-x: .75rem !default; 724 | 725 | $popover-body-color: $body-color !default; 726 | $popover-body-padding-y: $popover-header-padding-y !default; 727 | $popover-body-padding-x: $popover-header-padding-x !default; 728 | 729 | $popover-arrow-width: 1rem !default; 730 | $popover-arrow-height: .5rem !default; 731 | $popover-arrow-color: $popover-bg !default; 732 | 733 | $popover-arrow-outer-color: fade-in($popover-border-color, .05) !default; 734 | 735 | 736 | // Badges 737 | 738 | $badge-font-size: 75% !default; 739 | $badge-font-weight: $font-weight-bold !default; 740 | $badge-padding-y: .25em !default; 741 | $badge-padding-x: .4em !default; 742 | $badge-border-radius: $border-radius !default; 743 | 744 | $badge-pill-padding-x: .6em !default; 745 | // Use a higher than normal value to ensure completely rounded edges when 746 | // customizing padding or font-size on labels. 747 | $badge-pill-border-radius: 10rem !default; 748 | 749 | 750 | // Modals 751 | 752 | // Padding applied to the modal body 753 | $modal-inner-padding: 1rem !default; 754 | 755 | $modal-dialog-margin: .5rem !default; 756 | $modal-dialog-margin-y-sm-up: 1.75rem !default; 757 | 758 | $modal-title-line-height: $line-height-base !default; 759 | 760 | $modal-content-bg: $white !default; 761 | $modal-content-border-color: rgba($black, .2) !default; 762 | $modal-content-border-width: $border-width !default; 763 | $modal-content-box-shadow-xs: 0 .25rem .5rem rgba($black, .5) !default; 764 | $modal-content-box-shadow-sm-up: 0 .5rem 1rem rgba($black, .5) !default; 765 | 766 | $modal-backdrop-bg: $black !default; 767 | $modal-backdrop-opacity: .5 !default; 768 | $modal-header-border-color: $gray-200 !default; 769 | $modal-footer-border-color: $modal-header-border-color !default; 770 | $modal-header-border-width: $modal-content-border-width !default; 771 | $modal-footer-border-width: $modal-header-border-width !default; 772 | $modal-header-padding: 1rem !default; 773 | 774 | $modal-lg: 800px !default; 775 | $modal-md: 500px !default; 776 | $modal-sm: 300px !default; 777 | 778 | $modal-transition: transform .3s ease-out !default; 779 | 780 | 781 | // Alerts 782 | // 783 | // Define alert colors, border radius, and padding. 784 | 785 | $alert-padding-y: .75rem !default; 786 | $alert-padding-x: 1.25rem !default; 787 | $alert-margin-bottom: 1rem !default; 788 | $alert-border-radius: $border-radius !default; 789 | $alert-link-font-weight: $font-weight-bold !default; 790 | $alert-border-width: $border-width !default; 791 | 792 | $alert-bg-level: -10 !default; 793 | $alert-border-level: -9 !default; 794 | $alert-color-level: 6 !default; 795 | 796 | 797 | // Progress bars 798 | 799 | $progress-height: 1rem !default; 800 | $progress-font-size: ($font-size-base * .75) !default; 801 | $progress-bg: $gray-200 !default; 802 | $progress-border-radius: $border-radius !default; 803 | $progress-box-shadow: inset 0 .1rem .1rem rgba($black, .1) !default; 804 | $progress-bar-color: $white !default; 805 | $progress-bar-bg: theme-color("primary") !default; 806 | $progress-bar-animation-timing: 1s linear infinite !default; 807 | $progress-bar-transition: width .6s ease !default; 808 | 809 | // List group 810 | 811 | $list-group-bg: $white !default; 812 | $list-group-border-color: rgba($black, .125) !default; 813 | $list-group-border-width: $border-width !default; 814 | $list-group-border-radius: $border-radius !default; 815 | 816 | $list-group-item-padding-y: .75rem !default; 817 | $list-group-item-padding-x: 1.25rem !default; 818 | 819 | $list-group-hover-bg: $gray-100 !default; 820 | $list-group-active-color: $component-active-color !default; 821 | $list-group-active-bg: $component-active-bg !default; 822 | $list-group-active-border-color: $list-group-active-bg !default; 823 | 824 | $list-group-disabled-color: $gray-600 !default; 825 | $list-group-disabled-bg: $list-group-bg !default; 826 | 827 | $list-group-action-color: $gray-700 !default; 828 | $list-group-action-hover-color: $list-group-action-color !default; 829 | 830 | $list-group-action-active-color: $body-color !default; 831 | $list-group-action-active-bg: $gray-200 !default; 832 | 833 | 834 | // Image thumbnails 835 | 836 | $thumbnail-padding: .25rem !default; 837 | $thumbnail-bg: $body-bg !default; 838 | $thumbnail-border-width: $border-width !default; 839 | $thumbnail-border-color: $gray-300 !default; 840 | $thumbnail-border-radius: $border-radius !default; 841 | $thumbnail-box-shadow: 0 1px 2px rgba($black, .075) !default; 842 | 843 | 844 | // Figures 845 | 846 | $figure-caption-font-size: 90% !default; 847 | $figure-caption-color: $gray-600 !default; 848 | 849 | 850 | // Breadcrumbs 851 | 852 | $breadcrumb-padding-y: .75rem !default; 853 | $breadcrumb-padding-x: 1rem !default; 854 | $breadcrumb-item-padding: .5rem !default; 855 | 856 | $breadcrumb-margin-bottom: 1rem !default; 857 | 858 | $breadcrumb-bg: $gray-200 !default; 859 | $breadcrumb-divider-color: $gray-600 !default; 860 | $breadcrumb-active-color: $gray-600 !default; 861 | $breadcrumb-divider: "/" !default; 862 | 863 | 864 | // Carousel 865 | 866 | $carousel-control-color: $white !default; 867 | $carousel-control-width: 15% !default; 868 | $carousel-control-opacity: .5 !default; 869 | 870 | $carousel-indicator-width: 30px !default; 871 | $carousel-indicator-height: 3px !default; 872 | $carousel-indicator-spacer: 3px !default; 873 | $carousel-indicator-active-bg: $white !default; 874 | 875 | $carousel-caption-width: 70% !default; 876 | $carousel-caption-color: $white !default; 877 | 878 | $carousel-control-icon-width: 20px !default; 879 | 880 | $carousel-control-prev-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E"), "#", "%23") !default; 881 | $carousel-control-next-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E"), "#", "%23") !default; 882 | 883 | $carousel-transition: transform .6s ease !default; 884 | 885 | 886 | // Close 887 | 888 | $close-font-size: $font-size-base * 1.5 !default; 889 | $close-font-weight: $font-weight-bold !default; 890 | $close-color: $black !default; 891 | $close-text-shadow: 0 1px 0 $white !default; 892 | 893 | // Code 894 | 895 | $code-font-size: 87.5% !default; 896 | $code-color: $pink !default; 897 | 898 | $kbd-padding-y: .2rem !default; 899 | $kbd-padding-x: .4rem !default; 900 | $kbd-font-size: $code-font-size !default; 901 | $kbd-color: $white !default; 902 | $kbd-bg: $gray-900 !default; 903 | 904 | $pre-color: $gray-900 !default; 905 | $pre-scrollable-max-height: 340px !default; 906 | 907 | 908 | // Printing 909 | $print-page-size: a3 !default; 910 | $print-body-min-width: map-get($grid-breakpoints, "lg") !default; 911 | -------------------------------------------------------------------------------- /src/styles/variables.scss: -------------------------------------------------------------------------------- 1 | $fa-font-path: "node_modules/@fortawesome/fontawesome-free/webfonts"; 2 | -------------------------------------------------------------------------------- /src/test.ts: -------------------------------------------------------------------------------- 1 | // This file is required by karma.conf.js and loads recursively all the .spec and framework files 2 | 3 | import 'zone.js/dist/zone-testing'; 4 | import { getTestBed } from '@angular/core/testing'; 5 | import { 6 | BrowserDynamicTestingModule, 7 | platformBrowserDynamicTesting 8 | } from '@angular/platform-browser-dynamic/testing'; 9 | 10 | declare const require: { 11 | context(path: string, deep?: boolean, filter?: RegExp): { 12 | keys(): string[]; 13 | (id: string): T; 14 | }; 15 | }; 16 | 17 | // First, initialize the Angular testing environment. 18 | getTestBed().initTestEnvironment( 19 | BrowserDynamicTestingModule, 20 | platformBrowserDynamicTesting() 21 | ); 22 | // Then we find all the tests. 23 | const context = require.context('./', true, /\.spec\.ts$/); 24 | // And load the modules. 25 | context.keys().map(context); 26 | -------------------------------------------------------------------------------- /tsconfig.app.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/app", 5 | "types": [] 6 | }, 7 | "files": [ 8 | "src/main.ts", 9 | "src/polyfills.ts" 10 | ], 11 | "include": [ 12 | "src/**/*.d.ts" 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compileOnSave": false, 3 | "compilerOptions": { 4 | "baseUrl": "./", 5 | "outDir": "./dist/out-tsc", 6 | "sourceMap": true, 7 | "declaration": false, 8 | "downlevelIteration": true, 9 | "experimentalDecorators": true, 10 | "module": "esnext", 11 | "moduleResolution": "node", 12 | "importHelpers": true, 13 | "target": "es2015", 14 | "typeRoots": [ 15 | "node_modules/@types" 16 | ], 17 | "lib": [ 18 | "es2018", 19 | "dom" 20 | ], 21 | "paths": { 22 | "@env": ["src/environments/environment"], 23 | "@shared/*" : ["src/app/shared/*"], 24 | "@core/*" : ["src/app/core/*"] 25 | } 26 | }, 27 | "angularCompilerOptions": { 28 | "fullTemplateTypeCheck": true, 29 | "strictInjectionParameters": true 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /tsconfig.spec.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "outDir": "./out-tsc/spec", 5 | "types": [ 6 | "jasmine", 7 | "node" 8 | ] 9 | }, 10 | "files": [ 11 | "src/test.ts", 12 | "src/polyfills.ts" 13 | ], 14 | "include": [ 15 | "src/**/*.spec.ts", 16 | "src/**/*.d.ts" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "tslint:recommended", 3 | "rules": { 4 | "array-type": false, 5 | "arrow-parens": false, 6 | "deprecation": { 7 | "severity": "warning" 8 | }, 9 | "component-class-suffix": true, 10 | "contextual-lifecycle": true, 11 | "directive-class-suffix": true, 12 | "directive-selector": [ 13 | true, 14 | "attribute", 15 | "app", 16 | "camelCase" 17 | ], 18 | "component-selector": [ 19 | true, 20 | "element", 21 | "app", 22 | "kebab-case" 23 | ], 24 | "import-blacklist": [ 25 | true, 26 | "rxjs/Rx" 27 | ], 28 | "interface-name": false, 29 | "max-classes-per-file": false, 30 | "max-line-length": [ 31 | true, 32 | 140 33 | ], 34 | "member-access": false, 35 | "member-ordering": [ 36 | true, 37 | { 38 | "order": [ 39 | "static-field", 40 | "instance-field", 41 | "static-method", 42 | "instance-method" 43 | ] 44 | } 45 | ], 46 | "no-consecutive-blank-lines": false, 47 | "no-console": [ 48 | true, 49 | "debug", 50 | "info", 51 | "time", 52 | "timeEnd", 53 | "trace" 54 | ], 55 | "no-empty": false, 56 | "no-inferrable-types": [ 57 | true, 58 | "ignore-params" 59 | ], 60 | "no-non-null-assertion": true, 61 | "no-redundant-jsdoc": true, 62 | "no-switch-case-fall-through": true, 63 | "no-var-requires": false, 64 | "object-literal-key-quotes": [ 65 | true, 66 | "as-needed" 67 | ], 68 | "object-literal-sort-keys": false, 69 | "ordered-imports": false, 70 | "quotemark": [ 71 | true, 72 | "single" 73 | ], 74 | "trailing-comma": false, 75 | "no-conflicting-lifecycle": true, 76 | "no-host-metadata-property": true, 77 | "no-input-rename": true, 78 | "no-inputs-metadata-property": true, 79 | "no-output-native": true, 80 | "no-output-on-prefix": true, 81 | "no-output-rename": true, 82 | "no-outputs-metadata-property": true, 83 | "template-banana-in-box": true, 84 | "template-no-negated-async": true, 85 | "use-lifecycle-interface": true, 86 | "use-pipe-transform-interface": true 87 | }, 88 | "rulesDirectory": [ 89 | "codelyzer" 90 | ] 91 | } --------------------------------------------------------------------------------