├── .editorconfig ├── .github └── workflows │ └── CreateRelease.yml ├── .gitignore ├── .npmrc ├── .travis.yml ├── .vscode └── settings.json ├── .yo-rc.json ├── CHANGELOG.md ├── LICENSE ├── README.md ├── demo ├── NorthwindODataConfigurationFactory.ts ├── assets │ ├── components │ │ ├── accordion │ │ │ └── accordion.css │ │ ├── autocomplete │ │ │ └── autocomplete.css │ │ ├── blockui │ │ │ └── blockui.css │ │ ├── breadcrumb │ │ │ └── breadcrumb.css │ │ ├── button │ │ │ └── button.css │ │ ├── calendar │ │ │ └── calendar.css │ │ ├── card │ │ │ └── card.css │ │ ├── carousel │ │ │ └── carousel.css │ │ ├── checkbox │ │ │ └── checkbox.css │ │ ├── chips │ │ │ └── chips.css │ │ ├── colorpicker │ │ │ └── colorpicker.css │ │ ├── common │ │ │ └── common.css │ │ ├── contextmenu │ │ │ └── contextmenu.css │ │ ├── datagrid │ │ │ └── datagrid.css │ │ ├── datalist │ │ │ └── datalist.css │ │ ├── datascroller │ │ │ └── datascroller.css │ │ ├── datatable │ │ │ └── datatable.css │ │ ├── dataview │ │ │ └── dataview.css │ │ ├── dialog │ │ │ └── dialog.css │ │ ├── dropdown │ │ │ └── dropdown.css │ │ ├── fieldset │ │ │ └── fieldset.css │ │ ├── fileupload │ │ │ └── fileupload.css │ │ ├── galleria │ │ │ └── galleria.css │ │ ├── grid │ │ │ └── grid.css │ │ ├── growl │ │ │ └── growl.css │ │ ├── inplace │ │ │ └── inplace.css │ │ ├── inputswitch │ │ │ └── inputswitch.css │ │ ├── inputtext │ │ │ └── inputtext.css │ │ ├── inputtextarea │ │ │ └── inputtextarea.css │ │ ├── lightbox │ │ │ └── lightbox.css │ │ ├── listbox │ │ │ └── listbox.css │ │ ├── megamenu │ │ │ └── megamenu.css │ │ ├── menu │ │ │ └── menu.css │ │ ├── menubar │ │ │ └── menubar.css │ │ ├── message │ │ │ └── message.css │ │ ├── messages │ │ │ └── messages.css │ │ ├── multiselect │ │ │ └── multiselect.css │ │ ├── orderlist │ │ │ └── orderlist.css │ │ ├── organizationchart │ │ │ └── organizationchart.css │ │ ├── overlaypanel │ │ │ └── overlaypanel.css │ │ ├── paginator │ │ │ └── paginator.css │ │ ├── panel │ │ │ └── panel.css │ │ ├── panelmenu │ │ │ └── panelmenu.css │ │ ├── password │ │ │ └── password.css │ │ ├── picklist │ │ │ └── picklist.css │ │ ├── progressbar │ │ │ └── progressbar.css │ │ ├── progressspinner │ │ │ └── progressspinner.css │ │ ├── radiobutton │ │ │ └── radiobutton.css │ │ ├── rating │ │ │ └── rating.css │ │ ├── schedule │ │ │ └── schedule.css │ │ ├── scrollpanel │ │ │ └── scrollpanel.css │ │ ├── selectbutton │ │ │ └── selectbutton.css │ │ ├── sidebar │ │ │ └── sidebar.css │ │ ├── slidemenu │ │ │ └── slidemenu.css │ │ ├── slider │ │ │ └── slider.css │ │ ├── spinner │ │ │ └── spinner.css │ │ ├── splitbutton │ │ │ └── splitbutton.css │ │ ├── steps │ │ │ └── steps.css │ │ ├── table │ │ │ └── table.css │ │ ├── tabmenu │ │ │ └── tabmenu.css │ │ ├── tabview │ │ │ └── tabview.css │ │ ├── terminal │ │ │ └── terminal.css │ │ ├── tieredmenu │ │ │ └── tieredmenu.css │ │ ├── toast │ │ │ └── toast.css │ │ ├── toolbar │ │ │ └── toolbar.css │ │ ├── tooltip │ │ │ └── tooltip.css │ │ ├── tree │ │ │ └── tree.css │ │ └── treetable │ │ │ └── treetable.css │ ├── fonts │ │ ├── primeicons.eot │ │ ├── primeicons.svg │ │ ├── primeicons.ttf │ │ └── primeicons.woff │ ├── images │ │ ├── color.png │ │ ├── hue.png │ │ ├── line.gif │ │ ├── loading.gif │ │ └── password-meter.png │ ├── primeicons.css │ ├── primeng.css │ ├── primeng.min.css │ ├── readme.txt │ └── themes │ │ ├── _theme.scss │ │ ├── bootstrap │ │ └── theme.css │ │ ├── cruze │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── cupertino │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── darkness │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── flick │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── home │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── kasper │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── lightness │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── ludvig │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── omega │ │ ├── fonts │ │ │ ├── roboto-v15-latin-regular.eot │ │ │ ├── roboto-v15-latin-regular.svg │ │ │ ├── roboto-v15-latin-regular.ttf │ │ │ ├── roboto-v15-latin-regular.woff │ │ │ └── roboto-v15-latin-regular.woff2 │ │ ├── images │ │ │ ├── icons_16.png │ │ │ ├── slider_handles.png │ │ │ ├── slider_handles@2x.png │ │ │ ├── ui-bg_flat_0_aaaaaa_40x100.png │ │ │ ├── ui-bg_flat_75_ffffff_40x100.png │ │ │ ├── ui-bg_glass_55_fbf9ee_1x400.png │ │ │ ├── ui-bg_glass_65_ffffff_1x400.png │ │ │ ├── ui-bg_glass_75_dadada_1x400.png │ │ │ ├── ui-bg_glass_75_e6e6e6_1x400.png │ │ │ ├── ui-bg_glass_95_fef1ec_1x400.png │ │ │ ├── ui-bg_highlight-soft_75_cccccc_1x100.png │ │ │ ├── ui-icons_222222_256x240.png │ │ │ ├── ui-icons_2e83ff_256x240.png │ │ │ ├── ui-icons_454545_256x240.png │ │ │ ├── ui-icons_cd0a0a_256x240.png │ │ │ └── ui-icons_ffffff_256x240.png │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── pepper-grinder │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── redmond │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── rocket │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── south-street │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── start │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ ├── trontastic │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss │ │ └── voclain │ │ ├── theme.css │ │ ├── theme.css.map │ │ └── theme.scss ├── demo.component.ts ├── demo.js ├── demo.js.map ├── demo.module.ts ├── employeeGridOData.component.html ├── employeeGridOData.component.ts ├── entry.ts └── index.html ├── docs ├── classes │ ├── DeleteOperation.html │ ├── GetOperation.html │ ├── KeyConfigs.html │ ├── ODataOperation.html │ ├── ODataPagedResult.html │ ├── ODataQuery.html │ ├── ODataService.html │ ├── ODataUtils.html │ ├── OperationWithEntity.html │ ├── OperationWithKey.html │ ├── OperationWithKeyAndEntity.html │ ├── PatchOperation.html │ ├── PostOperation.html │ └── PutOperation.html ├── fonts │ ├── FontAwesome.otf │ ├── fontawesome-webfont.eot │ ├── fontawesome-webfont.svg │ ├── fontawesome-webfont.ttf │ ├── fontawesome-webfont.woff │ ├── fontawesome-webfont.woff2 │ ├── roboto-v15-latin-300.eot │ ├── roboto-v15-latin-300.svg │ ├── roboto-v15-latin-300.ttf │ ├── roboto-v15-latin-300.woff │ ├── roboto-v15-latin-300.woff2 │ ├── roboto-v15-latin-700.eot │ ├── roboto-v15-latin-700.svg │ ├── roboto-v15-latin-700.ttf │ ├── roboto-v15-latin-700.woff │ ├── roboto-v15-latin-700.woff2 │ ├── roboto-v15-latin-regular.eot │ ├── roboto-v15-latin-regular.svg │ ├── roboto-v15-latin-regular.ttf │ ├── roboto-v15-latin-regular.woff │ └── roboto-v15-latin-regular.woff2 ├── images │ ├── compodoc-vectorise-inverted.svg │ ├── compodoc-vectorise.svg │ ├── compodoc.png │ ├── compodoc.svg │ └── favicon.ico ├── index.html ├── injectables │ ├── ODataConfiguration.html │ └── ODataServiceFactory.html ├── interfaces │ └── IODataResponseModel.html ├── js │ ├── compodoc.js │ ├── libs │ │ ├── EventDispatcher.js │ │ ├── bootstrap-native.js │ │ ├── es6-shim.min.js │ │ ├── highlight.pack.js │ │ ├── highlightjs-line-numbers.min.js │ │ ├── promise.min.js │ │ ├── svg-pan-zoom.min.js │ │ └── zepto.min.js │ ├── menu.js │ ├── search │ │ ├── lunr.min.js │ │ ├── search-engine.js │ │ ├── search-lunr.js │ │ ├── search.js │ │ └── search_index.js │ └── svg-pan-zoom.controls.js ├── modules.html ├── modules │ └── AngularODataModule.html ├── overview.html └── styles │ ├── bootstrap-card.css │ ├── bootstrap.min.css │ ├── compodoc.css │ ├── font-awesome.min.css │ ├── laravel.css │ ├── monokai-sublime.css │ ├── original.css │ ├── postmark.css │ ├── readthedocs.css │ ├── reset.css │ ├── stripe.css │ ├── style.css │ └── vagrant.css ├── karma.conf.ts ├── package-lock.json ├── package.json ├── src ├── angularOData.module.ts ├── angularODataConfiguration.ts ├── angularODataEnums.ts ├── angularODataOperation.ts ├── angularODataPagedResult.ts ├── angularODataQuery.ts ├── angularODataResponseModel.ts ├── angularODataService.ts ├── angularODataServiceFactory.ts ├── angularODataUtils.ts └── index.ts ├── test ├── angularODataConfiguration.spec.ts ├── angularODataOperation.spec.ts ├── angularODataQuery.spec.ts ├── angularODataService.spec.ts ├── angularODataUtils.spec.ts ├── entry.ts └── helpers │ ├── employee.ts │ ├── employeeBuilder.ts │ ├── httpHeadersMatcher.ts │ ├── httpOptionsMatcher.ts │ ├── httpResponseEmployeeBuilder.ts │ ├── jasmineAsymmetricMatcher.ts │ └── order.ts ├── tsconfig-compodoc.json ├── tsconfig-ngc.json ├── tsconfig.json ├── tslint.json ├── way-of-working.txt ├── webpack.config.ts └── webpack.config.umd.ts /.editorconfig: -------------------------------------------------------------------------------- 1 | # editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true 11 | 12 | [*.md] 13 | trim_trailing_whitespace = false 14 | -------------------------------------------------------------------------------- /.github/workflows/CreateRelease.yml: -------------------------------------------------------------------------------- 1 | name: CreateRelease 2 | 3 | on: 4 | push: 5 | tags: 6 | - "*.*.*" 7 | 8 | jobs: 9 | build: 10 | runs-on: ubuntu-latest 11 | steps: 12 | - name: Checkout 13 | uses: actions/checkout@v2 14 | - name: Release 15 | uses: softprops/action-gh-release@v1 16 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .idea/ 2 | .DS_Store 3 | node_modules/ 4 | coverage/ 5 | npm-debug.log 6 | dist/ 7 | /.vs 8 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | save-prefix=^ -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | 3 | node_js: 4 | - '8' 5 | 6 | script: npm test 7 | 8 | notifications: 9 | email: false 10 | 11 | cache: 12 | directories: 13 | - node_modules 14 | 15 | after_success: 16 | - npm run codecov -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "vsicons.presets.angular": true 3 | } -------------------------------------------------------------------------------- /.yo-rc.json: -------------------------------------------------------------------------------- 1 | { 2 | "generator-angular-library": { 3 | "githubUsername": "StefH", 4 | "githubRepoName": "angular-odata-es5", 5 | "npmModuleName": "angular-odata-es5", 6 | "moduleGlobal": "AngularODataES5", 7 | "ngModuleName": "AngularODataModule", 8 | "selectorPrefix": "ao", 9 | "projectTitle": "Angular OData Library (es5)", 10 | "projectDescription": "... todo ...", 11 | "authorName": "Stef Heyenrath" 12 | } 13 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017 Stef Heyenrath 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Angular OData Library (es5) 2 | 3 | [![Greenkeeper badge](https://badges.greenkeeper.io/StefH/angular-odata-es5.svg)](https://greenkeeper.io/) 4 | [![Build Status](https://travis-ci.org/StefH/angular-odata-es5.svg?branch=master)](https://travis-ci.org/StefH/angular-odata-es5) 5 | [![codecov](https://codecov.io/gh/StefH/angular-odata-es5/branch/master/graph/badge.svg)](https://codecov.io/gh/StefH/angular-odata-es5) 6 | [![npm version](https://badge.fury.io/js/angular-odata-es5.svg)](http://badge.fury.io/js/angular-odata-es5) 7 | 8 | ## Demo 9 | https://StefH.github.io/angular-odata-es5/demo/ 10 | 11 | ## Table of contents 12 | 13 | - [About](#about) 14 | - [Installation](#installation) 15 | - [Usage example](#usage) 16 | - [Documentation](#documentation) 17 | - [Development](#development) 18 | 19 | ## About 20 | 21 | The goal is to create a fluent API for querying, creating, updating and deleting OData resources in Angular > 2. 22 | Note that this library targets 'es5' so that Uglify will work correctly. 23 | 24 | ## Installation 25 | 26 | Install through npm: 27 | ``` 28 | npm install --save angular-odata-es5 29 | ``` 30 | 31 | ## Usage 32 | 33 | ``` typescript 34 | import { ODataConfiguration, ODataServiceFactory, ODataService } from "angular-odata-es5"; 35 | import { bootstrap } from "@angular/platform/browser"; 36 | 37 | @Injectable() 38 | class MyODataConfig extends ODataConfiguration{ 39 | baseUrl="http://localhost:54872/odata/"; 40 | } 41 | 42 | bootstrap(app, [ 43 | provide(ODataConfiguration, { useClass:MyODataConfig }), 44 | ODataServiceFactory, 45 | ] 46 | 47 | //An example model interface 48 | interface INotification { 49 | Id: number; 50 | CommentId: number; 51 | Comment: IComment; 52 | FromId: number; 53 | From: IResource; 54 | Priority: number; 55 | SendDate: Date; 56 | IsArchived: boolean; 57 | Text: string; 58 | } 59 | 60 | //An example component 61 | @Component({ 62 | ... 63 | }) 64 | export class NotyListComponent { 65 | private odata: ODataService; 66 | constructor(private odataFactory: ODataServiceFactory, ...) { 67 | this.odata = this.odataFactory.CreateService("notification"); 68 | } 69 | 70 | getOneNoty(id: number) { 71 | this.odata.Get(id).Select("Id,Text").Expand("From,To").Exec() 72 | .subscribe( 73 | singleNoty => {...}, 74 | error => {...} 75 | ); 76 | } 77 | 78 | getNotys(){ 79 | this.odata 80 | .Query() //Creates a query object 81 | .Top(this.top) 82 | .Skip(this.skip) 83 | .Expand('Comment, From') 84 | .OrderBy('SendDate desc') 85 | .Filter(this.filterString) 86 | .Exec() //Fires the request 87 | .subscribe( //Subscribes to Observable> 88 | notys => { 89 | this.notys = notys; //Do something with the result 90 | }, 91 | error => { 92 | ... //Local error handler 93 | }); 94 | 95 | } 96 | } 97 | ``` 98 | 99 | You may also find it useful to view the [demo source](https://github.com/StefH/angular-odata-es5/blob/master/demo/demo.component.ts). 100 | 101 | ### Usage without a module bundler 102 | ``` javascript 103 | 104 | 107 | ``` 108 | 109 | ## Documentation 110 | All documentation is auto-generated from the source via [compodoc](https://compodoc.github.io/compodoc/) and can be viewed here: 111 | https://StefH.github.io/angular-odata-es5/docs/ 112 | 113 | ## Development 114 | 115 | ### Prepare your environment 116 | * Install [Node.js](http://nodejs.org/) and NPM (should come with) 117 | * Install local dev dependencies: `npm install` while current directory is this repo 118 | 119 | ### Development server 120 | Run `npm start` to start a development server on port 8000 with auto reload + tests. 121 | 122 | ### Testing 123 | Run `npm test` to run tests once or `npm run test:watch` to continually run tests. 124 | -------------------------------------------------------------------------------- /demo/NorthwindODataConfigurationFactory.ts: -------------------------------------------------------------------------------- 1 | import { HttpHeaders } from '@angular/common/http'; 2 | 3 | import { ODataConfiguration } from '../src/index'; 4 | 5 | export class NorthwindODataConfigurationFactory { 6 | 7 | constructor() { 8 | const config = new ODataConfiguration(); 9 | config.baseUrl = 'https://odatateststef.azurewebsites.net/odata'; 10 | 11 | // Set some new `customRequestOptions` here as an example 12 | config.customRequestOptions.headers = new HttpHeaders({ 13 | 'Content-Type': 'application/json; charset=utf-8', 14 | 'Session': '123' 15 | }); 16 | 17 | return config; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /demo/assets/components/accordion/accordion.css: -------------------------------------------------------------------------------- 1 | .ui-accordion { 2 | width: 100%; 3 | } 4 | 5 | .ui-accordion .ui-accordion-header { 6 | cursor: pointer; 7 | position: relative; 8 | margin-top: 1px; 9 | zoom: 1; 10 | } 11 | 12 | .ui-accordion .ui-accordion-header a { 13 | display: block; 14 | padding: .5em; 15 | } 16 | 17 | .ui-accordion .ui-accordion-content { 18 | padding: 1em; 19 | border-top: 0; 20 | overflow: visible; 21 | zoom: 1; 22 | } 23 | 24 | .ui-accordion .ui-accordion-header.ui-state-disabled, 25 | .ui-accordion .ui-accordion-header.ui-state-disabled a { 26 | cursor: default; 27 | } 28 | 29 | .ui-accordion-content-wrapper-overflown { 30 | overflow: hidden; 31 | } 32 | 33 | .ui-rtl .ui-accordion .ui-accordion-header a { 34 | padding: .5em 2em .5em .5em; 35 | } 36 | 37 | .ui-rtl .ui-accordion .ui-accordion-toggle-icon { 38 | left: initial; 39 | right: .5em; 40 | } 41 | 42 | .ui-rtl .ui-accordion .ui-accordion-toggle-icon.pi-caret-right:before { 43 | content: '\e904'; 44 | } -------------------------------------------------------------------------------- /demo/assets/components/autocomplete/autocomplete.css: -------------------------------------------------------------------------------- 1 | .ui-autocomplete { 2 | width: auto; 3 | zoom: 1; 4 | cursor: pointer; 5 | -moz-box-shadow: none; 6 | -webkit-box-shadow: none; 7 | box-shadow: none; 8 | position: relative; 9 | display: inline-block; 10 | } 11 | 12 | .ui-autocomplete .ui-autocomplete-dropdown { 13 | height: 100%; 14 | width: 2em; 15 | margin-right: 0; 16 | vertical-align: top; 17 | } 18 | 19 | .ui-autocomplete .ui-autocomplete-input { 20 | padding-right: 1.5em; 21 | } 22 | 23 | .ui-autocomplete-loader { 24 | position: absolute; 25 | right: .25em; 26 | top: 50%; 27 | margin-top: -.5em; 28 | } 29 | 30 | .ui-autocomplete-query { 31 | font-weight: bold; 32 | } 33 | 34 | .ui-autocomplete .ui-autocomplete-panel { 35 | min-width: 100%; 36 | } 37 | 38 | .ui-autocomplete-panel { 39 | position: absolute; 40 | overflow: auto; 41 | } 42 | 43 | .ui-autocomplete-panel .ui-autocomplete-list { 44 | padding: 0.4em; 45 | border: 0 none; 46 | } 47 | 48 | .ui-autocomplete-panel .ui-autocomplete-list-item { 49 | border: 0 none; 50 | cursor: pointer; 51 | font-weight: normal; 52 | margin: 1px 0; 53 | padding: 0.186em 0.313em; 54 | text-align: left; 55 | } 56 | 57 | .ui-autocomplete .ui-button-icon-only, 58 | .ui-autocomplete .ui-button-icon-only:enabled:hover, 59 | .ui-autocomplete .ui-button-icon-only:enabled:focus, 60 | .ui-autocomplete .ui-button-icon-only:enabled:active { 61 | border-left: 0 none; 62 | } 63 | 64 | /* Multiple Selection */ 65 | .ui-autocomplete-multiple-container { 66 | display: inline-block; 67 | vertical-align: middle; 68 | } 69 | 70 | .ui-autocomplete-multiple-container.ui-inputtext { 71 | clear: left; 72 | cursor: text; 73 | list-style-type: none; 74 | margin: 0; 75 | overflow: hidden; 76 | padding: 0 1.5em 0 .25em; 77 | } 78 | 79 | .ui-autocomplete-token { 80 | cursor: default; 81 | display: inline-block; 82 | vertical-align: middle; 83 | overflow: hidden; 84 | padding: .125em .5em; 85 | white-space: nowrap; 86 | position: relative; 87 | margin-right: .125em; 88 | border: 0 none; 89 | font-size: .9em; 90 | } 91 | 92 | .ui-autocomplete-token-label { 93 | display: block; 94 | margin-right: 2em; 95 | } 96 | 97 | .ui-autocomplete-token-icon { 98 | margin-top: -.5em; 99 | position: absolute; 100 | right: 0.2em; 101 | top: 50%; 102 | cursor: pointer; 103 | } 104 | 105 | .ui-autocomplete-input-token { 106 | display: inline-block; 107 | vertical-align: middle; 108 | list-style-type: none; 109 | margin: 0 0 0 .125em; 110 | padding: .25em .25em .25em 0; 111 | } 112 | 113 | .ui-autocomplete-input-token input { 114 | border: 0 none; 115 | width: 10em; 116 | outline: medium none; 117 | background-color: transparent; 118 | margin: 0; 119 | padding: 0; 120 | box-shadow: none; 121 | -moz-border-radius: 0; 122 | -webkit-border-radius: 0; 123 | border-radius: 0; 124 | } 125 | 126 | .ui-autocomplete-dd .ui-autocomplete-loader { 127 | right: 2.25em; 128 | } 129 | 130 | .ui-autocomplete-dd input.ui-corner-all , 131 | .ui-autocomplete-dd .ui-autocomplete-multiple-container.ui-corner-all { 132 | -moz-border-radius-topright: 0px; 133 | -webkit-border-top-right-radius: 0px; 134 | border-top-right-radius: 0px; 135 | -moz-border-radius-bottomright: 0px; 136 | -webkit-border-bottom-right-radius: 0px; 137 | border-bottom-right-radius: 0px; 138 | } 139 | 140 | .ui-autocomplete-dd .ui-autocomplete-dropdown.ui-corner-all { 141 | -moz-border-radius-topleft: 0px; 142 | -webkit-border-top-left-radius: 0px; 143 | border-top-left-radius: 0px; 144 | -moz-border-radius-bottomleft: 0px; 145 | -webkit-border-bottom-left-radius: 0px; 146 | border-bottom-left-radius: 0px; 147 | } 148 | 149 | /** AutoComplete **/ 150 | .ui-fluid p-autocomplete, 151 | .ui-fluid .ui-autocomplete, 152 | .ui-fluid .ui-autocomplete-input { 153 | width: 100%; 154 | } 155 | 156 | .ui-fluid .ui-autocomplete.ui-autocomplete-dd .ui-autocomplete-input, 157 | .ui-fluid .ui-autocomplete.ui-autocomplete-dd .ui-autocomplete-multiple-container { 158 | width: calc(100% - 2em); 159 | } 160 | 161 | .ui-fluid .ui-autocomplete .ui-autocomplete-dropdown.ui-button { 162 | width: 2em; 163 | } 164 | -------------------------------------------------------------------------------- /demo/assets/components/blockui/blockui.css: -------------------------------------------------------------------------------- 1 | .ui-blockui { 2 | position: absolute; 3 | top: 0; 4 | left: 0; 5 | width: 100%; 6 | height: 100%; 7 | } 8 | 9 | .ui-blockui-document { 10 | position: fixed; 11 | } -------------------------------------------------------------------------------- /demo/assets/components/breadcrumb/breadcrumb.css: -------------------------------------------------------------------------------- 1 | /** Breadcrumb **/ 2 | .ui-breadcrumb { 3 | margin: 0; 4 | padding: 0; 5 | padding: .5em; 6 | } 7 | 8 | .ui-breadcrumb ul { 9 | margin: 0; 10 | padding: 0; 11 | } 12 | 13 | .ui-breadcrumb ul li { 14 | display: inline-block; 15 | vertical-align: middle; 16 | margin: 0 .25em; 17 | } 18 | 19 | .ui-breadcrumb ul li .ui-menuitem-link { 20 | text-decoration: none; 21 | vertical-align: middle; 22 | } 23 | 24 | .ui-breadcrumb .ui-menuitem-icon { 25 | margin-right: .25em; 26 | vertical-align: middle; 27 | } 28 | 29 | .ui-breadcrumb .ui-menuitem-text { 30 | vertical-align: middle; 31 | } 32 | -------------------------------------------------------------------------------- /demo/assets/components/card/card.css: -------------------------------------------------------------------------------- 1 | .ui-card-header img { 2 | width: 100%; 3 | } 4 | 5 | .ui-card-body { 6 | padding: 1em; 7 | } 8 | 9 | .ui-card-title { 10 | font-size: 1.5em; 11 | font-weight: bold; 12 | margin-bottom: .5em; 13 | } 14 | 15 | .ui-card-subtitle { 16 | opacity: .7; 17 | margin-bottom: .5em; 18 | margin-top: -.25em; 19 | font-weight: bold; 20 | } 21 | 22 | .ui-card-footer { 23 | padding-top: 1em; 24 | } 25 | 26 | .ui-card-shadow { 27 | box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12); 28 | -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12); 29 | -moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12); 30 | } -------------------------------------------------------------------------------- /demo/assets/components/carousel/carousel.css: -------------------------------------------------------------------------------- 1 | .ui-carousel { 2 | position: relative; 3 | padding: .063em; 4 | } 5 | 6 | .ui-carousel .ui-carousel-viewport .ui-carousel-items { 7 | list-style: none outside none; 8 | margin: 0; 9 | padding:0; 10 | position: relative; 11 | width: 32000px; 12 | left: 0; 13 | } 14 | 15 | .ui-carousel .ui-carousel-viewport .ui-carousel-items .ui-carousel-item { 16 | margin: 1px; 17 | padding: 0; 18 | float: left; 19 | box-sizing: border-box; 20 | } 21 | 22 | .ui-carousel .ui-carousel-viewport { 23 | overflow: hidden; 24 | position: relative; 25 | border: 0; 26 | } 27 | 28 | .ui-carousel .ui-carousel-footer { 29 | margin: 1px 1px 0px 1px; 30 | padding: .5em; 31 | overflow: hidden; 32 | } 33 | 34 | .ui-carousel .ui-carousel-header { 35 | margin: 0 1px; 36 | overflow: hidden; 37 | padding: .625em; 38 | } 39 | 40 | .ui-carousel .ui-carousel-header .ui-carousel-header-title { 41 | display: inline-block; 42 | overflow: hidden; 43 | } 44 | 45 | .ui-carousel .ui-carousel-dropdown, 46 | .ui-carousel .ui-carousel-mobiledropdown { 47 | float: right; 48 | margin: 0px .625em; 49 | background-image: none; 50 | } 51 | 52 | .ui-carousel .ui-carousel-dropdown option, 53 | .ui-carousel .ui-carousel-mobiledropdown option{ 54 | background-image: none; 55 | border: 0 none; 56 | box-shadow: none; 57 | -moz-box-shadow: none; 58 | -webkit-box-shadow: none; 59 | } 60 | 61 | .ui-carousel .ui-carousel-button { 62 | float: right; 63 | margin: .125em; 64 | } 65 | 66 | .ui-carousel .ui-carousel-page-link { 67 | float: left; 68 | margin: 0 .125em; 69 | text-decoration: none; 70 | } 71 | 72 | .ui-carousel .ui-carousel-page-link, 73 | .ui-carousel .ui-carousel-button { 74 | cursor: pointer; 75 | } 76 | 77 | .ui-carousel .ui-carousel-page-links { 78 | margin: 0px .5em; 79 | margin-top: .125em; 80 | float: right; 81 | } 82 | 83 | .ui-carousel .ui-carousel-mobiledropdown { 84 | display: none; 85 | } -------------------------------------------------------------------------------- /demo/assets/components/checkbox/checkbox.css: -------------------------------------------------------------------------------- 1 | .ui-chkbox { 2 | display: inline-block; 3 | cursor: pointer; 4 | vertical-align: middle; 5 | margin-right: .25em; 6 | } 7 | 8 | .ui-chkbox .ui-chkbox-box { 9 | width: 1.125em; 10 | height: 1.125em; 11 | line-height: 1.125em; 12 | -moz-border-radius: 2px; 13 | -webkit-border-radius: 2px; 14 | border-radius: 2px; 15 | text-align: center; 16 | } 17 | 18 | .ui-chkbox .ui-chkbox-icon { 19 | display: block; 20 | } 21 | 22 | .ui-chkbox-label { 23 | vertical-align: middle; 24 | } 25 | 26 | -------------------------------------------------------------------------------- /demo/assets/components/chips/chips.css: -------------------------------------------------------------------------------- 1 | .ui-chips > ul.ui-inputtext { 2 | clear: left; 3 | cursor: text; 4 | list-style-type: none; 5 | margin: 0; 6 | overflow: hidden; 7 | padding: 0 .25em; 8 | } 9 | 10 | .ui-chips-token { 11 | cursor: default; 12 | display: inline-block; 13 | vertical-align: middle; 14 | overflow: hidden; 15 | padding: .125em .5em; 16 | white-space: nowrap; 17 | position: relative; 18 | margin-right: .125em; 19 | border: 0 none; 20 | font-size: .9em; 21 | } 22 | 23 | .ui-chips-token .ui-chips-token-label { 24 | display: block; 25 | margin-right: 2em; 26 | } 27 | 28 | .ui-chips > .ui-state-disabled .ui-chips-token-label { 29 | margin-right: 0; 30 | } 31 | 32 | .ui-chips-token .ui-chips-token-icon { 33 | margin-top: -.5em; 34 | position: absolute; 35 | right: 0.2em; 36 | top: 50%; 37 | cursor: pointer; 38 | } 39 | 40 | .ui-chips-input-token { 41 | display: inline-block; 42 | vertical-align: middle; 43 | list-style-type: none; 44 | margin: 0 0 0 .125em; 45 | padding: .25em .25em .25em 0; 46 | } 47 | 48 | .ui-chips-input-token input { 49 | border: 0 none; 50 | width: 10em; 51 | outline: medium none; 52 | background-color: transparent; 53 | margin: 0; 54 | padding: 0; 55 | box-shadow: none; 56 | -moz-border-radius: 0; 57 | -webkit-border-radius: 0; 58 | border-radius: 0; 59 | } -------------------------------------------------------------------------------- /demo/assets/components/colorpicker/colorpicker.css: -------------------------------------------------------------------------------- 1 | .ui-colorpicker { 2 | display: inline-block; 3 | } 4 | 5 | .ui-colorpicker-dragging { 6 | cursor: pointer; 7 | } 8 | 9 | .ui-colorpicker-overlay { 10 | position: relative; 11 | } 12 | 13 | .ui-colorpicker-panel { 14 | position: relative; 15 | width: 193px; 16 | height: 166px; 17 | background-color: #323232; 18 | border-color: #191919; 19 | } 20 | 21 | .ui-colorpicker-overlay-panel { 22 | position: absolute; 23 | } 24 | 25 | .ui-colorpicker-preview { 26 | width: 2em; 27 | cursor: pointer; 28 | } 29 | 30 | .ui-colorpicker-panel .ui-colorpicker-content { 31 | position: relative; 32 | } 33 | 34 | .ui-colorpicker-panel .ui-colorpicker-color-selector { 35 | width: 150px; 36 | height: 150px; 37 | top: 8px; 38 | left: 8px; 39 | position: absolute; 40 | } 41 | 42 | .ui-colorpicker-panel .ui-colorpicker-color { 43 | width: 150px; 44 | height: 150px; 45 | background: transparent url("./images/color.png") no-repeat left top; 46 | } 47 | 48 | .ui-colorpicker-panel .ui-colorpicker-color-handle { 49 | position: absolute; 50 | top: 0px; 51 | left: 150px; 52 | border-radius: 100%; 53 | width: 10px; 54 | height: 10px; 55 | border: 1px solid #ffffff; 56 | margin: -5px 0 0 -5px; 57 | cursor: pointer; 58 | } 59 | 60 | .ui-colorpicker-panel .ui-colorpicker-hue { 61 | background: transparent url("./images/hue.png") no-repeat left top; 62 | width: 17px; 63 | height: 150px; 64 | top: 8px; 65 | left: 167px; 66 | position: absolute; 67 | opacity: .85; 68 | } 69 | 70 | .ui-colorpicker-panel .ui-colorpicker-hue-handle { 71 | position: absolute; 72 | top: 150px; 73 | left: 0px; 74 | width: 21px; 75 | margin-left: -2px; 76 | margin-top: -5px; 77 | height: 10px; 78 | border: 2px solid #ffffff; 79 | opacity: .85; 80 | cursor: pointer; 81 | } 82 | 83 | .ui-colorpicker-panel.ui-state-disabled .ui-colorpicker-hue-handle, 84 | .ui-colorpicker-panel.ui-state-disabled .ui-colorpicker-color-handle { 85 | opacity: .5; 86 | } -------------------------------------------------------------------------------- /demo/assets/components/common/common.css: -------------------------------------------------------------------------------- 1 | .ui-widget, .ui-widget * { 2 | box-sizing: border-box; 3 | } 4 | .ui-helper-hidden { 5 | display: none !important; 6 | } 7 | .ui-helper-hidden-accessible { 8 | border: 0; 9 | clip: rect(0 0 0 0); 10 | height: 1px; 11 | margin: -1px; 12 | overflow: hidden; 13 | padding: 0; 14 | position: absolute; 15 | width: 1px; 16 | } 17 | .ui-helper-hidden-accessible input, 18 | .ui-helper-hidden-accessible select { 19 | transform: scale(0); 20 | } 21 | .ui-helper-reset { 22 | margin: 0; 23 | padding: 0; 24 | border: 0; 25 | outline: 0; 26 | line-height: 1.3; 27 | text-decoration: none; 28 | font-size: 100%; 29 | list-style: none; 30 | } 31 | .ui-helper-clearfix::before, 32 | .ui-helper-clearfix::after { 33 | content: ""; 34 | display: table; 35 | } 36 | .ui-helper-clearfix::after { 37 | clear: both; 38 | } 39 | .ui-helper-clearfix { 40 | zoom: 1; 41 | } 42 | .ui-helper-zfix { 43 | width: 100%; 44 | height: 100%; 45 | top: 0; 46 | left: 0; 47 | position: absolute; 48 | opacity: 0; 49 | filter: Alpha(Opacity=0); 50 | } 51 | .ui-state-disabled { 52 | cursor: default !important; 53 | } 54 | .ui-state-disabled a { 55 | cursor: default !important; 56 | } 57 | .ui-icon { 58 | display: block; 59 | text-indent: -99999px; 60 | overflow: hidden; 61 | background-repeat: no-repeat; 62 | } 63 | .ui-widget-overlay { 64 | position: absolute; 65 | top: 0; 66 | left: 0; 67 | width: 100%; 68 | height: 100%; 69 | } 70 | .ui-resizable { 71 | position: relative; 72 | } 73 | .ui-resizable-handle { 74 | position: absolute; 75 | font-size: 0.1px; 76 | display: block; 77 | } 78 | .ui-resizable-disabled .ui-resizable-handle, 79 | .ui-resizable-autohide .ui-resizable-handle { 80 | display: none; 81 | } 82 | .ui-resizable-n { 83 | cursor: n-resize; 84 | height: 7px; 85 | width: 100%; 86 | top: -5px; 87 | left: 0; 88 | } 89 | .ui-resizable-s { 90 | cursor: s-resize; 91 | height: 7px; 92 | width: 100%; 93 | bottom: -5px; 94 | left: 0; 95 | } 96 | .ui-resizable-e { 97 | cursor: e-resize; 98 | width: 7px; 99 | right: -5px; 100 | top: 0; 101 | height: 100%; 102 | } 103 | .ui-resizable-w { 104 | cursor: w-resize; 105 | width: 7px; 106 | left: -5px; 107 | top: 0; 108 | height: 100%; 109 | } 110 | .ui-resizable-se { 111 | cursor: se-resize; 112 | width: 12px; 113 | height: 12px; 114 | right: 1px; 115 | bottom: 1px; 116 | } 117 | .ui-resizable-sw { 118 | cursor: sw-resize; 119 | width: 9px; 120 | height: 9px; 121 | left: -5px; 122 | bottom: -5px; 123 | } 124 | .ui-resizable-nw { 125 | cursor: nw-resize; 126 | width: 9px; 127 | height: 9px; 128 | left: -5px; 129 | top: -5px; 130 | } 131 | .ui-resizable-ne { 132 | cursor: ne-resize; 133 | width: 9px; 134 | height: 9px; 135 | right: -5px; 136 | top: -5px; 137 | } 138 | .ui-shadow { 139 | -webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.3); 140 | -moz-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.3); 141 | box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.3); 142 | } 143 | .ui-unselectable-text { 144 | -webkit-user-select: none; 145 | -khtml-user-select: none; 146 | -moz-user-select: none; 147 | -o-user-select: none; 148 | user-select: none; 149 | } 150 | .ui-scrollbar-measure { 151 | width: 100px; 152 | height: 100px; 153 | overflow: scroll; 154 | position: absolute; 155 | top: -9999px; 156 | } 157 | .ui-overflow-hidden { 158 | overflow: hidden; 159 | } 160 | 161 | ::-webkit-input-placeholder { /* WebKit, Blink, Edge */ 162 | color: #898989; 163 | } 164 | :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ 165 | color: #898989; 166 | opacity: 1; 167 | } 168 | ::-moz-placeholder { /* Mozilla Firefox 19+ */ 169 | color: #898989; 170 | opacity: 1; 171 | } 172 | :-ms-input-placeholder { /* Internet Explorer 10-11 */ 173 | color: #898989; 174 | } 175 | ::-ms-input-placeholder { /* Microsoft Edge */ 176 | color: #898989; 177 | } 178 | .ui-placeholder { 179 | color: #898989; 180 | } 181 | 182 | input[type="button"], 183 | input[type="submit"], 184 | input[type="reset"], 185 | input[type="file"]::-webkit-file-upload-button, 186 | button { 187 | -moz-border-radius: 0; 188 | -webkit-border-radius: 0; 189 | border-radius: 0; 190 | } -------------------------------------------------------------------------------- /demo/assets/components/contextmenu/contextmenu.css: -------------------------------------------------------------------------------- 1 | .ui-contextmenu { 2 | width: 12.5em; 3 | padding: .25em; 4 | position: absolute; 5 | display: none; 6 | } 7 | 8 | .ui-contextmenu .ui-menu-separator { 9 | border-width: 1px 0 0 0; 10 | } 11 | 12 | .ui-contextmenu ul { 13 | list-style: none; 14 | margin: 0; 15 | padding: 0; 16 | } 17 | 18 | .ui-contextmenu .ui-submenu-list { 19 | display: none; 20 | position: absolute; 21 | width: 12.5em; 22 | padding: .25em; 23 | } 24 | 25 | .ui-contextmenu .ui-menuitem-link { 26 | padding: .25em; 27 | display: block; 28 | position: relative; 29 | } 30 | 31 | .ui-contextmenu .ui-menuitem-icon { 32 | margin-right: .25em; 33 | } 34 | 35 | .ui-contextmenu .ui-menuitem { 36 | position: relative; 37 | } 38 | 39 | 40 | .ui-contextmenu .ui-menuitem-link .ui-submenu-icon { 41 | position: absolute; 42 | margin-top: -.5em; 43 | right: 0; 44 | top: 50%; 45 | } 46 | 47 | .ui-contextmenu .ui-menuitem-active > .ui-submenu > .ui-submenu-list { 48 | display: block !important; 49 | } -------------------------------------------------------------------------------- /demo/assets/components/datagrid/datagrid.css: -------------------------------------------------------------------------------- 1 | .ui-datagrid .ui-paginator { 2 | text-align: center; 3 | } 4 | 5 | .ui-datagrid-column { 6 | padding: .25em; 7 | } 8 | 9 | .ui-datagrid-content-empty { 10 | padding: .25em .625em; 11 | } 12 | 13 | .ui-datagrid .ui-datagrid-header, 14 | .ui-datagrid .ui-datagrid-footer { 15 | text-align:center; 16 | padding: .5em .75em; 17 | } 18 | 19 | .ui-datagrid .ui-datagrid-header { 20 | border-bottom: 0 none; 21 | } 22 | 23 | .ui-datagrid .ui-datagrid-footer { 24 | border-top: 0 none; 25 | } 26 | 27 | .ui-datagrid .ui-paginator-top { 28 | border-bottom: 0 none; 29 | } 30 | 31 | .ui-datagrid .ui-paginator-bottom { 32 | border-top: 0 none; 33 | } 34 | 35 | -------------------------------------------------------------------------------- /demo/assets/components/datalist/datalist.css: -------------------------------------------------------------------------------- 1 | .ui-datalist .ui-datalist-header, 2 | .ui-datalist .ui-datalist-footer { 3 | text-align:center; 4 | padding: .5em .75em; 5 | } 6 | 7 | .ui-datalist .ui-datalist-header { 8 | border-bottom: 0 none; 9 | } 10 | 11 | .ui-datalist .ui-datalist-footer { 12 | border-top: 0 none; 13 | } 14 | 15 | .ui-datalist .ui-datalist-data { 16 | margin: 0; 17 | padding: 0; 18 | } 19 | 20 | .ui-datalist .ui-datalist-data > li { 21 | list-style-type: none; 22 | 23 | } 24 | 25 | .ui-datalist .ui-datalist-emptymessage { 26 | padding: .5em .75em; 27 | } 28 | 29 | .ui-datalist.ui-datalist-scrollable .ui-datalist-content { 30 | overflow: auto; 31 | } 32 | 33 | .ui-datalist .ui-paginator-top { 34 | border-bottom: 0 none; 35 | } 36 | 37 | .ui-datalist .ui-paginator-bottom { 38 | border-top: 0 none; 39 | } 40 | -------------------------------------------------------------------------------- /demo/assets/components/datascroller/datascroller.css: -------------------------------------------------------------------------------- 1 | .ui-datascroller { 2 | } 3 | 4 | .ui-datascroller .ui-datascroller-header { 5 | text-align: center; 6 | padding: .5em .75em; 7 | border-bottom: 0 none; 8 | } 9 | 10 | .ui-datascroller .ui-datascroller-footer { 11 | text-align: center; 12 | padding: .25em .625em; 13 | border-top: 0px none; 14 | } 15 | 16 | .ui-datascroller .ui-datascroller-content { 17 | padding: .25em .625em; 18 | } 19 | 20 | .ui-datascroller-inline .ui-datascroller-content { 21 | overflow: auto; 22 | } 23 | 24 | .ui-datascroller .ui-datascroller-list { 25 | list-style-type: none; 26 | margin: 0; 27 | padding: 0; 28 | } -------------------------------------------------------------------------------- /demo/assets/components/dataview/dataview.css: -------------------------------------------------------------------------------- 1 | .ui-dataview { 2 | position: relative; 3 | } 4 | 5 | .ui-dataview .ui-paginator { 6 | text-align: center; 7 | } 8 | 9 | .ui-dataview-column { 10 | padding: .25em; 11 | } 12 | 13 | .ui-dataview-content-empty { 14 | padding: .25em .625em; 15 | } 16 | 17 | .ui-dataview .ui-dataview-header, 18 | .ui-dataview .ui-dataview-footer { 19 | padding: .5em .75em; 20 | } 21 | 22 | .ui-dataview .ui-dataview-header { 23 | border-bottom: 0 none; 24 | } 25 | 26 | .ui-dataview .ui-dataview-footer { 27 | border-top: 0 none; 28 | } 29 | 30 | .ui-dataview .ui-paginator-top { 31 | border-bottom: 0 none; 32 | } 33 | 34 | .ui-dataview .ui-paginator-bottom { 35 | border-top: 0 none; 36 | } 37 | 38 | .ui-dataview.ui-dataview-list > .ui-dataview-content > div.ui-g > div { 39 | width: 100%; 40 | } 41 | 42 | /* Loader */ 43 | .ui-dataview-loading { 44 | position: absolute; 45 | width: 100%; 46 | height: 100%; 47 | -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)"; 48 | opacity: 0.1; 49 | z-index: 1; 50 | } 51 | 52 | .ui-dataview-loading-content { 53 | position: absolute; 54 | left: 50%; 55 | top: 50%; 56 | z-index: 2; 57 | margin-top: -1em; 58 | margin-left: -1em; 59 | } 60 | 61 | .ui-dataview-loading-icon { 62 | font-size: 2em; 63 | } 64 | -------------------------------------------------------------------------------- /demo/assets/components/dialog/dialog.css: -------------------------------------------------------------------------------- 1 | .ui-dialog { 2 | position: fixed; 3 | padding: 0; 4 | } 5 | .ui-dialog .ui-dialog-titlebar { 6 | padding: .5em .75em; 7 | position: relative; 8 | border: 0; 9 | } 10 | 11 | .ui-dialog .ui-dialog-content { 12 | position: relative; 13 | border: 0; 14 | padding: .5em .75em; 15 | background: none; 16 | overflow: auto; 17 | zoom: 1; 18 | } 19 | 20 | .ui-dialog .ui-resizable-se { 21 | width: 14px; 22 | height: 14px; 23 | right: 3px; 24 | bottom: 3px; 25 | } 26 | .ui-draggable .ui-dialog-titlebar { 27 | cursor: move; 28 | } 29 | 30 | .ui-dialog .ui-dialog-titlebar-icon { 31 | text-decoration: none; 32 | float: right; 33 | float: right; 34 | padding: .125em; 35 | cursor: pointer; 36 | border: 1px solid transparent; 37 | } 38 | 39 | .ui-dialog .ui-dialog-titlebar-icon span { 40 | display: block; 41 | margin: 0; 42 | font-size: 1.25em; 43 | } 44 | 45 | .ui-dialog-footer { 46 | padding: 1em; 47 | border-width: 1px 0 0 0; 48 | text-align: right; 49 | } 50 | 51 | .ui-dialog-mask { 52 | position: fixed; 53 | width: 100%; 54 | height: 100%; 55 | } 56 | 57 | .ui-dialog-maximized { 58 | -webkit-transition: left .3s, top .3s, width .3s,height .3s; 59 | transition: left .3s, top .3s, width .3s,height .3s; 60 | } 61 | 62 | /* ConfirmDialog */ 63 | .ui-confirmdialog { 64 | width: 30em; 65 | } 66 | 67 | .ui-confirmdialog.ui-dialog .ui-dialog-content { 68 | padding: 1em 2em; 69 | } 70 | .ui-confirmdialog .ui-dialog-content .ui-confirmdialog-icon { 71 | font-size: 1.5em; 72 | vertical-align: middle; 73 | margin-right: .5em; 74 | } 75 | .ui-confirmdialog .ui-dialog-content .ui-confirmdialog-message { 76 | vertical-align: middle; 77 | } 78 | 79 | .ui-dialog-footer .ui-button { 80 | margin-right: .25em; 81 | } 82 | 83 | /* Fluid */ 84 | .ui-fluid .ui-dialog-footer .ui-button { 85 | width: auto; 86 | } 87 | 88 | /* RTL */ 89 | .ui-rtl .ui-dialog .ui-dialog-titlebar-close { 90 | float: left; 91 | } 92 | 93 | .ui-rtl .ui-dialog .ui-dialog-buttonpane button { 94 | text-align: right; 95 | } 96 | 97 | @media screen and (max-width: 40em) { 98 | .ui-confirmdialog { 99 | width: 90%; 100 | } 101 | } -------------------------------------------------------------------------------- /demo/assets/components/dropdown/dropdown.css: -------------------------------------------------------------------------------- 1 | .ui-dropdown { 2 | display: inline-block; 3 | position: relative; 4 | cursor: pointer; 5 | vertical-align: middle; 6 | } 7 | 8 | .ui-dropdown .ui-dropdown-clear-icon { 9 | position: absolute; 10 | right: 2em; 11 | top: 50%; 12 | font-size: .75em; 13 | height: 1em; 14 | margin-top: -.5em; 15 | right: 2.5em; 16 | } 17 | 18 | .ui-dropdown .ui-dropdown-trigger { 19 | border-right: none; 20 | border-top: none; 21 | border-bottom: none; 22 | cursor: pointer; 23 | width: 1.5em; 24 | height: 100%; 25 | position: absolute; 26 | right: 0; 27 | top: 0; 28 | padding: 0 .25em; 29 | } 30 | 31 | .ui-dropdown .ui-dropdown-trigger .ui-dropdown-trigger-icon { 32 | top: 50%; 33 | left: 50%; 34 | margin-top: -.5em; 35 | margin-left: -.5em; 36 | position: absolute; 37 | } 38 | 39 | .ui-dropdown .ui-dropdown-label { 40 | display: block; 41 | border: none; 42 | white-space: nowrap; 43 | overflow: hidden; 44 | font-weight: normal; 45 | width: 100%; 46 | padding-right: 2.5em; 47 | } 48 | 49 | .ui-dropdown-item-empty, 50 | .ui-dropdown-label-empty { 51 | text-indent: -9999px; 52 | overflow: hidden; 53 | } 54 | 55 | .ui-dropdown.ui-state-disabled .ui-dropdown-trigger, 56 | .ui-dropdown.ui-state-disabled .ui-dropdown-label { 57 | cursor: default; 58 | } 59 | 60 | .ui-dropdown label.ui-dropdown-label { 61 | cursor: pointer; 62 | } 63 | 64 | .ui-dropdown input.ui-dropdown-label { 65 | cursor: default; 66 | } 67 | 68 | .ui-dropdown .ui-dropdown-panel { 69 | min-width: 100%; 70 | } 71 | 72 | .ui-dropdown-panel { 73 | position: absolute; 74 | height: auto; 75 | } 76 | 77 | .ui-dropdown-panel .ui-dropdown-items-wrapper { 78 | overflow: auto; 79 | } 80 | 81 | .ui-dropdown-panel .ui-dropdown-item { 82 | font-weight: normal; 83 | border: 0 none; 84 | cursor: pointer; 85 | margin: 1px 0; 86 | padding: .125em .25em; 87 | text-align: left; 88 | } 89 | 90 | .ui-dropdown-panel .ui-dropdown-item-group { 91 | font-weight: bold; 92 | cursor: default; 93 | } 94 | 95 | .ui-dropdown-panel .ui-dropdown-list { 96 | padding: 0.4em; 97 | border: 0 none; 98 | } 99 | 100 | .ui-dropdown-panel .ui-dropdown-filter { 101 | width: 100%; 102 | box-sizing: border-box; 103 | padding-right: 1.5em; 104 | } 105 | 106 | .ui-dropdown-panel .ui-dropdown-filter-container { 107 | position: relative; 108 | margin: 0; 109 | padding: 0.4em; 110 | display: inline-block; 111 | width: 100%; 112 | } 113 | 114 | .ui-dropdown-panel .ui-dropdown-filter-container .ui-dropdown-filter-icon { 115 | position: absolute; 116 | top: .8em; 117 | right: 1em; 118 | } 119 | 120 | /** Dropdown **/ 121 | .ui-fluid .ui-dropdown { 122 | width: 100%; 123 | } 124 | -------------------------------------------------------------------------------- /demo/assets/components/fieldset/fieldset.css: -------------------------------------------------------------------------------- 1 | .ui-fieldset, 2 | .ui-fieldset .ui-fieldset-legend { 3 | padding: 0.5em 1em; 4 | } 5 | 6 | .ui-fieldset-toggleable .ui-fieldset-legend { 7 | padding: 0; 8 | } 9 | 10 | .ui-fieldset-toggleable .ui-fieldset-legend a { 11 | padding: 0.5em 1em; 12 | cursor:pointer; 13 | white-space: nowrap; 14 | display: block; 15 | } 16 | 17 | .ui-fieldset .ui-fieldset-toggler { 18 | margin-right: .1em; 19 | display: inline-block; 20 | vertical-align: middle; 21 | } 22 | 23 | .ui-fieldset .ui-fieldset-legend-text { 24 | vertical-align: middle; 25 | } 26 | 27 | .ui-fieldset .ui-fieldset-content-wrapper-overflown { 28 | overflow: hidden; 29 | } -------------------------------------------------------------------------------- /demo/assets/components/fileupload/fileupload.css: -------------------------------------------------------------------------------- 1 | /* 2 | * FileUpload 3 | */ 4 | .ui-fileupload-buttonbar .ui-fileupload-choose.ui-state-disabled input { 5 | cursor: default; 6 | } 7 | 8 | .ui-fileupload-buttonbar { 9 | padding: .5em; 10 | border-bottom: 0 none; 11 | } 12 | 13 | .ui-fileupload-buttonbar .ui-button { 14 | vertical-align: middle; 15 | margin-right: .25em; 16 | } 17 | 18 | .ui-fileupload-content { 19 | padding: 1em; 20 | position: relative; 21 | transition: border-color .3s; 22 | } 23 | 24 | .ui-fileupload-content.ui-fileupload-highlight { 25 | border-color: #156090; 26 | } 27 | 28 | .ui-fileupload-files img { 29 | border: none; 30 | } 31 | 32 | .ui-fileupload-files { 33 | display: table; 34 | } 35 | 36 | .ui-fileupload-row { 37 | display: table-row; 38 | } 39 | 40 | .ui-fileupload-row > div { 41 | display: table-cell; 42 | padding: .5em 1em; 43 | vertical-align: middle; 44 | } 45 | 46 | .ui-fileupload-content .ui-progressbar { 47 | width: 100%; 48 | position: absolute; 49 | top: 1px; 50 | left: 0; 51 | height: .25em; 52 | border: 0 none; 53 | } 54 | 55 | .ui-fileupload-content .ui-progressbar-value { 56 | -moz-border-radius: 0; 57 | -webkit-border-radius: 0; 58 | border-radius: 0; 59 | border: 0 none; 60 | } 61 | 62 | /* Simple */ 63 | .ui-fileupload-choose { 64 | position: relative; 65 | overflow: hidden; 66 | } 67 | 68 | .ui-fileupload-choose input[type=file] { 69 | position: absolute; 70 | top: 0; 71 | right: 0; 72 | margin: 0; 73 | opacity: 0; 74 | min-height: 100%; 75 | font-size: 100px; 76 | text-align: right; 77 | filter: alpha(opacity=0); 78 | direction: ltr; 79 | cursor: pointer; 80 | } 81 | 82 | .ui-fileupload-choose.ui-fileupload-choose-selected input[type=file] { 83 | display: none; 84 | } 85 | 86 | /* ui-fluid */ 87 | .ui-fluid .ui-fileupload .ui-button { 88 | width: auto; 89 | } 90 | 91 | .ui-fluid .ui-fileupload-content .ui-button-icon-only { 92 | width: 2em; 93 | } 94 | 95 | @media (max-width: 40em) { 96 | .ui-fileupload-buttonbar .ui-button { 97 | display: block; 98 | width: 100%; 99 | margin-right: 0; 100 | margin-bottom: .25em; 101 | } 102 | 103 | .ui-fileupload-buttonbar .ui-button:last-child { 104 | margin-bottom: 0; 105 | } 106 | 107 | .ui-fileupload-row > div { 108 | display: block; 109 | } 110 | } 111 | 112 | 113 | -------------------------------------------------------------------------------- /demo/assets/components/galleria/galleria.css: -------------------------------------------------------------------------------- 1 | .ui-galleria { 2 | overflow: hidden; 3 | visibility: hidden; 4 | position: relative; 5 | } 6 | 7 | .ui-galleria-panel-wrapper { 8 | position: relative; 9 | padding: 0; 10 | margin: 0; 11 | } 12 | 13 | .ui-galleria-panel { 14 | filter: inherit; 15 | position: absolute; 16 | top: 0; 17 | left: 0; 18 | list-style-type: none; 19 | } 20 | 21 | .ui-galleria-filmstrip-wrapper { 22 | overflow: hidden; 23 | margin: .25em auto; 24 | position: relative; 25 | } 26 | 27 | .ui-galleria-filmstrip { 28 | list-style: none outside none; 29 | margin: 0; 30 | padding: 0; 31 | width: 2340px; 32 | z-index: 900; 33 | position: absolute; 34 | top: 0; 35 | left: 0; 36 | } 37 | 38 | .ui-galleria-frame { 39 | float:left; 40 | margin-right: 5px; 41 | opacity: 0.3; 42 | cursor: pointer; 43 | } 44 | 45 | .ui-galleria-frame-active { 46 | opacity: 1; 47 | } 48 | 49 | .ui-galleria-frame-content { 50 | overflow: hidden; 51 | } 52 | 53 | .ui-galleria-nav-next, .ui-galleria-nav-prev { 54 | cursor: pointer; 55 | position: absolute; 56 | z-index: 910; 57 | } 58 | 59 | .ui-galleria-nav-prev { 60 | left: 4px; 61 | } 62 | 63 | .ui-galleria-nav-next { 64 | right: 4px; 65 | } 66 | 67 | .ui-galleria-caption { 68 | position: absolute; 69 | left:1px; 70 | background-color: rgba(0,0,0,0.5); 71 | display: none; 72 | color: #ededed; 73 | padding: 0.2em 1em; 74 | } 75 | 76 | .ui-galleria-caption h4 { 77 | color: #ededed; 78 | } 79 | 80 | .ui-galleria-panel-content { 81 | padding: 1em 1.4em; 82 | } 83 | -------------------------------------------------------------------------------- /demo/assets/components/growl/growl.css: -------------------------------------------------------------------------------- 1 | .ui-growl { 2 | position:fixed; 3 | top: 20px; 4 | right: 20px; 5 | width: 20em; 6 | } 7 | 8 | .ui-growl-item-container { 9 | position:relative; 10 | margin:0 0 10px 0; 11 | opacity:0.95; 12 | filter:alpha(opacity=95); 13 | } 14 | 15 | .ui-growl-item { 16 | position: relative; 17 | display: block; 18 | padding: .5em 1em; 19 | } 20 | 21 | .ui-growl-item p { 22 | padding: 0; 23 | margin: 0; 24 | } 25 | 26 | .ui-growl-icon-close { 27 | position: absolute; 28 | top: 4px; 29 | right: 4px; 30 | cursor: pointer; 31 | } 32 | 33 | .ui-growl-title { 34 | font-weight: bold; 35 | padding: 0 0 .5em 0; 36 | display: block; 37 | } 38 | 39 | .ui-growl-image { 40 | position: absolute; 41 | display: inline-block; 42 | left: .5em; 43 | top: .25em; 44 | padding: 0; 45 | font-size: 2em; 46 | } 47 | 48 | .ui-growl-message { 49 | padding: 0 0 .25em 0; 50 | margin-left: 2.5em; 51 | } 52 | 53 | .ui-growl-message p { 54 | font-weight: normal; 55 | } -------------------------------------------------------------------------------- /demo/assets/components/inplace/inplace.css: -------------------------------------------------------------------------------- 1 | .ui-inplace .ui-inplace-display { 2 | display: inline; 3 | cursor: pointer; 4 | border: 0 none; 5 | padding: .25em; 6 | font-weight: normal; 7 | } 8 | 9 | .ui-inplace .ui-inplace-content { 10 | display: inline; 11 | } -------------------------------------------------------------------------------- /demo/assets/components/inputswitch/inputswitch.css: -------------------------------------------------------------------------------- 1 | .ui-inputswitch { 2 | position: relative; 3 | display: inline-block; 4 | width: 3em; 5 | height: 1.75em; 6 | } 7 | 8 | .ui-inputswitch-slider { 9 | position: absolute; 10 | cursor: pointer; 11 | top: 0; 12 | left: 0; 13 | right: 0; 14 | bottom: 0; 15 | -webkit-transition: .3s; 16 | transition: .3s; 17 | border-radius: 30px; 18 | } 19 | 20 | .ui-inputswitch-slider:before { 21 | position: absolute; 22 | content: ""; 23 | height: 1.250em; 24 | width: 1.250em; 25 | left: .25em; 26 | bottom: .25em; 27 | border-radius: 50%; 28 | -webkit-transition: .3s; 29 | transition: .3s; 30 | } 31 | 32 | .ui-inputswitch-checked .ui-inputswitch-slider:before { 33 | -webkit-transform: translateX(1.250em); 34 | -ms-transform: translateX(1.250em); 35 | transform: translateX(1.250em); 36 | } -------------------------------------------------------------------------------- /demo/assets/components/inputtext/inputtext.css: -------------------------------------------------------------------------------- 1 | .ui-inputtext { 2 | margin: 0; 3 | outline: medium none; 4 | padding: .25em; 5 | font-weight: normal; 6 | } 7 | 8 | .ui-widget-header .ui-inputtext, 9 | .ui-widget-content .ui-inputtext { 10 | font-weight: normal; 11 | } 12 | 13 | .ui-fluid .ui-inputtext { 14 | width: 100%; 15 | box-sizing: border-box; 16 | -webkit-box-sizing:border-box; 17 | -moz-box-sizing: border-box; 18 | } 19 | 20 | .ui-inputgroup { 21 | display: -webkit-box; 22 | display: -webkit-flex; 23 | display: flex; 24 | } 25 | 26 | .ui-inputgroup .ui-inputgroup-addon { 27 | display: inline-block; 28 | text-align: center; 29 | min-width: 1.5em; 30 | padding: .25em; 31 | border-width: 1px; 32 | border-style: solid; 33 | } 34 | 35 | .ui-inputgroup .ui-inputgroup-addon + .ui-inputgroup-addon { 36 | border-left: 0 none; 37 | } 38 | 39 | .ui-inputgroup .ui-inputtext { 40 | padding-left: .5em; 41 | } 42 | 43 | .ui-inputgroup .ui-inputtext:not(:first-child) { 44 | border-top-left-radius: 0; 45 | border-bottom-left-radius: 0; 46 | border-left: 0 none; 47 | } 48 | 49 | .ui-inputgroup .ui-inputtext:not(:last-child) { 50 | border-top-right-radius: 0; 51 | border-bottom-right-radius: 0; 52 | border-right: 0 none; 53 | } 54 | 55 | .ui-inputgroup .ui-button { 56 | margin-right: 0; 57 | border-radius: 0; 58 | } 59 | 60 | .ui-fluid .ui-inputgroup .ui-button { 61 | width: auto; 62 | } 63 | 64 | .ui-fluid .ui-inputgroup .ui-inputtext { 65 | -webkit-box-flex: 1; 66 | -webkit-flex: 1 1 auto; 67 | -ms-flex: 1 1 auto; 68 | flex: 1 1 auto; 69 | } 70 | 71 | .ui-inputgroup .ui-chkbox, 72 | .ui-inputgroup .ui-radiobutton { 73 | margin-right: 0; 74 | vertical-align: bottom; 75 | } 76 | 77 | /* Floating Label */ 78 | .ui-float-label { 79 | display: block; 80 | position:relative; 81 | } 82 | 83 | .ui-float-label > label { 84 | font-weight:normal; 85 | position:absolute; 86 | pointer-events:none; 87 | left: .25em; 88 | top: 50%; 89 | margin-top: -.5em; 90 | transition: 0.3s ease all; 91 | -moz-transition: 0.3s ease all; 92 | -webkit-transition: 0.3s ease all; 93 | color: #898989; 94 | line-height: 1; 95 | } 96 | 97 | /* breaks firefox so defined separately */ 98 | .ui-float-label > input:-webkit-autofill ~ label { 99 | top:-.75em; 100 | font-size:12px; 101 | } 102 | 103 | .ui-float-label > input:focus ~ label, 104 | .ui-float-label > input.ui-state-filled ~ label, 105 | .ui-float-label > .ui-inputwrapper-focus ~ label, 106 | .ui-float-label > .ui-inputwrapper-filled ~ label { 107 | top:-.75em; 108 | font-size:12px; 109 | } 110 | 111 | 112 | -------------------------------------------------------------------------------- /demo/assets/components/inputtextarea/inputtextarea.css: -------------------------------------------------------------------------------- 1 | .ui-inputtextarea-resizable { 2 | overflow: hidden; 3 | resize:none; 4 | } 5 | 6 | .ui-fluid .ui-inputtextarea { 7 | width: 100%; 8 | } 9 | 10 | .ui-float-label textarea:focus ~ label, 11 | .ui-float-label textarea.ui-state-filled ~ label, 12 | .ui-float-label textarea:-webkit-autofill ~ label { 13 | top:-.75em; 14 | font-size:12px; 15 | } -------------------------------------------------------------------------------- /demo/assets/components/lightbox/lightbox.css: -------------------------------------------------------------------------------- 1 | .ui-lightbox { 2 | position: fixed; 3 | display: none; 4 | } 5 | 6 | .ui-lightbox-content-wrapper { 7 | position: relative; 8 | } 9 | 10 | .ui-lightbox-content { 11 | position: relative; 12 | margin: 0; 13 | padding: 0; 14 | background-color: #000000; 15 | } 16 | 17 | .ui-lightbox-nav-right, .ui-lightbox-nav-left { 18 | position: absolute; 19 | top: 50%; 20 | cursor: pointer; 21 | } 22 | 23 | .ui-lightbox-nav-left { 24 | left: 0; 25 | } 26 | 27 | .ui-lightbox-nav-right { 28 | right: 0; 29 | } 30 | 31 | .ui-lightbox-loading .ui-lightbox-content { 32 | background: url("./images/loading.gif") #000000 center center no-repeat; 33 | } 34 | 35 | .ui-lightbox-caption { 36 | padding: 0.2em 0.4em; 37 | display: none; 38 | } 39 | 40 | .ui-lightbox-caption-text { 41 | margin: 0.3em 0 0.1em 0; 42 | float:left; 43 | } 44 | 45 | .ui-lightbox-close { 46 | float:right; 47 | margin: 0; 48 | padding: .125em; 49 | } 50 | 51 | .ui-lightbox-close.ui-state-hover { 52 | padding: 0; 53 | } 54 | 55 | .ui-lightbox-nav-left, .ui-lightbox-nav-right { 56 | opacity: .5; 57 | } 58 | 59 | .ui-lightbox-nav-left:hover, .ui-lightbox-nav-right:hover{ 60 | opacity: 1; 61 | } -------------------------------------------------------------------------------- /demo/assets/components/listbox/listbox.css: -------------------------------------------------------------------------------- 1 | .ui-listbox { 2 | padding: .25em; 3 | width: 10em; 4 | } 5 | 6 | .ui-listbox .ui-listbox-list-wrapper { 7 | overflow:auto; 8 | } 9 | 10 | .ui-listbox .ui-listbox-list { 11 | list-style-type: none; 12 | margin: 0; 13 | padding: 0; 14 | } 15 | 16 | .ui-listbox .ui-listbox-item { 17 | padding: .25em; 18 | border: 0 none; 19 | cursor: pointer; 20 | font-weight: normal; 21 | margin-bottom: 1px; 22 | } 23 | 24 | .ui-listbox .ui-listbox-item > span { 25 | vertical-align: middle; 26 | } 27 | 28 | .ui-listbox .ui-listbox-item:last-child { 29 | margin-bottom: 0; 30 | } 31 | 32 | .ui-listbox.ui-state-disabled .ui-listbox-item { 33 | cursor: default; 34 | } 35 | 36 | .ui-listbox-header { 37 | margin-bottom: 0.3em; 38 | padding: .125em .2em; 39 | position: relative; 40 | } 41 | 42 | .ui-listbox-header .ui-chkbox { 43 | display: inline-block; 44 | vertical-align: middle; 45 | cursor: pointer; 46 | } 47 | 48 | .ui-listbox-header .ui-listbox-filter-container { 49 | display: inline-block; 50 | vertical-align: middle; 51 | position: relative; 52 | width: 100%; 53 | } 54 | 55 | .ui-listbox-header.ui-listbox-header-w-checkbox .ui-listbox-filter-container { 56 | width: calc(100% - 2em); 57 | } 58 | 59 | .ui-listbox-header .ui-listbox-filter-container .ui-listbox-filter-icon { 60 | position: absolute; 61 | top: .25em; 62 | left: .25em; 63 | } 64 | 65 | .ui-listbox-header .ui-inputtext { 66 | padding: .125em .125em .125em 1.25em; 67 | width: 100%; 68 | } 69 | 70 | .ui-listbox-footer { 71 | padding: .125em .2em; 72 | } -------------------------------------------------------------------------------- /demo/assets/components/megamenu/megamenu.css: -------------------------------------------------------------------------------- 1 | .ui-megamenu { 2 | padding: .25em; 3 | } 4 | 5 | .ui-megamenu-root-list { 6 | margin: 0; 7 | padding: 0; 8 | list-style: none; 9 | } 10 | 11 | .ui-megamenu-root-list > .ui-menuitem { 12 | position: relative; 13 | } 14 | 15 | .ui-megamenu .ui-menuitem-link { 16 | padding: .25em; 17 | display: block; 18 | text-decoration: none; 19 | } 20 | 21 | .ui-megamenu .ui-menuitem-icon { 22 | margin-right: .25em; 23 | } 24 | 25 | .ui-megamenu-panel { 26 | display: none; 27 | position: absolute; 28 | width: auto; 29 | } 30 | 31 | .ui-megamenu-root-list > .ui-menuitem-active > .ui-megamenu-panel { 32 | display: block; 33 | } 34 | 35 | .ui-megamenu-panel .ui-menuitem { 36 | margin: .125em 0; 37 | } 38 | 39 | .ui-megamenu-submenu { 40 | margin: 0; 41 | padding: 0; 42 | list-style: none; 43 | width: 12.5em; 44 | } 45 | 46 | .ui-megamenu-submenu-header { 47 | padding: .25em; 48 | } 49 | 50 | /* Horizontal */ 51 | .ui-megamenu-horizontal .ui-megamenu-root-list > .ui-menuitem { 52 | display: inline-block; 53 | } 54 | 55 | /* Vertical */ 56 | .ui-megamenu-vertical { 57 | width: 12.5em; 58 | } 59 | 60 | .ui-megamenu-vertical .ui-megamenu-root-list > .ui-menuitem { 61 | display: block; 62 | } 63 | 64 | .ui-megamenu-vertical .ui-megamenu-root-list > .ui-menuitem > .ui-menuitem-link { 65 | position: relative; 66 | } 67 | 68 | .ui-megamenu-vertical .ui-megamenu-root-list > .ui-menuitem > .ui-menuitem-link > .ui-submenu-icon { 69 | position: absolute; 70 | width: 1em; 71 | height: 1em; 72 | top: 50%; 73 | right: 0; 74 | margin-top: -.5em; 75 | } 76 | 77 | .ui-megamenu .ui-g { 78 | -ms-flex-wrap: nowrap; 79 | flex-wrap: nowrap; 80 | } -------------------------------------------------------------------------------- /demo/assets/components/menu/menu.css: -------------------------------------------------------------------------------- 1 | .ui-menu { 2 | width: 12.5em; 3 | padding: .25em; 4 | } 5 | 6 | .ui-menu.ui-menu-dynamic { 7 | position: absolute; 8 | } 9 | 10 | .ui-menu .ui-menu-separator { 11 | border-width: 1px 0 0 0; 12 | } 13 | 14 | .ui-menu ul { 15 | list-style: none; 16 | margin: 0; 17 | padding: 0; 18 | } 19 | 20 | .ui-menu .ui-submenu-header { 21 | padding: .25em .5em; 22 | margin: .125em 0; 23 | } 24 | 25 | .ui-menu .ui-menuitem { 26 | margin: .125em 0; 27 | } 28 | 29 | .ui-menu .ui-menuitem-link { 30 | padding: .25em; 31 | display: block; 32 | text-decoration: none; 33 | } 34 | 35 | .ui-menu .ui-menuitem-icon { 36 | margin-right: .25em; 37 | } -------------------------------------------------------------------------------- /demo/assets/components/menubar/menubar.css: -------------------------------------------------------------------------------- 1 | .ui-menubar { 2 | padding: .25em; 3 | } 4 | 5 | .ui-menubar .ui-menu-separator { 6 | border-width: 1px 0 0 0; 7 | } 8 | 9 | .ui-menubar:after { 10 | content: ""; 11 | clear: both; 12 | display: table; 13 | } 14 | 15 | .ui-menubar ul { 16 | margin: 0; 17 | padding: 0; 18 | list-style: none; 19 | } 20 | 21 | .ui-menubar .ui-menuitem-link { 22 | display: block; 23 | padding: .25em; 24 | position: relative; 25 | text-decoration: none; 26 | } 27 | 28 | .ui-menubar .ui-menuitem-icon { 29 | margin-right: .25em; 30 | } 31 | 32 | .ui-menubar .ui-menubar-root-list { 33 | display: inline-block; 34 | } 35 | 36 | .ui-menubar .ui-menubar-root-list > .ui-menuitem { 37 | display: inline-block; 38 | position: relative; 39 | } 40 | 41 | .ui-menubar .ui-menubar-root-list > .ui-menuitem > .ui-menuitem-link { 42 | padding: .5em; 43 | } 44 | 45 | .ui-menubar .ui-menubar-root-list > li ul { 46 | display: none; 47 | } 48 | 49 | .ui-menubar .ui-submenu-list { 50 | display: none; 51 | position: absolute; 52 | min-width: 12.5em; 53 | padding: .25em; 54 | } 55 | 56 | .ui-menubar .ui-submenu-list .ui-menuitem { 57 | margin: .125em 0; 58 | position: relative; 59 | } 60 | 61 | .ui-menubar .ui-submenu-list .ui-menuitem-link .ui-submenu-icon { 62 | position: absolute; 63 | margin-top: -.5em; 64 | right: 0; 65 | top: 50%; 66 | } 67 | 68 | .ui-menubar .ui-menuitem-active > .ui-submenu > .ui-submenu-list { 69 | display: block; 70 | } 71 | 72 | .ui-menubar .ui-menubar-custom { 73 | float: right; 74 | padding: .25em; 75 | } -------------------------------------------------------------------------------- /demo/assets/components/message/message.css: -------------------------------------------------------------------------------- 1 | .ui-message { 2 | border: 1px solid; 3 | margin: 0px .25em; 4 | padding: .25em .5em; 5 | display: inline-block; 6 | } 7 | 8 | .ui-fluid .ui-message { 9 | display: block; 10 | } -------------------------------------------------------------------------------- /demo/assets/components/messages/messages.css: -------------------------------------------------------------------------------- 1 | .ui-messages { 2 | border: 1px solid; 3 | margin: .5em 0; 4 | padding: 1em 1em 1em .5em; 5 | position: relative; 6 | } 7 | 8 | .ui-messages-icon { 9 | display:inline-block; 10 | padding: 0; 11 | vertical-align: middle; 12 | font-size: 2em; 13 | } 14 | 15 | .ui-messages-summary { 16 | font-weight: bold; 17 | margin-left: .25em; 18 | } 19 | 20 | .ui-messages-detail { 21 | margin-left: .25em; 22 | } 23 | 24 | .ui-messages-success { 25 | color: #2C832f; 26 | background-color: #B4F0B6; 27 | border-color: #B4F0B6; 28 | } 29 | 30 | .ui-messages-success .ui-messages-close { 31 | color: #2C832f; 32 | } 33 | 34 | .ui-messages-info { 35 | color: #1765A3; 36 | background-color: #BFE0FA; 37 | border-color: #BFE0FA; 38 | } 39 | 40 | .ui-messages-info .ui-messages-close { 41 | color: #1765A3; 42 | } 43 | 44 | .ui-messages-warn { 45 | color: #8A6714; 46 | background-color: #FFE9B5; 47 | border-color: #FFE9B5; 48 | } 49 | 50 | .ui-messages-warn .ui-messages-close { 51 | color: #8A6714; 52 | } 53 | 54 | .ui-messages-error { 55 | color: #AB1A0F; 56 | background-color: #FFCBC8; 57 | border-color: #FFCBC8; 58 | } 59 | 60 | .ui-messages-error .ui-messages-close { 61 | color: #AB1A0F; 62 | } 63 | 64 | .ui-messages ul { 65 | margin: 0; 66 | padding: 0; 67 | list-style-type: none; 68 | display: inline-block; 69 | vertical-align: middle; 70 | } 71 | 72 | .ui-messages ul > li { 73 | padding: .25em 0; 74 | } 75 | 76 | .ui-messages.ui-messages-noicon ul { 77 | margin: 0 1.5em 0 0; 78 | } 79 | 80 | .ui-messages .ui-messages-close { 81 | cursor: pointer; 82 | position: absolute; 83 | top: 5px; 84 | right: 5px; 85 | } 86 | 87 | /* Message */ 88 | .ui-message .ui-message-icon { 89 | font-size: 1.5em; 90 | vertical-align: middle; 91 | } 92 | 93 | .ui-message .ui-message-text { 94 | vertical-align: middle; 95 | } -------------------------------------------------------------------------------- /demo/assets/components/multiselect/multiselect.css: -------------------------------------------------------------------------------- 1 | .ui-multiselect { 2 | display: inline-block; 3 | position: relative; 4 | width: auto; 5 | cursor: pointer; 6 | } 7 | 8 | .ui-multiselect .ui-multiselect-trigger { 9 | border-right: none; 10 | border-top: none; 11 | border-bottom: none; 12 | cursor: pointer; 13 | width: 1.5em; 14 | height: 100%; 15 | position: absolute; 16 | right: 0; 17 | top: 0; 18 | padding: 0 .25em; 19 | } 20 | 21 | .ui-multiselect .ui-multiselect-trigger .ui-multiselect-trigger-icon { 22 | top: 50%; 23 | left: 50%; 24 | margin-top: -.5em; 25 | margin-left: -.5em; 26 | position: absolute; 27 | } 28 | 29 | .ui-multiselect .ui-multiselect-label-container { 30 | overflow: hidden; 31 | } 32 | 33 | .ui-multiselect .ui-multiselect-label { 34 | display: block; 35 | padding: .25em 2em .25em .25em; 36 | width: auto; 37 | border: none; 38 | cursor: pointer; 39 | text-overflow: ellipsis; 40 | overflow: hidden; 41 | } 42 | 43 | .ui-multiselect.ui-state-disabled .ui-multiselect-trigger, 44 | .ui-multiselect.ui-state-disabled .ui-multiselect-label { 45 | cursor: auto 46 | } 47 | 48 | .ui-multiselect-panel { 49 | padding: 0.2em; 50 | position: absolute; 51 | min-width: 12em; 52 | } 53 | 54 | .ui-multiselect .ui-multiselect-panel { 55 | min-width: 100%; 56 | } 57 | 58 | .ui-multiselect-panel .ui-multiselect-items-wrapper { 59 | overflow: auto; 60 | position: relative; 61 | padding: 0.2em 0; 62 | } 63 | 64 | .ui-multiselect-panel .ui-multiselect-list { 65 | border: 0 none; 66 | } 67 | 68 | .ui-multiselect-panel .ui-multiselect-item { 69 | border: 0 none; 70 | cursor: pointer; 71 | font-weight: normal; 72 | margin: 1px 0; 73 | padding: .125em .25em; 74 | text-align: left; 75 | white-space: nowrap; 76 | display: block; 77 | position: relative; 78 | } 79 | 80 | .ui-multiselect-panel .ui-multiselect-item .ui-chkbox { 81 | display: inline-block; 82 | vertical-align: middle; 83 | } 84 | 85 | .ui-multiselect-panel .ui-multiselect-item label { 86 | display: inline-block; 87 | vertical-align: middle; 88 | } 89 | 90 | .ui-multiselect-header { 91 | margin-bottom: 0.3em; 92 | padding: .25em; 93 | position: relative; 94 | text-align: left; 95 | min-height: 2em; 96 | } 97 | 98 | .ui-multiselect-header .ui-chkbox { 99 | display: inline-block; 100 | vertical-align: middle; 101 | cursor:pointer; 102 | } 103 | 104 | .ui-multiselect-header .ui-multiselect-filter-container { 105 | position: relative; 106 | display: inline-block; 107 | vertical-align: middle; 108 | width: 65%; 109 | } 110 | 111 | .ui-multiselect-header.ui-multiselect-header-no-toggleall .ui-multiselect-filter-container { 112 | width: 85%; 113 | } 114 | 115 | .ui-multiselect-header .ui-multiselect-filter-container .ui-multiselect-filter-icon { 116 | position: absolute; 117 | top: .25em; 118 | left: .125em; 119 | } 120 | 121 | .ui-multiselect-header .ui-inputtext { 122 | padding: .125em .125em .125em 1.25em; 123 | width: 100%; 124 | } 125 | 126 | .ui-multiselect-header .ui-multiselect-close { 127 | position: absolute; 128 | right: .375em; 129 | top: .375em; 130 | display: block; 131 | font-size: 1em; 132 | border: 0 none; 133 | } 134 | 135 | .ui-multiselect-header a.ui-multiselect-all, 136 | .ui-multiselect-header a.ui-multiselect-none { 137 | float:left; 138 | margin-right: 10px; 139 | display: block; 140 | } 141 | 142 | .ui-multiselect-header .ui-multiselect-close.ui-state-hover { 143 | padding:0px; 144 | } 145 | 146 | .ui-multiselect-footer { 147 | padding: .25em; 148 | } 149 | 150 | .ui-fluid .ui-multiselect { 151 | width: 100%; 152 | box-sizing: border-box; 153 | } 154 | 155 | -------------------------------------------------------------------------------- /demo/assets/components/orderlist/orderlist.css: -------------------------------------------------------------------------------- 1 | .ui-orderlist { 2 | display: table; 3 | } 4 | 5 | .ui-orderlist .ui-orderlist-controls { 6 | height: 12.5em; 7 | padding: 0 .25em; 8 | vertical-align: middle; 9 | display: table-cell; 10 | } 11 | 12 | .ui-orderlist .ui-orderlist-controls .ui-button { 13 | display: block; 14 | margin-bottom: 0.25em; 15 | } 16 | 17 | .ui-orderlist .ui-orderlist-container { 18 | display: table-cell; 19 | vertical-align: top; 20 | } 21 | 22 | .ui-orderlist .ui-orderlist-list { 23 | list-style-type: none; 24 | margin: 0; 25 | padding: 0; 26 | overflow:auto; 27 | height: 12.5em; 28 | width: 12.5em; 29 | } 30 | 31 | .ui-orderlist .ui-orderlist-caption { 32 | text-align: center; 33 | padding: .5em .75em; 34 | border-bottom: 0 none; 35 | } 36 | 37 | .ui-orderlist .ui-orderlist-list .ui-orderlist-item { 38 | margin: 1px; 39 | padding: .125em; 40 | cursor: pointer; 41 | border: 0 none; 42 | font-weight: inherit; 43 | } 44 | 45 | .ui-orderlist .ui-orderlist-filter-container { 46 | position: relative; 47 | width: 100%; 48 | padding: .5em .6em; 49 | border-bottom: 0 none; 50 | } 51 | 52 | .ui-orderlist .ui-orderlist-filter-container .ui-inputtext { 53 | text-indent: 1.1em; 54 | width: 100%; 55 | } 56 | 57 | .ui-orderlist .ui-orderlist-filter-container .ui-orderlist-filter-icon { 58 | position: absolute; 59 | top: 50%; 60 | left: 1em; 61 | margin-top: -.6em; 62 | } 63 | 64 | .ui-orderlist.ui-state-disabled .ui-orderlist-item, 65 | .ui-orderlist.ui-state-disabled .ui-button { 66 | cursor: default; 67 | } 68 | 69 | .ui-orderlist.ui-state-disabled .ui-orderlist-list { 70 | overflow:hidden; 71 | } 72 | 73 | /* Responsive */ 74 | .ui-orderlist.ui-orderlist-responsive { 75 | width: 100%; 76 | } 77 | 78 | .ui-orderlist.ui-orderlist-responsive .ui-orderlist-controls { 79 | width: 16.66666%; 80 | padding-right: .5em; 81 | } 82 | 83 | .ui-orderlist.ui-orderlist-responsive .ui-orderlist-list-container { 84 | width: 83.33333%; 85 | } 86 | 87 | .ui-orderlist.ui-orderlist-responsive .ui-orderlist-list, 88 | .ui-orderlist.ui-orderlist-responsive .ui-orderlist-caption { 89 | width: 100%; 90 | } 91 | 92 | .ui-orderlist.ui-orderlist-responsive .ui-orderlist-controls > .ui-button { 93 | width: 100%; 94 | } 95 | 96 | .ui-orderlist .ui-orderlist-droppoint { 97 | height: 6px; 98 | list-style-type: none; 99 | } 100 | 101 | @media (max-width: 40em) { 102 | .ui-orderlist.ui-orderlist-responsive .ui-orderlist-controls { 103 | text-align: center; 104 | width: 100%; 105 | display: inline-block; 106 | height: auto; 107 | } 108 | 109 | .ui-orderlist.ui-orderlist-responsive .ui-orderlist-controls .ui-button { 110 | display: inline-block; 111 | width: 20%; 112 | margin-right: .25em; 113 | } 114 | 115 | .ui-orderlist.ui-orderlist-responsive .ui-orderlist-list-container { 116 | width: 100%; 117 | } 118 | } -------------------------------------------------------------------------------- /demo/assets/components/organizationchart/organizationchart.css: -------------------------------------------------------------------------------- 1 | .ui-organizationchart .ui-organizationchart-table { 2 | border-spacing: 0; 3 | border-collapse: separate; 4 | margin: 0 auto; 5 | } 6 | 7 | .ui-organizationchart .ui-organizationchart-table > tr > td { 8 | text-align: center; 9 | vertical-align: top; 10 | padding: 0; 11 | padding: 0 .75em; 12 | } 13 | 14 | .ui-organizationchart .ui-organizationchart-node-content { 15 | padding: .5em .75em; 16 | display: inline-block; 17 | position: relative; 18 | } 19 | 20 | .ui-organizationchart .ui-organizationchart-node-content .ui-node-toggler { 21 | position: absolute; 22 | bottom: -9px; 23 | margin-left: -8px; 24 | z-index: 2; 25 | left: 50%; 26 | } 27 | 28 | .ui-organizationchart .ui-organizationchart-line-down { 29 | margin: 0 auto; 30 | height: 20px; 31 | width: 1px; 32 | float: none; 33 | } 34 | 35 | .ui-organizationchart .ui-organizationchart-line-right { 36 | float: none; 37 | border-radius: 0px; 38 | } 39 | 40 | .ui-organizationchart .ui-organizationchart-line-left { 41 | float: none; 42 | border-radius: 0; 43 | } 44 | 45 | .ui-organizationchart .ui-organizationchart-node-content.ui-organizationchart-selectable-node { 46 | cursor: pointer; 47 | } 48 | -------------------------------------------------------------------------------- /demo/assets/components/overlaypanel/overlaypanel.css: -------------------------------------------------------------------------------- 1 | .ui-overlaypanel { 2 | padding: 0; 3 | margin: 0; 4 | position: absolute; 5 | } 6 | 7 | .ui-overlaypanel-content { 8 | padding: 0.5em 1em; 9 | } 10 | 11 | .ui-overlaypanel-close { 12 | position: absolute; 13 | top: -1em; 14 | right: -1em; 15 | width: 2em; 16 | height: 2em; 17 | line-height: 2em; 18 | text-align: center; 19 | -moz-border-radius: 100%; 20 | -webkit-border-radius: 100%; 21 | border-radius: 100%; 22 | } 23 | 24 | .ui-overlaypanel-close-icon { 25 | font-size: 1.5em; 26 | line-height: inherit; 27 | } -------------------------------------------------------------------------------- /demo/assets/components/paginator/paginator.css: -------------------------------------------------------------------------------- 1 | .ui-paginator { 2 | margin: 0; 3 | text-align: center; 4 | padding: .125em; 5 | } 6 | 7 | .ui-paginator .ui-paginator-top { 8 | border-bottom: 0 none; 9 | } 10 | 11 | .ui-paginator .ui-paginator-bottom { 12 | border-top:0 none; 13 | } 14 | 15 | .ui-paginator .ui-paginator-left-content { 16 | float: left; 17 | } 18 | 19 | .ui-paginator .ui-paginator-right-content { 20 | float: right; 21 | } 22 | 23 | .ui-paginator .ui-paginator-page, 24 | .ui-paginator .ui-paginator-pages, 25 | .ui-paginator .ui-paginator-next, 26 | .ui-paginator .ui-paginator-last, 27 | .ui-paginator .ui-paginator-first, 28 | .ui-paginator .ui-paginator-prev, 29 | .ui-paginator .ui-paginator-current { 30 | display: inline-block; 31 | width: 1.5em; 32 | height: 1.5em; 33 | line-height: 1.5em; 34 | zoom: 1; 35 | margin-left: .063em; 36 | margin-right: .063em; 37 | text-decoration: none; 38 | vertical-align: middle; 39 | text-align: center; 40 | position: relative; 41 | } 42 | 43 | .ui-paginator .ui-paginator-pages { 44 | width: auto; 45 | line-height: 1; 46 | } 47 | 48 | .ui-paginator .ui-paginator-icon { 49 | display: block; 50 | position: absolute; 51 | left: 50%; 52 | top: 50%; 53 | width: 1em; 54 | height: 1em; 55 | margin-top: -.5em; 56 | margin-left: -.5em; 57 | } 58 | 59 | .ui-paginator .ui-paginator-page, 60 | .ui-paginator .ui-paginator-next, 61 | .ui-paginator .ui-paginator-last, 62 | .ui-paginator .ui-paginator-first, 63 | .ui-paginator .ui-paginator-prev{ 64 | cursor: pointer; 65 | } 66 | 67 | .ui-paginator .ui-paginator-current, 68 | .ui-paginator .ui-paginator-rpp-options { 69 | margin-left: 1em; 70 | margin-right: 1em; 71 | background-image: none; 72 | } 73 | 74 | .ui-paginator .ui-paginator-jtp-select option, 75 | .ui-paginator .ui-paginator-rpp-options option { 76 | background-image: none; 77 | border: 0 none; 78 | box-shadow: none; 79 | -moz-box-shadow: none; 80 | -webkit-box-shadow: none; 81 | } 82 | 83 | .ui-paginator a.ui-state-disabled { 84 | outline: 0 none; 85 | } 86 | 87 | .ui-paginator .ui-dropdown { 88 | min-width: 4em; 89 | margin-left: .375em; 90 | } 91 | 92 | .ui-fluid .ui-paginator .ui-dropdown { 93 | width: auto; 94 | } -------------------------------------------------------------------------------- /demo/assets/components/panel/panel.css: -------------------------------------------------------------------------------- 1 | .ui-panel { 2 | padding: 0.2em; 3 | } 4 | 5 | .ui-panel .ui-panel-titlebar { 6 | padding: .5em .75em; 7 | } 8 | 9 | .ui-panel .ui-panel-titlebar-icon { 10 | float: right; 11 | cursor: pointer; 12 | } 13 | 14 | .ui-panel .ui-panel-titlebar-icon { 15 | margin-left: 0.2em; 16 | margin-top: -0.1em; 17 | } 18 | 19 | .ui-panel .ui-panel-content { 20 | border: 0; 21 | background: none; 22 | padding: .5em .75em; 23 | } 24 | 25 | .ui-panel .ui-panel-footer { 26 | border-width: 1px 0 0; 27 | padding: .25em .5em; 28 | text-align:left; 29 | } 30 | 31 | .ui-panel-content-wrapper-overflown { 32 | overflow: hidden; 33 | } -------------------------------------------------------------------------------- /demo/assets/components/panelmenu/panelmenu.css: -------------------------------------------------------------------------------- 1 | .ui-panelmenu { 2 | width: auto; 3 | } 4 | 5 | .ui-panelmenu .ui-menu-separator { 6 | border-width: 1px 0 0 0; 7 | } 8 | 9 | .ui-panelmenu .ui-panelmenu-content-wrapper { 10 | overflow: hidden; 11 | } 12 | 13 | .ui-panelmenu .ui-panelmenu-header { 14 | margin: -1px 0 0 0; 15 | zoom: 1; 16 | } 17 | 18 | .ui-panelmenu .ui-panelmenu-header-link { 19 | padding: .5em; 20 | display: block; 21 | text-decoration: none; 22 | } 23 | 24 | .ui-panelmenu .ui-menuitem-icon { 25 | margin-right: .25em; 26 | } 27 | 28 | .ui-panelmenu .ui-panelmenu-content { 29 | padding: 0.25em; 30 | border-top: 0; 31 | margin-bottom: 1px; 32 | } 33 | 34 | .ui-panelmenu .ui-submenu-list { 35 | margin: 0; 36 | padding: 0; 37 | list-style: none; 38 | margin-left: 1.5em; 39 | } 40 | 41 | .ui-panelmenu .ui-panelmenu-content > .ui-panelmenu-root-submenu >.ui-submenu-list { 42 | margin-left: 0; 43 | } 44 | 45 | .ui-panelmenu .ui-menuitem { 46 | overflow: hidden; 47 | margin: .125em 0; 48 | } 49 | 50 | .ui-panelmenu .ui-menuitem-link { 51 | padding: .25em; 52 | display: block; 53 | text-decoration: none; 54 | } -------------------------------------------------------------------------------- /demo/assets/components/password/password.css: -------------------------------------------------------------------------------- 1 | .ui-password-panel { 2 | padding: .25em .5em; 3 | width: 10em; 4 | position: absolute; 5 | } 6 | 7 | .ui-password-panel .ui-password-meter { 8 | height: 10px; 9 | background:transparent url("./images/password-meter.png") no-repeat left top; 10 | padding: 0; 11 | margin: 0; 12 | } 13 | 14 | .ui-password-info { 15 | margin-top: .25em; 16 | } 17 | 18 | /* Overlay Animations */ 19 | .ui-password-panel { 20 | -webkit-transform: translateY(5%); 21 | -ms-transform: translateY(5%); 22 | transform: translateY(5%); 23 | opacity: 0; 24 | -webkit-transition: transform .3s, opacity .3s; 25 | transition: transform .3s, opacity .3s; 26 | } 27 | 28 | .ui-password-panel-visible { 29 | -webkit-transform: translateY(0); 30 | -ms-transform: translateY(0); 31 | transform: translateY(0); 32 | opacity: 1; 33 | } 34 | 35 | .ui-password-panel-hidden { 36 | opacity: 0; 37 | -webkit-transform: translateY(5%); 38 | -ms-transform: translateY(5%); 39 | transform: translateY(5%); 40 | -webkit-transition: transform .3s, opacity .15s; 41 | transition: transform .3s, opacity .15s; 42 | } -------------------------------------------------------------------------------- /demo/assets/components/progressbar/progressbar.css: -------------------------------------------------------------------------------- 1 | .ui-progressbar { 2 | height: 1.2em; 3 | text-align: left; 4 | position: relative; 5 | overflow: hidden; 6 | } 7 | 8 | .ui-progressbar-determinate .ui-progressbar-value { 9 | height: 100%; 10 | width: 0%; 11 | position: absolute; 12 | display: none; 13 | border: 0 none; 14 | } 15 | 16 | .ui-progressbar-determinate .ui-progressbar-value-animate { 17 | -webkit-transition: width 1s ease-in-out; 18 | -moz-transition: width 1s ease-in-out; 19 | -o-transition: width 1s ease-in-out; 20 | transition: width 1s ease-in-out; 21 | } 22 | 23 | .ui-progressbar-determinate .ui-progressbar-label { 24 | text-align: center; 25 | height: 100%; 26 | width: 100%; 27 | position: absolute; 28 | display: none; 29 | font-weight: bold; 30 | } 31 | 32 | .ui-progressbar-indeterminate { 33 | height: .5em; 34 | } 35 | 36 | .ui-progressbar-indeterminate .ui-progressbar-value { 37 | border: 0 none; 38 | } 39 | 40 | .ui-progressbar-indeterminate .ui-progressbar-value::before { 41 | content: ''; 42 | position: absolute; 43 | background-color: inherit; 44 | top: 0; 45 | left: 0; 46 | bottom: 0; 47 | will-change: left, right; 48 | -webkit-animation: ui-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; 49 | animation: ui-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; 50 | } 51 | 52 | .ui-progressbar-indeterminate .ui-progressbar-value::after { 53 | content: ''; 54 | position: absolute; 55 | background-color: inherit; 56 | top: 0; 57 | left: 0; 58 | bottom: 0; 59 | will-change: left, right; 60 | -webkit-animation: ui-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite; 61 | animation: ui-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite; 62 | -webkit-animation-delay: 1.15s; 63 | animation-delay: 1.15s; 64 | } 65 | 66 | @-webkit-keyframes ui-progressbar-indeterminate-anim { 67 | 0% { 68 | left: -35%; 69 | right: 100%; } 70 | 60% { 71 | left: 100%; 72 | right: -90%; } 73 | 100% { 74 | left: 100%; 75 | right: -90%; } 76 | } 77 | @keyframes ui-progressbar-indeterminate-anim { 78 | 0% { 79 | left: -35%; 80 | right: 100%; } 81 | 60% { 82 | left: 100%; 83 | right: -90%; } 84 | 100% { 85 | left: 100%; 86 | right: -90%; } 87 | } 88 | 89 | @-webkit-keyframes ui-progressbar-indeterminate-anim-short { 90 | 0% { 91 | left: -200%; 92 | right: 100%; } 93 | 60% { 94 | left: 107%; 95 | right: -8%; } 96 | 100% { 97 | left: 107%; 98 | right: -8%; } 99 | } 100 | @keyframes ui-progressbar-indeterminate-anim-short { 101 | 0% { 102 | left: -200%; 103 | right: 100%; } 104 | 60% { 105 | left: 107%; 106 | right: -8%; } 107 | 100% { 108 | left: 107%; 109 | right: -8%; } 110 | } -------------------------------------------------------------------------------- /demo/assets/components/progressspinner/progressspinner.css: -------------------------------------------------------------------------------- 1 | .ui-progress-spinner { 2 | position: relative; 3 | margin: 0 auto; 4 | width: 100px; 5 | height: 100px; 6 | display: inline-block; 7 | } 8 | 9 | .ui-progress-spinner::before { 10 | content: ''; 11 | display: block; 12 | padding-top: 100%; 13 | } 14 | 15 | .ui-progress-spinner-svg { 16 | animation: ui-progress-spinner-rotate 2s linear infinite; 17 | height: 100%; 18 | transform-origin: center center; 19 | width: 100%; 20 | position: absolute; 21 | top: 0; 22 | bottom: 0; 23 | left: 0; 24 | right: 0; 25 | margin: auto; 26 | } 27 | 28 | .ui-progress-spinner-circle { 29 | stroke-dasharray: 1, 200; 30 | stroke-dashoffset: 0; 31 | animation: ui-progress-spinner-dash 1.5s ease-in-out infinite, ui-progress-spinner-color 6s ease-in-out infinite; 32 | stroke-linecap: round; 33 | } 34 | 35 | @keyframes ui-progress-spinner-rotate { 36 | 100% { 37 | transform: rotate(360deg); 38 | } 39 | } 40 | 41 | @keyframes ui-progress-spinner-dash { 42 | 0% { 43 | stroke-dasharray: 1, 200; 44 | stroke-dashoffset: 0; 45 | } 46 | 50% { 47 | stroke-dasharray: 89, 200; 48 | stroke-dashoffset: -35px; 49 | } 50 | 100% { 51 | stroke-dasharray: 89, 200; 52 | stroke-dashoffset: -124px; 53 | } 54 | } 55 | 56 | @keyframes ui-progress-spinner-color { 57 | 100%, 58 | 0% { 59 | stroke: #d62d20; 60 | } 61 | 40% { 62 | stroke: #0057e7; 63 | } 64 | 66% { 65 | stroke: #008744; 66 | } 67 | 80%, 68 | 90% { 69 | stroke: #ffa700; 70 | } 71 | } -------------------------------------------------------------------------------- /demo/assets/components/radiobutton/radiobutton.css: -------------------------------------------------------------------------------- 1 | .ui-radiobutton { 2 | display:inline-block; 3 | cursor: pointer; 4 | vertical-align: middle; 5 | margin-right: .25em; 6 | } 7 | 8 | .ui-radiobutton-box { 9 | width: 1.125em; 10 | height: 1.125em; 11 | line-height: 1.125em; 12 | -moz-border-radius: 100%; 13 | -webkit-border-radius: 100%; 14 | border-radius: 100%; 15 | text-align: center; 16 | position: relative; 17 | } 18 | 19 | .ui-radiobutton-icon { 20 | display: block; 21 | position: absolute; 22 | left: 50%; 23 | top: 50%; 24 | width: 1em; 25 | height: 1em; 26 | margin-top: -.5em; 27 | margin-left: -.5em; 28 | } 29 | 30 | .ui-radiobutton, .ui-radiobutton-label { 31 | vertical-align: middle; 32 | } -------------------------------------------------------------------------------- /demo/assets/components/rating/rating.css: -------------------------------------------------------------------------------- 1 | .ui-rating { 2 | font-size: 1.25em; 3 | } -------------------------------------------------------------------------------- /demo/assets/components/schedule/schedule.css: -------------------------------------------------------------------------------- 1 | .ui-fluid .fc .ui-button { 2 | width: auto; 3 | } -------------------------------------------------------------------------------- /demo/assets/components/scrollpanel/scrollpanel.css: -------------------------------------------------------------------------------- 1 | .ui-scrollpanel-wrapper { 2 | overflow: hidden; 3 | width: 100%; 4 | height: 100%; 5 | position: relative; 6 | z-index: 1; 7 | float: left; 8 | } 9 | 10 | .ui-scrollpanel-content { 11 | height: calc(100% + 18px); 12 | width: calc(100% + 18px); 13 | padding: 0 0 0 0; 14 | position: relative; 15 | overflow: auto; 16 | box-sizing: border-box; 17 | } 18 | 19 | .ui-scrollpanel-bar { 20 | position: relative; 21 | background: #c1c1c1; 22 | border-radius: 3px; 23 | z-index: 2; 24 | cursor: pointer; 25 | opacity: 0; 26 | transition: opacity 0.25s linear; 27 | } 28 | 29 | .ui-scrollpanel-bar-y { 30 | width: 9px; 31 | top: 0; 32 | } 33 | 34 | .ui-scrollpanel-bar-x { 35 | height: 9px; 36 | bottom: 0; 37 | } 38 | 39 | .ui-scrollpanel-hidden { 40 | visibility: hidden; 41 | } 42 | 43 | .ui-scrollpanel:hover .ui-scrollpanel-bar, 44 | .ui-scrollpanel:active .ui-scrollpanel-bar { 45 | opacity: 1; 46 | } 47 | 48 | .ui-scrollpanel-grabbed { 49 | -o-user-select: none; 50 | -ms-user-select: none; 51 | -moz-user-select: none; 52 | -webkit-user-select: none; 53 | user-select: none; 54 | } -------------------------------------------------------------------------------- /demo/assets/components/selectbutton/selectbutton.css: -------------------------------------------------------------------------------- 1 | .ui-selectbutton { 2 | display: inline-block; 3 | } 4 | 5 | .ui-selectbutton.ui-state-error { 6 | padding: 0; 7 | } 8 | 9 | .ui-selectbutton .ui-button.ui-state-focus { 10 | outline: none; 11 | } -------------------------------------------------------------------------------- /demo/assets/components/sidebar/sidebar.css: -------------------------------------------------------------------------------- 1 | .ui-sidebar { 2 | position: fixed; 3 | padding: .5em 1em; 4 | -webkit-transition: transform .3s; 5 | transition: transform .3s; 6 | } 7 | 8 | .ui-sidebar-left { 9 | top: 0; 10 | left: 0; 11 | width: 20em; 12 | height: 100%; 13 | -webkit-transform: translateX(-100%); 14 | -ms-transform: translateX(-100%); 15 | transform: translateX(-100%); 16 | } 17 | 18 | .ui-sidebar-right { 19 | top: 0; 20 | right: 0; 21 | width: 20em; 22 | height: 100%; 23 | -webkit-transform: translateX(100%); 24 | -ms-transform: translateX(100%); 25 | transform: translateX(100%); 26 | } 27 | 28 | .ui-sidebar-top { 29 | top: 0; 30 | left: 0; 31 | width: 100%; 32 | height: 10em; 33 | -webkit-transform: translateY(-100%); 34 | -ms-transform: translateY(-100%); 35 | transform: translateY(-100%); 36 | } 37 | 38 | .ui-sidebar-bottom { 39 | bottom: 0; 40 | left: 0; 41 | width: 100%; 42 | height: 10em; 43 | -webkit-transform: translateY(100%); 44 | -ms-transform: translateY(100%); 45 | transform: translateY(100%); 46 | } 47 | 48 | .ui-sidebar-full { 49 | width: 100%; 50 | height: 100%; 51 | left: 0; 52 | -webkit-transition: transform 0s; 53 | transition: transform 0s; 54 | } 55 | 56 | .ui-sidebar-left.ui-sidebar-active, 57 | .ui-sidebar-right.ui-sidebar-active { 58 | -webkit-transform: translateX(0); 59 | -ms-transform: translateX(0); 60 | transform: translateX(0) 61 | } 62 | 63 | .ui-sidebar-left.ui-sidebar-sm, 64 | .ui-sidebar-right.ui-sidebar-sm { 65 | width: 20em; 66 | } 67 | 68 | .ui-sidebar-left.ui-sidebar-md, 69 | .ui-sidebar-right.ui-sidebar-md { 70 | width: 40em; 71 | } 72 | 73 | .ui-sidebar-left.ui-sidebar-lg, 74 | .ui-sidebar-right.ui-sidebar-lg { 75 | width: 60em; 76 | } 77 | 78 | .ui-sidebar-top.ui-sidebar-active, 79 | .ui-sidebar-bottom.ui-sidebar-active { 80 | -webkit-transform: translateY(0); 81 | -ms-transform: translateY(0); 82 | transform: translateY(0) 83 | } 84 | 85 | .ui-sidebar-top.ui-sidebar-sm, 86 | .ui-sidebar-bottom.ui-sidebar-sm { 87 | height: 10em; 88 | } 89 | 90 | .ui-sidebar-top.ui-sidebar-md, 91 | .ui-sidebar-bottom.ui-sidebar-md { 92 | height: 20em; 93 | } 94 | 95 | .ui-sidebar-top.ui-sidebar-lg, 96 | .ui-sidebar-bottom.ui-sidebar-lg { 97 | height: 30em; 98 | } 99 | 100 | .ui-sidebar-mask { 101 | position: fixed; 102 | width: 100%; 103 | height: 100%; 104 | } 105 | 106 | .ui-sidebar-close { 107 | float: right; 108 | } 109 | 110 | @media screen and (max-width: 64em) { 111 | .ui-sidebar-left.ui-sidebar-lg, 112 | .ui-sidebar-left.ui-sidebar-md, 113 | .ui-sidebar-right.ui-sidebar-lg, 114 | .ui-sidebar-right.ui-sidebar-md { 115 | width: 20em; 116 | } 117 | } -------------------------------------------------------------------------------- /demo/assets/components/slidemenu/slidemenu.css: -------------------------------------------------------------------------------- 1 | .ui-slidemenu { 2 | width: 12.5em; 3 | padding: .25em; 4 | } 5 | 6 | .ui-slidemenu.ui-slidemenu-dynamic { 7 | position: absolute; 8 | } 9 | 10 | .ui-slidemenu .ui-menu-separator { 11 | border-width: 1px 0 0 0; 12 | } 13 | 14 | .ui-slidemenu ul { 15 | list-style: none; 16 | margin: 0; 17 | padding: 0; 18 | } 19 | 20 | .ui-slidemenu .ui-slidemenu-rootlist { 21 | position: absolute; 22 | top: 0; 23 | } 24 | 25 | .ui-slidemenu .ui-submenu-list { 26 | display: none; 27 | position: absolute; 28 | top: 0; 29 | width: 12.5em; 30 | padding: .25em; 31 | } 32 | 33 | .ui-slidemenu .ui-menuitem-link { 34 | padding: .25em; 35 | display: block; 36 | position: relative; 37 | text-decoration: none; 38 | } 39 | 40 | .ui-slidemenu .ui-menuitem-icon { 41 | margin-right: .25em; 42 | } 43 | 44 | .ui-slidemenu .ui-menuitem { 45 | position: relative; 46 | margin: .125em 0; 47 | } 48 | 49 | .ui-slidemenu .ui-menuitem-link .ui-submenu-icon { 50 | position: absolute; 51 | margin-top: -.5em; 52 | right: 0; 53 | top: 50%; 54 | } 55 | 56 | .ui-slidemenu .ui-slidemenu-wrapper { 57 | position: relative; 58 | } 59 | 60 | .ui-slidemenu .ui-slidemenu-content { 61 | overflow-x: hidden; 62 | overflow-y: auto; 63 | position: relative; 64 | } 65 | 66 | .ui-slidemenu-backward { 67 | position: absolute; 68 | bottom: 0; 69 | width: 100%; 70 | padding: 0.25em; 71 | cursor: pointer; 72 | display: none; 73 | } 74 | 75 | .ui-slidemenu-backward .ui-slidemenu-backward-icon { 76 | vertical-align: middle; 77 | } 78 | 79 | .ui-slidemenu-backward span { 80 | vertical-align: middle; 81 | } 82 | 83 | .ui-slidemenu .ui-menuitem-active { 84 | position: static; 85 | } 86 | 87 | .ui-slidemenu .ui-menuitem-active > .ui-submenu > .ui-submenu-list { 88 | display: block; 89 | } 90 | 91 | .ui-slidemenu ul:not(.ui-active-submenu) > .ui-menuitem:not(.ui-menuitem-active), 92 | .ui-slidemenu .ui-active-submenu > .ui-menuitem-active > .ui-submenu > .ui-submenu-list { 93 | display: none; 94 | } 95 | 96 | .ui-slidemenu .ui-active-submenu > .ui-menuitem-active ~ .ui-menuitem { 97 | display: block; 98 | } -------------------------------------------------------------------------------- /demo/assets/components/slider/slider.css: -------------------------------------------------------------------------------- 1 | .ui-slider { 2 | position: relative; 3 | text-align: left; 4 | } 5 | .ui-slider .ui-slider-handle { 6 | position: absolute; 7 | width: 1.2em; 8 | height: 1.2em; 9 | cursor: default; 10 | -ms-touch-action: none; 11 | touch-action: none; 12 | z-index: 1; 13 | } 14 | .ui-slider .ui-slider-handle.ui-slider-handle-active { 15 | z-index: 2; 16 | } 17 | .ui-slider .ui-slider-range { 18 | position: absolute; 19 | font-size: .7em; 20 | display: block; 21 | border: 0; 22 | background-position: 0 0; 23 | } 24 | 25 | .ui-slider-horizontal { 26 | height: .8em; 27 | } 28 | .ui-slider-horizontal .ui-slider-handle { 29 | top: -.25em; 30 | margin-left: -.6em; 31 | } 32 | .ui-slider-horizontal .ui-slider-range { 33 | top: 0; 34 | height: 100%; 35 | } 36 | .ui-slider-horizontal .ui-slider-range-min { 37 | left: 0; 38 | } 39 | .ui-slider-horizontal .ui-slider-range-max { 40 | right: 0; 41 | } 42 | 43 | .ui-slider-vertical { 44 | width: .8em; 45 | height: 100px; 46 | } 47 | .ui-slider-vertical .ui-slider-handle { 48 | left: -.25em; 49 | margin-left: 0; 50 | margin-bottom: -.6em; 51 | } 52 | .ui-slider-vertical .ui-slider-range { 53 | left: 0; 54 | width: 100%; 55 | } 56 | .ui-slider-vertical .ui-slider-range-min { 57 | bottom: 0; 58 | } 59 | .ui-slider-vertical .ui-slider-range-max { 60 | top: 0; 61 | } 62 | 63 | .ui-slider-animate .ui-slider-handle { 64 | transition: left .3s; 65 | } -------------------------------------------------------------------------------- /demo/assets/components/spinner/spinner.css: -------------------------------------------------------------------------------- 1 | .ui-spinner { 2 | display: inline-block; 3 | overflow: visible; 4 | padding: 0; 5 | position: relative; 6 | vertical-align: middle; 7 | } 8 | 9 | .ui-spinner-input { 10 | vertical-align: middle; 11 | padding-right: 1.5em; 12 | } 13 | 14 | .ui-spinner-button { 15 | cursor: default; 16 | display: block; 17 | height: 50%; 18 | margin: 0; 19 | overflow: hidden; 20 | padding: 0; 21 | position: absolute; 22 | right: 0; 23 | text-align: center; 24 | vertical-align: middle; 25 | width: 1.5em; 26 | } 27 | 28 | .ui-spinner .ui-spinner-button-icon { 29 | position: absolute; 30 | top: 50%; 31 | left: 50%; 32 | margin-top: -.5em; 33 | margin-left: -.5em; 34 | width: 1em; 35 | } 36 | 37 | .ui-spinner-up { 38 | top: 0; 39 | } 40 | 41 | .ui-spinner-down { 42 | bottom: 0; 43 | } 44 | 45 | /* Fluid */ 46 | .ui-fluid .ui-spinner { 47 | width: 100%; 48 | } 49 | 50 | .ui-fluid .ui-spinner .ui-spinner-input { 51 | padding-right: 2em; 52 | width: 100%; 53 | } 54 | 55 | .ui-fluid .ui-spinner .ui-spinner-button { 56 | width: 1.5em; 57 | } 58 | 59 | .ui-fluid .ui-spinner .ui-spinner-button .ui-spinner-button-icon { 60 | left: .7em; 61 | } -------------------------------------------------------------------------------- /demo/assets/components/splitbutton/splitbutton.css: -------------------------------------------------------------------------------- 1 | .ui-splitbutton { 2 | position: relative; 3 | display: inline-block; 4 | zoom: 1; 5 | } 6 | 7 | .ui-splitbutton .ui-button.ui-splitbutton-menubutton { 8 | width: 2em; 9 | vertical-align: top; 10 | } 11 | 12 | .ui-splitbutton.ui-state-disabled button { 13 | cursor: default; 14 | } 15 | 16 | .ui-fluid .ui-splitbutton { 17 | width: 100%; 18 | } 19 | 20 | .ui-fluid .ui-splitbutton .ui-button:first-child { 21 | width: calc(100% - 2em); 22 | } 23 | 24 | .ui-fluid .ui-splitbutton .ui-button.ui-splitbutton-menubutton { 25 | width: 2em; 26 | } -------------------------------------------------------------------------------- /demo/assets/components/steps/steps.css: -------------------------------------------------------------------------------- 1 | .ui-steps ul { 2 | list-style-type: none; 3 | padding: 0; 4 | margin: 0; 5 | } 6 | 7 | .ui-steps .ui-steps-item { 8 | float: left; 9 | box-sizing: border-box; 10 | cursor: pointer; 11 | } 12 | 13 | .ui-steps.ui-steps-readonly .ui-steps-item { 14 | cursor: auto; 15 | } 16 | 17 | .ui-steps .ui-steps-item .ui-menuitem-link { 18 | text-decoration: none; 19 | display: block; 20 | padding: 1em; 21 | position: relative; 22 | text-align: center; 23 | } 24 | 25 | .ui-steps .ui-steps-item.ui-state-highlight .ui-menuitem-link, 26 | .ui-steps .ui-steps-item.ui-state-disabled .ui-menuitem-link { 27 | cursor: default; 28 | } 29 | 30 | .ui-steps .ui-steps-number { 31 | font-size: 200%; 32 | display: block; 33 | } 34 | 35 | .ui-steps .ui-steps-title { 36 | display: block; 37 | white-space: nowrap; 38 | } 39 | 40 | /* Responsive */ 41 | @media (max-width: 40em) { 42 | .ui-steps .ui-steps-item .ui-menuitem-link { 43 | padding: 0.5em; 44 | } 45 | 46 | .ui-steps .ui-steps-item .ui-steps-title { 47 | display: none; 48 | } 49 | } -------------------------------------------------------------------------------- /demo/assets/components/tabmenu/tabmenu.css: -------------------------------------------------------------------------------- 1 | /** TabMenu **/ 2 | .ui-tabmenu .ui-tabmenu-nav { 3 | margin: 0; 4 | padding: .25em .5em 0 .25em; 5 | } 6 | 7 | .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem { 8 | list-style: none; 9 | float: left; 10 | position: relative; 11 | margin: 0 .2em 1px 0; 12 | padding: 0; 13 | white-space: nowrap; 14 | display: block; 15 | border-bottom: 0; 16 | top: 1px; 17 | } 18 | 19 | .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem a { 20 | float: left; 21 | padding: 0.5em 1em; 22 | text-decoration: none; 23 | } 24 | 25 | .ui-tabmenu .ui-tabmenu-nav a { 26 | padding: 0.5em 1em; 27 | } 28 | 29 | .ui-tabmenu .ui-menuitem-icon { 30 | margin-right: .25em; 31 | } 32 | 33 | .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem.ui-state-disabled a { 34 | cursor: default; 35 | } -------------------------------------------------------------------------------- /demo/assets/components/tabview/tabview.css: -------------------------------------------------------------------------------- 1 | .ui-tabview { 2 | padding: .25em; 3 | } 4 | 5 | .ui-tabview .ui-tabview-nav { 6 | margin: 0; 7 | } 8 | 9 | .ui-tabview .ui-tabview-nav li { 10 | list-style: none; 11 | float: left; 12 | position: relative; 13 | margin: 0 .125em 1px 0; 14 | padding: 0; 15 | white-space: nowrap; 16 | } 17 | 18 | .ui-tabview .ui-tabview-nav li a { 19 | float: left; 20 | padding: .5em 1em; 21 | text-decoration: none; 22 | } 23 | 24 | .ui-tabview .ui-tabview-nav li.ui-tabview-selected a, 25 | .ui-tabview .ui-tabview-nav li.ui-state-disabled a, 26 | .ui-tabview .ui-tabview-nav li.ui-state-processing a { 27 | cursor: text; 28 | } 29 | 30 | .ui-tabview .ui-tabview-nav li a, 31 | .ui-tabview.ui-tabview-collapsible .ui-tabview-nav li.ui-tabview-selected a { 32 | cursor: pointer; 33 | } 34 | 35 | .ui-tabview .ui-tabview-panel { 36 | border-width: 0; 37 | padding: 1em; 38 | background: none; 39 | } 40 | 41 | .ui-tabview .ui-tabview-nav li { 42 | display: block; 43 | } 44 | 45 | .ui-tabview .ui-tabview-nav li .ui-tabview-left-icon { 46 | margin-right: .25em; 47 | } 48 | 49 | .ui-tabview .ui-tabview-nav li .ui-tabview-right-icon { 50 | margin-left: .25em; 51 | } 52 | 53 | .ui-tabview .ui-tabview-nav li .ui-tabview-close { 54 | margin: 0.5em 0.3em 0 0; 55 | cursor: pointer; 56 | } 57 | 58 | /* per orientation settings */ 59 | /* top and bottom */ 60 | .ui-tabview.ui-tabview-top > .ui-tabview-nav li { 61 | border-bottom: 0; 62 | top: 1px; 63 | } 64 | 65 | .ui-tabview.ui-tabview-top > .ui-tabview-nav { 66 | padding: .2em .2em 0; 67 | } 68 | 69 | .ui-tabview.ui-tabview-bottom > .ui-tabview-nav { 70 | padding: 0 .2em .2em; 71 | } 72 | 73 | .ui-tabview.ui-tabview-bottom > .ui-tabview-nav li { 74 | border-top: 0; 75 | } 76 | 77 | /* left and right*/ 78 | .ui-tabview-left::after, 79 | .ui-tabview-right::after { 80 | clear:both; 81 | content: "."; 82 | display: block; 83 | height: 0; 84 | visibility: hidden; 85 | } 86 | 87 | .ui-tabview-left > .ui-tabview-nav { 88 | float:left; 89 | width: 25%; 90 | height: 300px; 91 | background-image: none; 92 | padding-top: 1px; 93 | } 94 | 95 | .ui-tabview-left > .ui-tabview-panels { 96 | float:right; 97 | width: 75%; 98 | } 99 | 100 | .ui-tabview.ui-tabview-left > .ui-tabview-nav li, 101 | .ui-tabview.ui-tabview-right > .ui-tabview-nav li{ 102 | display: block; 103 | float: right; 104 | white-space: normal; 105 | width: 99%; 106 | } 107 | 108 | .ui-tabview.ui-tabview-left > .ui-tabview-nav li { 109 | margin: 0 0 1px 0; 110 | border-right:0 none; 111 | } 112 | 113 | .ui-tabview.ui-tabview-right > .ui-tabview-nav { 114 | float:right; 115 | width: 25%; 116 | height: 300px; 117 | background-image: none; 118 | padding-top: 1px; 119 | } 120 | 121 | .ui-tabview.ui-tabview-right > .ui-tabview-panels { 122 | float:left; 123 | width: 75%; 124 | } 125 | 126 | .ui-tabview.ui-tabview-right > .ui-tabview-nav li { 127 | margin: 0 0 1px 0; 128 | border-left:0 none; 129 | } 130 | 131 | /* RTL */ 132 | .ui-rtl .ui-tabview .ui-tabview-nav li { 133 | float: right; 134 | } 135 | -------------------------------------------------------------------------------- /demo/assets/components/terminal/terminal.css: -------------------------------------------------------------------------------- 1 | .ui-terminal { 2 | height: 18em; 3 | overflow: auto; 4 | padding: .25em; 5 | } 6 | 7 | .ui-terminal-input { 8 | border: 0 none; 9 | background-color: transparent; 10 | color: inherit; 11 | padding: 0; 12 | margin: 0 0 0 .125em; 13 | width: 75%; 14 | outline: none; 15 | vertical-align: baseline; 16 | } 17 | 18 | .ui-terminal-command { 19 | margin-left: .125em; 20 | -moz-margin-start: .125em; 21 | } 22 | 23 | .ui-terminal-input::-ms-clear { 24 | display: none; 25 | } -------------------------------------------------------------------------------- /demo/assets/components/tieredmenu/tieredmenu.css: -------------------------------------------------------------------------------- 1 | .ui-tieredmenu { 2 | width: 12.5em; 3 | padding: .25em; 4 | } 5 | 6 | .ui-tieredmenu.ui-tieredmenu-dynamic { 7 | position: absolute; 8 | } 9 | 10 | .ui-tieredmenu .ui-menu-separator { 11 | border-width: 1px 0 0 0; 12 | } 13 | 14 | .ui-tieredmenu ul { 15 | list-style: none; 16 | margin: 0; 17 | padding: 0; 18 | } 19 | 20 | .ui-tieredmenu .ui-submenu-list { 21 | display: none; 22 | position: absolute; 23 | width: 12.5em; 24 | padding: .25em; 25 | } 26 | 27 | .ui-tieredmenu .ui-menuitem-link { 28 | padding: .25em; 29 | display: block; 30 | position: relative; 31 | text-decoration: none; 32 | } 33 | 34 | .ui-tieredmenu .ui-menuitem-icon { 35 | margin-right: .25em; 36 | } 37 | 38 | .ui-tieredmenu .ui-menuitem { 39 | position: relative; 40 | margin: .125em 0; 41 | } 42 | 43 | .ui-tieredmenu .ui-menuitem-link .ui-submenu-icon { 44 | position: absolute; 45 | margin-top: -.5em; 46 | right: 0; 47 | top: 50%; 48 | } 49 | 50 | .ui-tieredmenu .ui-menuitem-active > .ui-submenu > .ui-submenu-list { 51 | display: block; 52 | } -------------------------------------------------------------------------------- /demo/assets/components/toast/toast.css: -------------------------------------------------------------------------------- 1 | .ui-toast { 2 | position: fixed; 3 | width: 20em; 4 | } 5 | 6 | .ui-toast-message { 7 | position: relative; 8 | display: block; 9 | margin-bottom: .75em; 10 | overflow: hidden; 11 | } 12 | 13 | .ui-toast-message-content { 14 | padding: .5em 1em; 15 | } 16 | 17 | .ui-toast-close-icon { 18 | position: absolute; 19 | top: .25em; 20 | right: .25em; 21 | cursor: pointer; 22 | display: inline-block; 23 | } 24 | 25 | .ui-toast-summary { 26 | font-weight: bold; 27 | padding: 0 0 .5em 0; 28 | display: block; 29 | } 30 | 31 | .ui-toast-icon { 32 | position: absolute; 33 | display: inline-block; 34 | left: .5em; 35 | top: .25em; 36 | padding: 0; 37 | font-size: 2em; 38 | } 39 | 40 | .ui-toast-message-text-content { 41 | padding: 0 0 .25em 0; 42 | margin-left: 2.5em; 43 | } 44 | 45 | .ui-toast-message-info { 46 | color: #1765A3; 47 | background-color: #BFE0FA; 48 | border-color: #BFE0FA; 49 | } 50 | 51 | .ui-toast-message-info .ui-toast-close-icon { 52 | color: #1765A3; 53 | } 54 | 55 | .ui-toast-message-success { 56 | color: #2C832f; 57 | background-color: #B4F0B6; 58 | border-color: #B4F0B6; 59 | } 60 | 61 | .ui-toast-message-success .ui-toast-close-icon { 62 | color: #2C832f; 63 | } 64 | 65 | .ui-toast-message-warn { 66 | color: #8A6714; 67 | background-color: #FFE9B5; 68 | border-color: #FFE9B5; 69 | } 70 | 71 | .ui-toast-message-warn .ui-toast-close-icon { 72 | color: #8A6714; 73 | } 74 | 75 | .ui-toast-message-error { 76 | color: #AB1A0F; 77 | background-color: #FFCBC8; 78 | border-color: #FFCBC8; 79 | } 80 | 81 | .ui-toast-message-error .ui-toast-close-icon { 82 | color: #AB1A0F; 83 | } 84 | 85 | /* Positions */ 86 | .ui-toast-top-right { 87 | top: 20px; 88 | right: 20px; 89 | } 90 | 91 | .ui-toast-top-left { 92 | top: 20px; 93 | left: 20px; 94 | } 95 | 96 | .ui-toast-bottom-right { 97 | bottom: 20px; 98 | right: 20px; 99 | } 100 | 101 | .ui-toast-bottom-left { 102 | bottom: 20px; 103 | right: 20px; 104 | } 105 | 106 | .ui-toast-top-center { 107 | top: 20px; 108 | left: 50%; 109 | margin-left: -10em; 110 | } 111 | 112 | .ui-toast-bottom-center { 113 | bottom: 20px; 114 | left: 50%; 115 | margin-left: -10em; 116 | } 117 | 118 | .ui-toast-center { 119 | left: 50%; 120 | top: 50%; 121 | min-width: 20vw; 122 | transform: translate(-50%, -50%); 123 | } -------------------------------------------------------------------------------- /demo/assets/components/toolbar/toolbar.css: -------------------------------------------------------------------------------- 1 | .ui-toolbar { 2 | padding: .25em .5em; 3 | } 4 | 5 | .ui-toolbar-group-left { 6 | float:left 7 | } 8 | 9 | .ui-toolbar-group-right { 10 | float:right 11 | } -------------------------------------------------------------------------------- /demo/assets/components/tooltip/tooltip.css: -------------------------------------------------------------------------------- 1 | .ui-tooltip { 2 | position:absolute; 3 | display:none; 4 | padding: .25em .5em; 5 | max-width: 12.5em; 6 | } 7 | 8 | .ui-tooltip.ui-tooltip-right, 9 | .ui-tooltip.ui-tooltip-left { 10 | padding: 0 .25em; 11 | } 12 | 13 | .ui-tooltip.ui-tooltip-top, 14 | .ui-tooltip.ui-tooltip-bottom { 15 | padding:.25em 0; 16 | } 17 | 18 | .ui-tooltip .ui-tooltip-text { 19 | padding: .125em .5em; 20 | background-color: rgb(76, 76, 76); 21 | color: #ffffff; 22 | white-space: pre-line; 23 | } 24 | 25 | .ui-tooltip-arrow { 26 | position: absolute; 27 | width: 0; 28 | height: 0; 29 | border-color: transparent; 30 | border-style: solid; 31 | } 32 | 33 | .ui-tooltip-right .ui-tooltip-arrow { 34 | top: 50%; 35 | left: 0; 36 | margin-top: -.25em; 37 | border-width: .25em .25em .25em 0; 38 | border-right-color: rgb(76, 76, 76); 39 | } 40 | 41 | .ui-tooltip-left .ui-tooltip-arrow { 42 | top: 50%; 43 | right: 0; 44 | margin-top: -.25em; 45 | border-width: .25em 0 .25em .25em; 46 | border-left-color: rgb(76, 76, 76); 47 | } 48 | 49 | .ui-tooltip.ui-tooltip-top { 50 | padding: .25em 0; 51 | } 52 | 53 | .ui-tooltip-top .ui-tooltip-arrow { 54 | bottom: 0; 55 | left: 50%; 56 | margin-left: -.25em; 57 | border-width: .25em .25em 0; 58 | border-top-color: rgb(76, 76, 76); 59 | } 60 | 61 | .ui-tooltip-bottom .ui-tooltip-arrow { 62 | top: 0; 63 | left: 50%; 64 | margin-left: -.25em; 65 | border-width: 0 .25em .25em; 66 | border-bottom-color: rgb(76, 76, 76); 67 | } -------------------------------------------------------------------------------- /demo/assets/components/tree/tree.css: -------------------------------------------------------------------------------- 1 | .ui-tree { 2 | width: 18em; 3 | } 4 | 5 | .ui-tree .ui-treenode-selectable.ui-treenode-content { 6 | cursor: pointer; 7 | } 8 | 9 | .ui-tree .ui-tree-container { 10 | height: 100%; 11 | margin: 0; 12 | overflow: auto; 13 | padding: .25em; 14 | white-space: nowrap; 15 | } 16 | 17 | .ui-tree-empty-message { 18 | padding: .25em; 19 | } 20 | 21 | .ui-tree .ui-treenode-children { 22 | margin: 0; 23 | padding: 0 0 0 1em; 24 | } 25 | 26 | .ui-tree .ui-treenode { 27 | background-attachment: scroll; 28 | background-color: transparent; 29 | background-image: none; 30 | background-position: 0 0; 31 | background-repeat: repeat-y; 32 | list-style: none outside none; 33 | margin: 0; 34 | padding: .125em 0 0 0; 35 | } 36 | 37 | .ui-tree .ui-treenode-droppoint { 38 | height: 4px; 39 | list-style-type: none; 40 | } 41 | 42 | .ui-tree .ui-treenode-droppoint-active { 43 | border: 0 none; 44 | } 45 | 46 | .ui-tree .ui-tree-toggler { 47 | cursor: pointer; 48 | display: inline-block; 49 | vertical-align: middle; 50 | } 51 | 52 | .ui-tree .ui-treenode-icon { 53 | display: inline-block; 54 | vertical-align: middle; 55 | } 56 | 57 | .ui-tree .ui-treenode-label { 58 | display: inline-block; 59 | padding: 0 .25em; 60 | vertical-align: middle; 61 | } 62 | 63 | .ui-tree .ui-treenode-label.ui-state-hover, 64 | .ui-tree .ui-treenode-label.ui-state-highlight { 65 | font-weight: normal; 66 | border: 0 none; 67 | } 68 | 69 | .ui-tree .ui-treenode.ui-treenode-leaf > .ui-treenode-content > .ui-tree-toggler { 70 | visibility: hidden; 71 | } 72 | 73 | .ui-tree .ui-chkbox-box { 74 | cursor: pointer; 75 | } 76 | 77 | .ui-tree .ui-chkbox { 78 | display: inline-block; 79 | vertical-align: middle; 80 | } 81 | 82 | .ui-tree .ui-chkbox .ui-chkbox-icon { 83 | margin-left: 1px; 84 | } 85 | 86 | /** Fluid **/ 87 | .ui-fluid .ui-tree { 88 | width: 100%; 89 | } 90 | 91 | /** Horizontal Tree **/ 92 | .ui-tree-horizontal { 93 | width:auto; 94 | padding: .5em 0; 95 | overflow:auto; 96 | } 97 | 98 | .ui-tree.ui-tree-horizontal table, 99 | .ui-tree.ui-tree-horizontal tr, 100 | .ui-tree.ui-tree-horizontal td { 101 | border-collapse: collapse; 102 | margin: 0; 103 | padding: 0; 104 | vertical-align: middle; 105 | } 106 | 107 | .ui-tree.ui-tree-horizontal .ui-tree-toggler { 108 | vertical-align: middle; 109 | margin: 0; 110 | } 111 | 112 | .ui-tree-horizontal .ui-treenode-content { 113 | font-weight: normal; 114 | padding: 0.4em 1em 0.4em 0.2em; 115 | } 116 | 117 | .ui-tree.ui-tree-horizontal .ui-tree-node-label { 118 | margin: 0; 119 | } 120 | 121 | .ui-tree-horizontal .ui-treenode-parent .ui-treenode-content { 122 | font-weight: normal; 123 | white-space: nowrap; 124 | } 125 | 126 | .ui-tree.ui-tree-horizontal .ui-treenode { 127 | background: url("./images/line.gif") repeat-x scroll center center transparent; 128 | padding: .25em 2.5em; 129 | } 130 | 131 | .ui-tree.ui-tree-horizontal .ui-treenode.ui-treenode-leaf, 132 | .ui-tree.ui-tree-horizontal .ui-treenode.ui-treenode-collapsed { 133 | padding-right: 0; 134 | } 135 | 136 | .ui-tree.ui-tree-horizontal .ui-treenode-children { 137 | padding: 0; 138 | margin: 0; 139 | } 140 | 141 | .ui-tree.ui-tree-horizontal .ui-treenode-connector { 142 | width: 1px; 143 | } 144 | 145 | .ui-tree.ui-tree-horizontal .ui-treenode-connector-table { 146 | height: 100%; 147 | width: 1px; 148 | } 149 | 150 | .ui-tree.ui-tree-horizontal .ui-treenode-connector-line { 151 | background: url("./images/line.gif") repeat-y scroll 0 0 transparent; 152 | width: 1px; 153 | } 154 | 155 | .ui-tree.ui-tree-horizontal table { 156 | height: 0; 157 | } 158 | 159 | .ui-tree.ui-tree-horizontal .ui-chkbox { 160 | vertical-align: bottom; 161 | margin-right: .25em; 162 | } 163 | 164 | /** Loading **/ 165 | .ui-tree.ui-tree-loading { 166 | position: relative; 167 | min-height: 4em; 168 | } 169 | 170 | .ui-tree .ui-tree-loading-mask { 171 | position: absolute; 172 | width: 100%; 173 | height: 100%; 174 | -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)"; 175 | opacity: 0.1; 176 | z-index: 1; 177 | } 178 | 179 | .ui-tree .ui-tree-loading-content { 180 | position: absolute; 181 | left: 50%; 182 | top: 50%; 183 | z-index: 2; 184 | margin-top: -1em; 185 | margin-left: -1em; 186 | } 187 | 188 | .ui-tree .ui-tree-loading-content .ui-tree-loading-icon { 189 | font-size: 2em; 190 | } 191 | -------------------------------------------------------------------------------- /demo/assets/fonts/primeicons.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/fonts/primeicons.eot -------------------------------------------------------------------------------- /demo/assets/fonts/primeicons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/fonts/primeicons.ttf -------------------------------------------------------------------------------- /demo/assets/fonts/primeicons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/fonts/primeicons.woff -------------------------------------------------------------------------------- /demo/assets/images/color.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/images/color.png -------------------------------------------------------------------------------- /demo/assets/images/hue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/images/hue.png -------------------------------------------------------------------------------- /demo/assets/images/line.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/images/line.gif -------------------------------------------------------------------------------- /demo/assets/images/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/images/loading.gif -------------------------------------------------------------------------------- /demo/assets/images/password-meter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/images/password-meter.png -------------------------------------------------------------------------------- /demo/assets/readme.txt: -------------------------------------------------------------------------------- 1 | Configure required styles at the styles section, example below uses the Omega theme. 2 | 3 | "styles": [ 4 | "node_modules/primeng/resources/themes/omega/theme.css", 5 | "node_modules/primeng/resources/primeng.min.css", 6 | "node_modules/primeicons/primeicons.css", 7 | //... 8 | ], 9 | -------------------------------------------------------------------------------- /demo/assets/themes/cruze/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: Segoe UI, Arial, sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 3px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #333333; 9 | $headerBgColor: #333333; 10 | $headerTextColor: #eeeeee; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #eeeeee; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #666666; 17 | $contentBgColor: #575757; 18 | $contentTextColor: #eeeeee; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #2e2e2e; 23 | $stateDefaultBgColor: #3d3d3d; 24 | $stateDefaultTextColor: #eeeeee; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #2e2e2e; 28 | $stateActiveBgColor: #0099e0; 29 | $stateActiveTextColor: #ffffff; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #cccccc; 33 | $stateHighlightBgColor: #eeeeee; 34 | $stateHighlightTextColor: #0099e0; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #2e2e2e; 38 | $stateFocusBgColor: #474747; 39 | $stateFocusTextColor: #ffffff; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #ffb73d; 43 | $stateErrorBgColor: #ffc73d; 44 | $stateErrorTextColor: #111111; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #2e2e2e; 48 | $stateHoverBgColor: #474747; 49 | $stateHoverTextColor: #ffffff; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #222222; 54 | $invalidInputBorderColor: #ffb73d; 55 | $inputGroupTextColor: #ffffff; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/cupertino/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: Lucida Grande, Lucida Sans, Arial, sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 6px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #aed0ea; 9 | $headerBgColor: #deedf7; 10 | $headerTextColor: #222222; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #222222; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #dddddd; 17 | $contentBgColor: #f2f5f7; 18 | $contentTextColor: #362b36; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #aed0ea; 23 | $stateDefaultBgColor: #d7ebf9; 24 | $stateDefaultTextColor: #2779aa; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #2694e8; 28 | $stateActiveBgColor: #3baae3; 29 | $stateActiveTextColor: #ffffff; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #f9dd34; 33 | $stateHighlightBgColor: #ffef8f; 34 | $stateHighlightTextColor: #363636; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #74b2e2; 38 | $stateFocusBgColor: #e4f1fb; 39 | $stateFocusTextColor: #0070a3; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #cd0a0a; 43 | $stateErrorBgColor: #cd0a0a; 44 | $stateErrorTextColor: #ffffff; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #74b2e2; 48 | $stateHoverBgColor: #e4f1fb; 49 | $stateHoverTextColor: #0070a3; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #222222; 54 | $invalidInputBorderColor: #cd0a0a; 55 | $inputGroupTextColor: #2779aa; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/darkness/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: Segoe UI, Arial, sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 6px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #323232; 9 | $headerBgColor: #333333; 10 | $headerTextColor: #cccccc; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #cccccc; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #323232; 17 | $contentBgColor: #000000; 18 | $contentTextColor: #cccccc; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #666666; 23 | $stateDefaultBgColor: #555555; 24 | $stateDefaultTextColor: #eeeeee; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #ffaf0f; 28 | $stateActiveBgColor: #f58400; 29 | $stateActiveTextColor: #ffffff; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #cccccc; 33 | $stateHighlightBgColor: #eeeeee; 34 | $stateHighlightTextColor: #2e7db2; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #59b4d4; 38 | $stateFocusBgColor: #0078a3; 39 | $stateFocusTextColor: #ffffff; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #ffb73d; 43 | $stateErrorBgColor: #ffb73d; 44 | $stateErrorTextColor: #111111; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #59b4d4; 48 | $stateHoverBgColor: #0078a3; 49 | $stateHoverTextColor: #ffffff; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #333333; 54 | $invalidInputBorderColor: #ffb73d; 55 | $inputGroupTextColor: #ffffff; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/flick/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: Helvetica, Arial, sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 2px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #dddddd; 9 | $headerBgColor: #dddddd; 10 | $headerTextColor: #444444; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #444444; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #dddddd; 17 | $contentBgColor: #ffffff; 18 | $contentTextColor: #444444; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #dddddd; 23 | $stateDefaultBgColor: #f6f6f6; 24 | $stateDefaultTextColor: #0073ea; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #dddddd; 28 | $stateActiveBgColor: #ffffff; 29 | $stateActiveTextColor: #ff0084; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #FF0084; 33 | $stateHighlightBgColor: #FF0084; 34 | $stateHighlightTextColor: #FFFFFF; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #0073ea; 38 | $stateFocusBgColor: #0073ea; 39 | $stateFocusTextColor: #ffffff; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #ff0084; 43 | $stateErrorBgColor: #ffffff; 44 | $stateErrorTextColor: #222222; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #0073ea; 48 | $stateHoverBgColor: #0073ea; 49 | $stateHoverTextColor: #ffffff; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #444444; 54 | $invalidInputBorderColor: #ff0084; 55 | $inputGroupTextColor: #444444; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/home/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: Verdana, Arial, sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 4px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #56585C; 9 | $headerBgColor: #424548; 10 | $headerTextColor: #F9F7F7; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #F9F7F7; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #cccccc; 17 | $contentBgColor: #F2F1F1; 18 | $contentTextColor: #222222; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #68727B; 23 | $stateDefaultBgColor: #68727B; 24 | $stateDefaultTextColor: #ffffff; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #506C8A; 28 | $stateActiveBgColor: #365073; 29 | $stateActiveTextColor: #ffffff; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #ffde2e; 33 | $stateHighlightBgColor: #ffeb80; 34 | $stateHighlightTextColor: #363636; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #68727B; 38 | $stateFocusBgColor: #6580A1; 39 | $stateFocusTextColor: #ffffff; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #9e0505; 43 | $stateErrorBgColor: #cd0a0a; 44 | $stateErrorTextColor: #ffffff; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #68727B; 48 | $stateHoverBgColor: #6580A1; 49 | $stateHoverTextColor: #ffffff; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #222222; 54 | $invalidInputBorderColor: #ff0084; 55 | $inputGroupTextColor: #ffffff; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/kasper/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Segoe UI Symbol"; 2 | $fontSize: 1em; 3 | $borderRadius: 3px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #758aa0; 9 | $headerBgColor: #758aa0; 10 | $headerTextColor: #ffffff; 11 | $headerFontWeight: 500; 12 | $headerIconTextColor: #ffffff; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #d1d7dc; 17 | $contentBgColor: #eef1f4; 18 | $contentTextColor: #414550; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #d1d7dc; 23 | $stateDefaultBgColor: #374c61; 24 | $stateDefaultTextColor: #ffffff; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #5a92d1; 28 | $stateActiveBgColor: #5a92d1; 29 | $stateActiveTextColor: #ffffff; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #5a92d1; 33 | $stateHighlightBgColor: #5a92d1; 34 | $stateHighlightTextColor: #ffffff; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #5a92d1; 38 | $stateFocusBgColor: #5a92d1; 39 | $stateFocusTextColor: #081c22; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #ec4e4e; 43 | $stateErrorBgColor: #ec4e4e; 44 | $stateErrorTextColor: #ffffff; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #d1d7dc; 48 | $stateHoverBgColor: #eef1f4; 49 | $stateHoverTextColor: #374c61; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #333333; 54 | $invalidInputBorderColor: #ec4e4e; 55 | $inputGroupTextColor: #333333; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/lightness/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 4px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #e78f08; 9 | $headerBgColor: #f6a828; 10 | $headerTextColor: #ffffff; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #ffffff; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #dddddd; 17 | $contentBgColor: #eeeeee; 18 | $contentTextColor: #333333; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #cccccc; 23 | $stateDefaultBgColor: #f6f6f6; 24 | $stateDefaultTextColor: #1c94c4; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #fbd850; 28 | $stateActiveBgColor: #ffffff; 29 | $stateActiveTextColor: #eb8f00; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #fed22f; 33 | $stateHighlightBgColor: #ffe45c; 34 | $stateHighlightTextColor: #363636; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #fbcb09; 38 | $stateFocusBgColor: #fdf5ce; 39 | $stateFocusTextColor: #c77405; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #cd0a0a; 43 | $stateErrorBgColor: #b81900; 44 | $stateErrorTextColor: #ffffff; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #fbcb09; 48 | $stateHoverBgColor: #fdf5ce; 49 | $stateHoverTextColor: #c77405; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #333333; 54 | $invalidInputBorderColor: #cd0a0a; 55 | $inputGroupTextColor: #333333; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/ludvig/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Segoe UI Symbol"; 2 | $fontSize: 1em; 3 | $borderRadius: 2px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #2790b0; 9 | $headerBgColor: #2790b0; 10 | $headerTextColor: #ffffff; 11 | $headerFontWeight: 500; 12 | $headerIconTextColor: #ffffff; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #d4d4d4; 17 | $contentBgColor: #fafafa; 18 | $contentTextColor: #081c22; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #d4d4d4; 23 | $stateDefaultBgColor: #fafafa; 24 | $stateDefaultTextColor: #081c22; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #b8ccd2; 28 | $stateActiveBgColor: #cad7dc; 29 | $stateActiveTextColor: #081c22; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #eecc00; 33 | $stateHighlightBgColor: #eecc00; 34 | $stateHighlightTextColor: #081c22; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #eecc00; 38 | $stateFocusBgColor: #eecc00; 39 | $stateFocusTextColor: #081c22; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #ec4e4e; 43 | $stateErrorBgColor: #ec4e4e; 44 | $stateErrorTextColor: #ffffff; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #d4d4d4; 48 | $stateHoverBgColor: #eaeaea; 49 | $stateHoverTextColor: #081c22; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #333333; 54 | $invalidInputBorderColor: #ec4e4e; 55 | $inputGroupTextColor: #333333; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/omega/fonts/roboto-v15-latin-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/fonts/roboto-v15-latin-regular.eot -------------------------------------------------------------------------------- /demo/assets/themes/omega/fonts/roboto-v15-latin-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/fonts/roboto-v15-latin-regular.ttf -------------------------------------------------------------------------------- /demo/assets/themes/omega/fonts/roboto-v15-latin-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/fonts/roboto-v15-latin-regular.woff -------------------------------------------------------------------------------- /demo/assets/themes/omega/fonts/roboto-v15-latin-regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/fonts/roboto-v15-latin-regular.woff2 -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/icons_16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/icons_16.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/slider_handles.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/slider_handles.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/slider_handles@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/slider_handles@2x.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-bg_flat_0_aaaaaa_40x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-bg_flat_0_aaaaaa_40x100.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-bg_flat_75_ffffff_40x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-bg_flat_75_ffffff_40x100.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-bg_glass_55_fbf9ee_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-bg_glass_55_fbf9ee_1x400.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-bg_glass_65_ffffff_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-bg_glass_65_ffffff_1x400.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-bg_glass_75_dadada_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-bg_glass_75_dadada_1x400.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-bg_glass_75_e6e6e6_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-bg_glass_75_e6e6e6_1x400.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-bg_glass_95_fef1ec_1x400.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-bg_glass_95_fef1ec_1x400.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-bg_highlight-soft_75_cccccc_1x100.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-bg_highlight-soft_75_cccccc_1x100.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-icons_222222_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-icons_222222_256x240.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-icons_2e83ff_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-icons_2e83ff_256x240.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-icons_454545_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-icons_454545_256x240.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-icons_cd0a0a_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-icons_cd0a0a_256x240.png -------------------------------------------------------------------------------- /demo/assets/themes/omega/images/ui-icons_ffffff_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/demo/assets/themes/omega/images/ui-icons_ffffff_256x240.png -------------------------------------------------------------------------------- /demo/assets/themes/pepper-grinder/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 6px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #d4d1bf; 9 | $headerBgColor: #ffffff; 10 | $headerTextColor: #453821; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #453821; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #d9d6c4; 17 | $contentBgColor: #eceadf; 18 | $contentTextColor: #1f1f1f; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #cbc7bd; 23 | $stateDefaultBgColor: #f8f7f6; 24 | $stateDefaultTextColor: #654b24; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #d9d6c4; 28 | $stateActiveBgColor: #eceadf; 29 | $stateActiveTextColor: #140f06; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #654b24; 33 | $stateHighlightBgColor: #654b24; 34 | $stateHighlightTextColor: #ffffff; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #b2a266; 38 | $stateFocusBgColor: #f7f3de; 39 | $stateFocusTextColor: #3a3427; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #681818; 43 | $stateErrorBgColor: #b83400; 44 | $stateErrorTextColor: #ffffff; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #b2a266; 48 | $stateHoverBgColor: #f7f3de; 49 | $stateHoverTextColor: #3a3427; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #222222; 54 | $invalidInputBorderColor: #681818; 55 | $inputGroupTextColor: #222222; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/redmond/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: Lucida Grande, Lucida Sans, Arial, sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 5px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #4297d7; 9 | $headerBgColor: #5c9ccc; 10 | $headerTextColor: #ffffff; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #ffffff; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #a6c9e2; 17 | $contentBgColor: #fcfdfd; 18 | $contentTextColor: #222222; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #c5dbec; 23 | $stateDefaultBgColor: #dfeffc; 24 | $stateDefaultTextColor: #2e6e9e; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #79b7e7; 28 | $stateActiveBgColor: #f5f8f9; 29 | $stateActiveTextColor: #e17009; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #fad42e; 33 | $stateHighlightBgColor: #fbec88; 34 | $stateHighlightTextColor: #363636; 35 | 36 | //Highlight State 37 | $stateFocusBorderColor: #79b7e7; 38 | $stateFocusBgColor: #d0e5f5; 39 | $stateFocusTextColor: #1d5987; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #cd0a0a; 43 | $stateErrorBgColor: #fef1ec; 44 | $stateErrorTextColor: #cd0a0a; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #79b7e7; 48 | $stateHoverBgColor: #d0e5f5; 49 | $stateHoverTextColor: #1d5987; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #2E6E9E; 54 | $invalidInputBorderColor: #cd0a0a; 55 | $inputGroupTextColor: #2e6e9e; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/rocket/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: Arial, Helvetica, sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 4px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #404040; 9 | $headerBgColor: #242122; 10 | $headerTextColor: #f4f4f9; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #f4f4f9; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #e3e3e3; 17 | $contentBgColor: #f1f1f1; 18 | $contentTextColor: #404040; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #404040; 23 | $stateDefaultBgColor: #242122; 24 | $stateDefaultTextColor: #fafafa; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #9dc939; 28 | $stateActiveBgColor: #9dc939; 29 | $stateActiveTextColor: #304915; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #723c9b; 33 | $stateHighlightBgColor: #65358a; 34 | $stateHighlightTextColor: #ffffff; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #00a6dd; 38 | $stateFocusBgColor: #00a6dd; 39 | $stateFocusTextColor: #fafafa; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #ca3838; 43 | $stateErrorBgColor: #ca3838; 44 | $stateErrorTextColor: #ff8f8f; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #00a6dd; 48 | $stateHoverBgColor: #00a6dd; 49 | $stateHoverTextColor: #fafafa; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #304915; 54 | $invalidInputBorderColor: #ca3838; 55 | $inputGroupTextColor: #ffffff; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/south-street/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: segoe ui, Arial, sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 6px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #d4ccb0; 9 | $headerBgColor: #ece8da; 10 | $headerTextColor: #433f38; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #433f38; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #dfd9c3; 17 | $contentBgColor: #f5f3e5; 18 | $contentTextColor: #312e25; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #327e04; 23 | $stateDefaultBgColor: #459e00; 24 | $stateDefaultTextColor: #ffffff; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #d4ccb0; 28 | $stateActiveBgColor: #fafaf4; 29 | $stateActiveTextColor: #459e00; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #327e04; 33 | $stateHighlightBgColor: #67b021; 34 | $stateHighlightTextColor: #ffffff; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #e8e1b5; 38 | $stateFocusBgColor: #bcb9ae; 39 | $stateFocusTextColor: #363636; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #e3a345; 43 | $stateErrorBgColor: #ffedad; 44 | $stateErrorTextColor: #cd5c0a; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #e8e1b5; 48 | $stateHoverBgColor: #bcb9ae; 49 | $stateHoverTextColor: #363636; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #433f38; 54 | $invalidInputBorderColor: #e3a345; 55 | $inputGroupTextColor: #ffffff; 56 | 57 | @import '../_theme'; 58 | 59 | .ui-paginator .ui-paginator-page.ui-state-active { 60 | background: #fafaf4; 61 | color: #459e00; 62 | border-color: #d4ccb0; 63 | } 64 | -------------------------------------------------------------------------------- /demo/assets/themes/start/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: Verdana,Arial,sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 5px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #4297d7; 9 | $headerBgColor: #2191c0; 10 | $headerTextColor: #eaf5f7; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #eaf5f7; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #a6c9e2; 17 | $contentBgColor: #fcfdfd; 18 | $contentTextColor: #222222; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #77d5f7; 23 | $stateDefaultBgColor: #0078ae; 24 | $stateDefaultTextColor: #ffffff; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #acdd4a; 28 | $stateActiveBgColor: #6eac2c; 29 | $stateActiveTextColor: #ffffff; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #fcd113; 33 | $stateHighlightBgColor: #f8da4e; 34 | $stateHighlightTextColor: #222222; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #448dae; 38 | $stateFocusBgColor: #79c9ec; 39 | $stateFocusTextColor: #222222; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #cd0a0a; 43 | $stateErrorBgColor: #e14f1c; 44 | $stateErrorTextColor: #ffffff; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #448dae; 48 | $stateHoverBgColor: #79c9ec; 49 | $stateHoverTextColor: #222222; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #026890; 54 | $invalidInputBorderColor: #cd0a0a; 55 | $inputGroupTextColor: #026890; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/trontastic/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: Segoe UI, Arial, sans-serif; 2 | $fontSize: 1em; 3 | $borderRadius: 6px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #000000; 9 | $headerBgColor: #9fda58; 10 | $headerTextColor: #222222; 11 | $headerFontWeight: bold; 12 | $headerIconTextColor: #222222; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #4a4a4a; 17 | $contentBgColor: #000000; 18 | $contentTextColor: #ffffff; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #4a4a4a; 23 | $stateDefaultBgColor: #0a0a0a; 24 | $stateDefaultTextColor: #b8ec79; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #696969; 28 | $stateActiveBgColor: #4c4c4c; 29 | $stateActiveTextColor: #ffffff; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #8cce3b; 33 | $stateHighlightBgColor: #f1fbe5; 34 | $stateHighlightTextColor: #030303; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #000000; 38 | $stateFocusBgColor: #666666; 39 | $stateFocusTextColor: #ffffff; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #f1ac88; 43 | $stateErrorBgColor: #f6ecd5; 44 | $stateErrorTextColor: #74736d; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #000000; 48 | $stateHoverBgColor: #666666; 49 | $stateHoverTextColor: #ffffff; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #000000; 54 | $invalidInputBorderColor: #f1ac88; 55 | $inputGroupTextColor: #ffffff; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/assets/themes/voclain/theme.scss: -------------------------------------------------------------------------------- 1 | $fontFamily: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Segoe UI Symbol"; 2 | $fontSize: 1em; 3 | $borderRadius: 4px; 4 | $disabledOpacity: 0.35; 5 | 6 | //Header 7 | $headerBorderWidth: 1px; 8 | $headerBorderColor: #606d7b; 9 | $headerBgColor: #606d7b; 10 | $headerTextColor: #ffffff; 11 | $headerFontWeight: 500; 12 | $headerIconTextColor: #ffffff; 13 | 14 | //Content 15 | $contentBorderWidth: 1px; 16 | $contentBorderColor: #e2e5e8; 17 | $contentBgColor: #eef1f4; 18 | $contentTextColor: #414550; 19 | 20 | //Default State 21 | $stateDefaultBorderWidth: 1px; 22 | $stateDefaultBorderColor: #2c3e50; 23 | $stateDefaultBgColor: #2c3e50; 24 | $stateDefaultTextColor: #ffffff; 25 | 26 | //Active State 27 | $stateActiveBorderColor: #c95864; 28 | $stateActiveBgColor: #c95864; 29 | $stateActiveTextColor: #ffffff; 30 | 31 | //Highlight State 32 | $stateHighlightBorderColor: #c95864; 33 | $stateHighlightBgColor: #c95864; 34 | $stateHighlightTextColor: #ffffff; 35 | 36 | //Focus State 37 | $stateFocusBorderColor: #606d7b; 38 | $stateFocusBgColor: #606d7b; 39 | $stateFocusTextColor: #081c22; 40 | 41 | //Error State 42 | $stateErrorBorderColor: #ec4e4e; 43 | $stateErrorBgColor: #ec4e4e; 44 | $stateErrorTextColor: #ffffff; 45 | 46 | //Hover State 47 | $stateHoverBorderColor: #485562; 48 | $stateHoverBgColor: #485562; 49 | $stateHoverTextColor: #ffffff; 50 | 51 | //Forms 52 | $inputBgColor: #ffffff; 53 | $inputTextColor: #333333; 54 | $invalidInputBorderColor: #ec4e4e; 55 | $inputGroupTextColor: #ffffff; 56 | 57 | @import '../_theme'; -------------------------------------------------------------------------------- /demo/demo.component.ts: -------------------------------------------------------------------------------- 1 | import { Component } from '@angular/core'; 2 | 3 | @Component({ 4 | selector: 'ao-demo-app', 5 | template: '' 6 | }) 7 | export class DemoComponent {} 8 | -------------------------------------------------------------------------------- /demo/demo.module.ts: -------------------------------------------------------------------------------- 1 | import { HttpClientModule } from '@angular/common/http'; 2 | import { NgModule } from '@angular/core'; 3 | import { BrowserModule } from '@angular/platform-browser'; 4 | import { NoopAnimationsModule } from '@angular/platform-browser/animations'; 5 | 6 | import { DataTableModule, DialogModule, PaginatorModule, PanelModule, TooltipModule } from 'primeng/primeng'; 7 | 8 | import { AngularODataModule } from '../src'; 9 | import { DemoComponent } from './demo.component'; 10 | import { EmployeeGridODataComponent } from './employeeGridOData.component'; 11 | 12 | @NgModule({ 13 | declarations: [DemoComponent, EmployeeGridODataComponent], 14 | exports: [PanelModule, NoopAnimationsModule], 15 | imports: [BrowserModule, HttpClientModule, DataTableModule, TooltipModule, PaginatorModule, DialogModule, PanelModule, NoopAnimationsModule, AngularODataModule.forRoot()], 16 | bootstrap: [DemoComponent] 17 | }) 18 | export class DemoModule { } 19 | -------------------------------------------------------------------------------- /demo/employeeGridOData.component.html: -------------------------------------------------------------------------------- 1 | 2 |
3 | 10 |
Northwind Employees
11 | 12 | 13 | 14 | 15 | 16 | 17 | {{ employee.BirthDate | date: 'medium' }} 18 | 19 | 20 | 21 | 22 |
23 | 
count : {{count}}
24 |
25 | 
filter : {{filter | json}}
26 |
27 | 
url : {{url}}
28 |
29 | 
query : {{queryAsJson}}
30 |
31 | -------------------------------------------------------------------------------- /demo/entry.ts: -------------------------------------------------------------------------------- 1 | import 'core-js'; 2 | import 'zone.js/dist/zone'; 3 | 4 | import { enableProdMode } from '@angular/core'; 5 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 6 | import { DemoModule } from './demo.module'; 7 | 8 | declare const ENV: string; 9 | if (ENV === 'production') { 10 | enableProdMode(); 11 | } 12 | 13 | platformBrowserDynamic().bootstrapModule(DemoModule); 14 | -------------------------------------------------------------------------------- /demo/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | Angular OData Library (es5) 18 | 23 | 24 | 25 | 26 | 33 | 34 | 46 | 47 |
48 | Loading demo... 49 |
50 | 51 | 52 | 53 | 54 | 55 | -------------------------------------------------------------------------------- /docs/fonts/FontAwesome.otf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/FontAwesome.otf -------------------------------------------------------------------------------- /docs/fonts/fontawesome-webfont.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/fontawesome-webfont.eot -------------------------------------------------------------------------------- /docs/fonts/fontawesome-webfont.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/fontawesome-webfont.ttf -------------------------------------------------------------------------------- /docs/fonts/fontawesome-webfont.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/fontawesome-webfont.woff -------------------------------------------------------------------------------- /docs/fonts/fontawesome-webfont.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/fontawesome-webfont.woff2 -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-300.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-300.eot -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-300.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-300.ttf -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-300.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-300.woff -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-300.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-300.woff2 -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-700.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-700.eot -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-700.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-700.ttf -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-700.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-700.woff -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-700.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-700.woff2 -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-regular.eot -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-regular.ttf -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-regular.woff -------------------------------------------------------------------------------- /docs/fonts/roboto-v15-latin-regular.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/fonts/roboto-v15-latin-regular.woff2 -------------------------------------------------------------------------------- /docs/images/compodoc.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/images/compodoc.png -------------------------------------------------------------------------------- /docs/images/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StefH/angular-odata-es5/babc4c7ff4919c1cc68d5c849c15376f357b915e/docs/images/favicon.ico -------------------------------------------------------------------------------- /docs/js/compodoc.js: -------------------------------------------------------------------------------- 1 | var compodoc = { 2 | EVENTS: { 3 | READY: 'compodoc.ready', 4 | SEARCH_READY: 'compodoc.search.ready' 5 | } 6 | }; 7 | 8 | Object.assign( compodoc, EventDispatcher.prototype ); 9 | 10 | document.addEventListener('DOMContentLoaded', function() { 11 | compodoc.dispatchEvent({ 12 | type: compodoc.EVENTS.READY 13 | }); 14 | }); 15 | -------------------------------------------------------------------------------- /docs/js/libs/EventDispatcher.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @author mrdoob / http://mrdoob.com/ 3 | */ 4 | 5 | var EventDispatcher = function () {}; 6 | 7 | Object.assign( EventDispatcher.prototype, { 8 | 9 | addEventListener: function ( type, listener ) { 10 | 11 | if ( this._listeners === undefined ) this._listeners = {}; 12 | 13 | var listeners = this._listeners; 14 | 15 | if ( listeners[ type ] === undefined ) { 16 | 17 | listeners[ type ] = []; 18 | 19 | } 20 | 21 | if ( listeners[ type ].indexOf( listener ) === - 1 ) { 22 | 23 | listeners[ type ].push( listener ); 24 | 25 | } 26 | 27 | }, 28 | 29 | hasEventListener: function ( type, listener ) { 30 | 31 | if ( this._listeners === undefined ) return false; 32 | 33 | var listeners = this._listeners; 34 | 35 | if ( listeners[ type ] !== undefined && listeners[ type ].indexOf( listener ) !== - 1 ) { 36 | 37 | return true; 38 | 39 | } 40 | 41 | return false; 42 | 43 | }, 44 | 45 | removeEventListener: function ( type, listener ) { 46 | 47 | if ( this._listeners === undefined ) return; 48 | 49 | var listeners = this._listeners; 50 | var listenerArray = listeners[ type ]; 51 | 52 | if ( listenerArray !== undefined ) { 53 | 54 | var index = listenerArray.indexOf( listener ); 55 | 56 | if ( index !== - 1 ) { 57 | 58 | listenerArray.splice( index, 1 ); 59 | 60 | } 61 | 62 | } 63 | 64 | }, 65 | 66 | dispatchEvent: function ( event ) { 67 | 68 | if ( this._listeners === undefined ) return; 69 | 70 | var listeners = this._listeners; 71 | var listenerArray = listeners[ event.type ]; 72 | 73 | if ( listenerArray !== undefined ) { 74 | 75 | event.target = this; 76 | 77 | var array = [], i = 0; 78 | var length = listenerArray.length; 79 | 80 | for ( i = 0; i < length; i ++ ) { 81 | 82 | array[ i ] = listenerArray[ i ]; 83 | 84 | } 85 | 86 | for ( i = 0; i < length; i ++ ) { 87 | 88 | array[ i ].call( this, event ); 89 | 90 | } 91 | 92 | } 93 | 94 | } 95 | 96 | } ); 97 | -------------------------------------------------------------------------------- /docs/js/libs/highlightjs-line-numbers.min.js: -------------------------------------------------------------------------------- 1 | !function(e){"use strict";function t(){"complete"===document.readyState?n():e.addEventListener("DOMContentLoaded",n)}function n(){try{var e=document.querySelectorAll("code.hljs:not(.bash)");for(var t in e)e.hasOwnProperty(t)&&r(e[t])}catch(n){console.error("LineNumbers error: ",n)}}function r(e){if("object"==typeof e){var t=e.parentNode,n=o(t.outerText);if(n>1){for(var r="",c=0;n>c;c++)r+=c+1+"\n";var l=document.createElement("code");l.className="hljs hljs-line-numbers",l.style["float"]="left",l.textContent=r,t.insertBefore(l,e)}}}function o(e){if(0===e.length)return 0;var t=/\r\n|\r|\n/g,n=e.match(t);return n=n?n.length:0,e[e.length-1].match(t)||(n+=1),n}"undefined"==typeof e.hljs?console.error("highlight.js not detected!"):(e.hljs.initLineNumbersOnLoad=t,e.hljs.lineNumbersBlock=r)}(window); 2 | -------------------------------------------------------------------------------- /docs/js/libs/promise.min.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Copyright 2012-2013 (c) Pierre Duquesne 3 | * Licensed under the New BSD License. 4 | * https://github.com/stackp/promisejs 5 | */ 6 | (function(a){function b(){this._callbacks=[];}b.prototype.then=function(a,c){var d;if(this._isdone)d=a.apply(c,this.result);else{d=new b();this._callbacks.push(function(){var b=a.apply(c,arguments);if(b&&typeof b.then==='function')b.then(d.done,d);});}return d;};b.prototype.done=function(){this.result=arguments;this._isdone=true;for(var a=0;a=300)&&j.status!==304);h.done(a,j.responseText,j);}};j.send(k);return h;}function h(a){return function(b,c,d){return g(a,b,c,d);};}var i={Promise:b,join:c,chain:d,ajax:g,get:h('GET'),post:h('POST'),put:h('PUT'),del:h('DELETE'),ENOXHR:1,ETIMEOUT:2,ajaxTimeout:0};if(typeof define==='function'&&define.amd)define(function(){return i;});else a.promise=i;})(this); -------------------------------------------------------------------------------- /docs/js/menu.js: -------------------------------------------------------------------------------- 1 | document.addEventListener('DOMContentLoaded', function() { 2 | var menuCollapsed = false, 3 | mobileMenu = document.getElementById('mobile-menu'); 4 | document.getElementById('btn-menu').addEventListener('click', function() { 5 | if (menuCollapsed) { 6 | mobileMenu.style.display = 'none'; 7 | } else { 8 | mobileMenu.style.display = 'block'; 9 | document.getElementsByTagName('body')[0].style['overflow-y'] = 'hidden'; 10 | } 11 | menuCollapsed = !menuCollapsed; 12 | }); 13 | 14 | // collapse menu 15 | var classnameMenuToggler = document.getElementsByClassName('menu-toggler'), 16 | faAngleUpClass = 'fa-angle-up', 17 | faAngleDownClass = 'fa-angle-down', 18 | toggleItemMenu = function(e) { 19 | e.preventDefault(); 20 | var element = $(e.target); 21 | if (element.hasClass(faAngleUpClass)) { 22 | element.addClass(faAngleDownClass); 23 | element.removeClass(faAngleUpClass); 24 | } else { 25 | element.addClass(faAngleUpClass); 26 | element.removeClass(faAngleDownClass); 27 | } 28 | }; 29 | 30 | for (var i = 0; i < classnameMenuToggler.length; i++) { 31 | classnameMenuToggler[i].addEventListener('click', toggleItemMenu, false); 32 | } 33 | 34 | // Scroll to active link 35 | var menus = document.querySelectorAll('.menu'), 36 | i = 0, 37 | len = menus.length, 38 | activeMenu, 39 | activeMenuClass, 40 | activeLink; 41 | 42 | for (i; i li:nth-child(2) { 19 | display: none; 20 | } 21 | 22 | .menu ul.list li.chapter ul.links { 23 | background: #fff; 24 | padding-left: 0; 25 | } 26 | 27 | .menu ul.list li.chapter ul.links li { 28 | border-bottom: 1px solid #ddd; 29 | padding-left: 20px; 30 | } 31 | 32 | .menu ul.list li.chapter ul.links li:last-child { 33 | border-bottom: none; 34 | } 35 | 36 | .menu ul.list li a.active { 37 | color: inherit; 38 | font-weight: bold; 39 | } 40 | 41 | #book-search-input { 42 | margin-bottom: 0; 43 | border-bottom: none; 44 | } 45 | .menu ul.list li.divider { 46 | margin: 0; 47 | } 48 | -------------------------------------------------------------------------------- /docs/styles/postmark.css: -------------------------------------------------------------------------------- 1 | .navbar-default { 2 | background: #FFDE00; 3 | border: none; 4 | } 5 | .navbar-default .navbar-brand { 6 | color: #333; 7 | font-weight: bold; 8 | } 9 | .menu { 10 | background: #333; 11 | color: #fcfcfc; 12 | } 13 | .menu ul.list li a { 14 | color: #333; 15 | } 16 | 17 | .menu ul.list li.title { 18 | background: #FFDE00; 19 | color: #333; 20 | padding-bottom: 5px; 21 | } 22 | 23 | .menu ul.list li:nth-child(2) { 24 | margin-top: 0; 25 | } 26 | 27 | .menu ul.list li.chapter a, .menu ul.list li.chapter .simple { 28 | color: white; 29 | text-decoration: none; 30 | } 31 | 32 | .menu ul.list li.chapter ul.links a { 33 | color: #949494; 34 | text-transform: none; 35 | padding-left: 35px; 36 | } 37 | .menu ul.list li.chapter ul.links a:hover, .menu ul.list li.chapter ul.links a.active { 38 | color: #FFDE00; 39 | } 40 | 41 | .menu ul.list li.chapter ul.links { 42 | padding-left: 0; 43 | } 44 | 45 | .menu ul.list li.divider { 46 | background: rgba(255, 255, 255, 0.07); 47 | } 48 | 49 | #book-search-input input, #book-search-input input:focus, #book-search-input input:hover { 50 | color: #949494; 51 | } 52 | 53 | .copyright { 54 | color: #b3b3b3; 55 | } 56 | 57 | .content { 58 | background: #fcfcfc; 59 | } 60 | 61 | .content a { 62 | color: #007DCC; 63 | } 64 | .content a:visited { 65 | color: #0165a5; 66 | } 67 | .copyright { 68 | background: #272525; 69 | } 70 | .menu ul.list li:nth-last-child(2) { 71 | background: none; 72 | } 73 | .list-group-item:first-child, .list-group-item:last-child { 74 | border-radius: 0; 75 | } 76 | 77 | .menu ul.list li.title a { 78 | text-decoration: none; 79 | font-weight: bold; 80 | } 81 | .menu ul.list li.title a:hover { 82 | background: rgba(255,255,255,0.1); 83 | } 84 | 85 | .breadcrumb>li+li:before { 86 | content: "»\00a0" 87 | } 88 | 89 | .breadcrumb { 90 | padding-bottom: 15px; 91 | border-bottom: 1px solid #e1e4e5; 92 | } 93 | code { 94 | white-space: nowrap; 95 | max-width: 100%; 96 | background: #F5F5F5; 97 | border: solid 1px #e1e4e5; 98 | padding: 2px 5px; 99 | color: #666666; 100 | overflow-x: auto; 101 | border-radius: 0; 102 | } 103 | pre { 104 | white-space: pre; 105 | margin: 0; 106 | padding: 12px 12px; 107 | font-size: 12px; 108 | line-height: 1.5; 109 | display: block; 110 | overflow: auto; 111 | color: #404040; 112 | background: #f3f3f3; 113 | } 114 | pre code.hljs { 115 | border: none; 116 | background: inherit; 117 | } 118 | 119 | /* 120 | Atom One Light by Daniel Gamage 121 | Original One Light Syntax theme from https://github.com/atom/one-light-syntax 122 | base: #fafafa 123 | mono-1: #383a42 124 | mono-2: #686b77 125 | mono-3: #a0a1a7 126 | hue-1: #0184bb 127 | hue-2: #4078f2 128 | hue-3: #a626a4 129 | hue-4: #50a14f 130 | hue-5: #e45649 131 | hue-5-2: #c91243 132 | hue-6: #986801 133 | hue-6-2: #c18401 134 | */ 135 | 136 | .hljs { 137 | display: block; 138 | overflow-x: auto; 139 | padding: 0.5em; 140 | color: #383a42; 141 | background: #fafafa; 142 | } 143 | 144 | .hljs-comment, 145 | .hljs-quote { 146 | color: #a0a1a7; 147 | font-style: italic; 148 | } 149 | 150 | .hljs-doctag, 151 | .hljs-keyword, 152 | .hljs-formula { 153 | color: #a626a4; 154 | } 155 | 156 | .hljs-section, 157 | .hljs-name, 158 | .hljs-selector-tag, 159 | .hljs-deletion, 160 | .hljs-subst { 161 | color: #e45649; 162 | } 163 | 164 | .hljs-literal { 165 | color: #0184bb; 166 | } 167 | 168 | .hljs-string, 169 | .hljs-regexp, 170 | .hljs-addition, 171 | .hljs-attribute, 172 | .hljs-meta-string { 173 | color: #50a14f; 174 | } 175 | 176 | .hljs-built_in, 177 | .hljs-class .hljs-title { 178 | color: #c18401; 179 | } 180 | 181 | .hljs-attr, 182 | .hljs-variable, 183 | .hljs-template-variable, 184 | .hljs-type, 185 | .hljs-selector-class, 186 | .hljs-selector-attr, 187 | .hljs-selector-pseudo, 188 | .hljs-number { 189 | color: #986801; 190 | } 191 | 192 | .hljs-symbol, 193 | .hljs-bullet, 194 | .hljs-link, 195 | .hljs-meta, 196 | .hljs-selector-id, 197 | .hljs-title { 198 | color: #4078f2; 199 | } 200 | 201 | .hljs-emphasis { 202 | font-style: italic; 203 | } 204 | 205 | .hljs-strong { 206 | font-weight: bold; 207 | } 208 | 209 | .hljs-link { 210 | text-decoration: underline; 211 | } 212 | -------------------------------------------------------------------------------- /docs/styles/readthedocs.css: -------------------------------------------------------------------------------- 1 | .navbar-default { 2 | background: #2980B9; 3 | border: none; 4 | } 5 | .navbar-default .navbar-brand { 6 | color: #fcfcfc; 7 | } 8 | .menu { 9 | background: #343131; 10 | color: #fcfcfc; 11 | } 12 | .menu ul.list li a { 13 | color: #fcfcfc; 14 | } 15 | 16 | .menu ul.list li a.active { 17 | color: #0099e5; 18 | } 19 | 20 | .menu ul.list li.title { 21 | background: #2980B9; 22 | padding-bottom: 5px; 23 | } 24 | 25 | .menu ul.list li:nth-child(2) { 26 | margin-top: 0; 27 | } 28 | 29 | .menu ul.list li.chapter a, .menu ul.list li.chapter .simple { 30 | color: #555; 31 | text-transform: uppercase; 32 | text-decoration: none; 33 | } 34 | 35 | .menu ul.list li.chapter ul.links a { 36 | color: #b3b3b3; 37 | text-transform: none; 38 | padding-left: 35px; 39 | } 40 | .menu ul.list li.chapter ul.links a:hover { 41 | background: #4E4A4A; 42 | } 43 | 44 | .menu ul.list li.chapter ul.links { 45 | padding-left: 0; 46 | } 47 | 48 | .menu ul.list li.divider { 49 | background: rgba(255, 255, 255, 0.07); 50 | } 51 | 52 | #book-search-input input, #book-search-input input:focus, #book-search-input input:hover { 53 | color: #949494; 54 | } 55 | 56 | .copyright { 57 | color: #b3b3b3; 58 | } 59 | 60 | .content { 61 | background: #fcfcfc; 62 | } 63 | 64 | .content a { 65 | color: #2980B9; 66 | } 67 | .content a:hover { 68 | color: #3091d1; 69 | } 70 | .content a:visited { 71 | color: #9B59B6; 72 | } 73 | .copyright { 74 | background: #272525; 75 | } 76 | .menu ul.list li:nth-last-child(2) { 77 | background: none; 78 | } 79 | code { 80 | white-space: nowrap; 81 | max-width: 100%; 82 | background: #fff; 83 | border: solid 1px #e1e4e5; 84 | padding: 2px 5px; 85 | color: #E74C3C; 86 | overflow-x: auto; 87 | border-radius: 0; 88 | } 89 | pre { 90 | white-space: pre; 91 | margin: 0; 92 | padding: 12px 12px; 93 | font-size: 12px; 94 | line-height: 1.5; 95 | display: block; 96 | overflow: auto; 97 | color: #404040; 98 | background: rgba(238,238,238,.35); 99 | } 100 | pre code.hljs { 101 | border: none; 102 | background: inherit; 103 | } 104 | 105 | /* 106 | Atom One Light by Daniel Gamage 107 | Original One Light Syntax theme from https://github.com/atom/one-light-syntax 108 | base: #fafafa 109 | mono-1: #383a42 110 | mono-2: #686b77 111 | mono-3: #a0a1a7 112 | hue-1: #0184bb 113 | hue-2: #4078f2 114 | hue-3: #a626a4 115 | hue-4: #50a14f 116 | hue-5: #e45649 117 | hue-5-2: #c91243 118 | hue-6: #986801 119 | hue-6-2: #c18401 120 | */ 121 | 122 | .hljs { 123 | display: block; 124 | overflow-x: auto; 125 | padding: 0.5em; 126 | color: #383a42; 127 | background: #fafafa; 128 | } 129 | 130 | .hljs-comment, 131 | .hljs-quote { 132 | color: #a0a1a7; 133 | font-style: italic; 134 | } 135 | 136 | .hljs-doctag, 137 | .hljs-keyword, 138 | .hljs-formula { 139 | color: #a626a4; 140 | } 141 | 142 | .hljs-section, 143 | .hljs-name, 144 | .hljs-selector-tag, 145 | .hljs-deletion, 146 | .hljs-subst { 147 | color: #e45649; 148 | } 149 | 150 | .hljs-literal { 151 | color: #0184bb; 152 | } 153 | 154 | .hljs-string, 155 | .hljs-regexp, 156 | .hljs-addition, 157 | .hljs-attribute, 158 | .hljs-meta-string { 159 | color: #50a14f; 160 | } 161 | 162 | .hljs-built_in, 163 | .hljs-class .hljs-title { 164 | color: #c18401; 165 | } 166 | 167 | .hljs-attr, 168 | .hljs-variable, 169 | .hljs-template-variable, 170 | .hljs-type, 171 | .hljs-selector-class, 172 | .hljs-selector-attr, 173 | .hljs-selector-pseudo, 174 | .hljs-number { 175 | color: #986801; 176 | } 177 | 178 | .hljs-symbol, 179 | .hljs-bullet, 180 | .hljs-link, 181 | .hljs-meta, 182 | .hljs-selector-id, 183 | .hljs-title { 184 | color: #4078f2; 185 | } 186 | 187 | .hljs-emphasis { 188 | font-style: italic; 189 | } 190 | 191 | .hljs-strong { 192 | font-weight: bold; 193 | } 194 | 195 | .hljs-link { 196 | text-decoration: underline; 197 | } 198 | 199 | .list-group-item:first-child, .list-group-item:last-child { 200 | border-radius: 0; 201 | } 202 | 203 | .menu ul.list li.title a { 204 | text-decoration: none; 205 | } 206 | .menu ul.list li.title a:hover { 207 | background: rgba(255,255,255,0.1); 208 | } 209 | 210 | .breadcrumb>li+li:before { 211 | content: "»\00a0" 212 | } 213 | 214 | .breadcrumb { 215 | padding-bottom: 15px; 216 | border-bottom: 1px solid #e1e4e5; 217 | } 218 | -------------------------------------------------------------------------------- /docs/styles/reset.css: -------------------------------------------------------------------------------- 1 | /* http://meyerweb.com/eric/tools/css/reset/ 2 | v2.0 | 20110126 3 | License: none (public domain) 4 | */ 5 | 6 | html, body, div, span, applet, object, iframe, 7 | h1, h2, h3, h4, h5, h6, p, blockquote, pre, 8 | a, abbr, acronym, address, big, cite, code, 9 | del, dfn, em, img, ins, kbd, q, s, samp, 10 | small, strike, strong, sub, sup, tt, var, 11 | b, u, i, center, 12 | dl, dt, dd, ol, ul, li, 13 | fieldset, form, label, legend, 14 | table, caption, tbody, tfoot, thead, tr, th, td, 15 | article, aside, canvas, details, embed, 16 | figure, figcaption, footer, header, hgroup, 17 | menu, nav, output, ruby, section, summary, 18 | time, mark, audio, video { 19 | margin: 0; 20 | padding: 0; 21 | border: 0; 22 | font-size: 100%; 23 | font: inherit; 24 | vertical-align: baseline; 25 | } 26 | /* HTML5 display-role reset for older browsers */ 27 | article, aside, details, figcaption, figure, 28 | footer, header, hgroup, menu, nav, section { 29 | display: block; 30 | } 31 | body { 32 | line-height: 1; 33 | } 34 | ol, ul { 35 | list-style: none; 36 | } 37 | blockquote, q { 38 | quotes: none; 39 | } 40 | blockquote:before, blockquote:after, 41 | q:before, q:after { 42 | content: ''; 43 | content: none; 44 | } 45 | table { 46 | border-collapse: collapse; 47 | border-spacing: 0; 48 | } -------------------------------------------------------------------------------- /docs/styles/stripe.css: -------------------------------------------------------------------------------- 1 | .navbar-default .navbar-brand { 2 | color: #0099e5; 3 | } 4 | 5 | .menu ul.list li a[data-type="chapter-link"], .menu ul.list li.chapter .simple { 6 | color: #939da3; 7 | text-transform: uppercase; 8 | } 9 | 10 | .content h1, .content h2, .content h3, .content h4, .content h5 { 11 | color: #292e31; 12 | font-weight: normal; 13 | } 14 | 15 | .content { 16 | color: #4c555a; 17 | } 18 | 19 | .menu ul.list li.title { 20 | padding: 5px 0; 21 | } 22 | 23 | a { 24 | color: #0099e5; 25 | text-decoration: none; 26 | } 27 | a:hover { 28 | color: #292e31; 29 | text-decoration: none; 30 | } 31 | 32 | .menu ul.list li:nth-child(2) { 33 | margin-top: 0; 34 | } 35 | 36 | .menu ul.list li.title a, .navbar a { 37 | color: #0099e5; 38 | text-decoration: none; 39 | font-size: 16px; 40 | } 41 | 42 | .menu ul.list li a.active { 43 | color: #0099e5; 44 | } 45 | 46 | code { 47 | box-sizing: border-box; 48 | display: inline-block; 49 | padding: 0 5px; 50 | background: #fafcfc; 51 | border: 1px solid #f0f4f7; 52 | border-radius: 4px; 53 | color: #b93d6a; 54 | font-size: 13px; 55 | line-height: 20px 56 | } 57 | 58 | pre { 59 | margin: 0; 60 | padding: 12px 12px; 61 | background: #272b2d; 62 | border-radius: 5px; 63 | font-size: 13px; 64 | line-height: 1.5em; 65 | font-weight: 500 66 | } 67 | 68 | pre code.hljs { 69 | border: none; 70 | background: #272b2d; 71 | } 72 | -------------------------------------------------------------------------------- /docs/styles/style.css: -------------------------------------------------------------------------------- 1 | @import "./reset.css"; 2 | @import "./bootstrap.min.css"; 3 | @import "./bootstrap-card.css"; 4 | @import "./monokai-sublime.css"; 5 | @import "./font-awesome.min.css"; 6 | @import "./compodoc.css"; 7 | -------------------------------------------------------------------------------- /docs/styles/vagrant.css: -------------------------------------------------------------------------------- 1 | .navbar-default .navbar-brand { 2 | background: white; 3 | color: #8d9ba8; 4 | } 5 | 6 | .menu .list { 7 | background: #0c5593; 8 | } 9 | 10 | .menu .chapter { 11 | padding: 0 20px; 12 | } 13 | 14 | .menu ul.list li a[data-type="chapter-link"], .menu ul.list li.chapter .simple { 15 | color: white; 16 | text-transform: uppercase; 17 | border-bottom: 1px solid rgba(255,255,255,0.4); 18 | } 19 | 20 | .content h1, .content h2, .content h3, .content h4, .content h5 { 21 | color: #292e31; 22 | font-weight: normal; 23 | } 24 | 25 | .content { 26 | color: #4c555a; 27 | } 28 | 29 | a { 30 | color: #0094bf; 31 | text-decoration: underline; 32 | } 33 | a:hover { 34 | color: #f1362f; 35 | } 36 | 37 | .menu ul.list li.title { 38 | background: white; 39 | padding-bottom: 5px; 40 | } 41 | 42 | .menu ul.list li:nth-child(2) { 43 | margin-top: 0; 44 | } 45 | 46 | .menu ul.list li:nth-last-child(2) { 47 | background: none; 48 | } 49 | 50 | .menu ul.list li.title a { 51 | padding: 10px 15px; 52 | } 53 | 54 | .menu ul.list li.title a, .navbar a { 55 | color: #8d9ba8; 56 | text-decoration: none; 57 | font-size: 16px; 58 | font-weight: 300; 59 | } 60 | 61 | .menu ul.list li a { 62 | color: white; 63 | padding: 10px; 64 | font-weight: 300; 65 | text-decoration: none; 66 | } 67 | .menu ul.list li a.active { 68 | color: white; 69 | font-weight: bold; 70 | } 71 | 72 | .copyright { 73 | color: white; 74 | background: #000; 75 | } 76 | 77 | code { 78 | box-sizing: border-box; 79 | display: inline-block; 80 | padding: 0 5px; 81 | background: rgba(0,148,191,0.1); 82 | border: 1px solid #f0f4f7; 83 | border-radius: 3px; 84 | color: #0094bf; 85 | font-size: 13px; 86 | line-height: 20px; 87 | } 88 | 89 | pre { 90 | margin: 0; 91 | padding: 12px 12px; 92 | background: rgba(238,238,238,.35); 93 | border-radius: 3px; 94 | font-size: 13px; 95 | line-height: 1.5em; 96 | font-weight: 500; 97 | } 98 | 99 | pre code.hljs { 100 | border: none; 101 | background: none; 102 | box-shadow: none; 103 | } 104 | 105 | /* 106 | Atom One Light by Daniel Gamage 107 | Original One Light Syntax theme from https://github.com/atom/one-light-syntax 108 | base: #fafafa 109 | mono-1: #383a42 110 | mono-2: #686b77 111 | mono-3: #a0a1a7 112 | hue-1: #0184bb 113 | hue-2: #4078f2 114 | hue-3: #a626a4 115 | hue-4: #50a14f 116 | hue-5: #e45649 117 | hue-5-2: #c91243 118 | hue-6: #986801 119 | hue-6-2: #c18401 120 | */ 121 | 122 | .hljs { 123 | display: block; 124 | overflow-x: auto; 125 | padding: 0.5em; 126 | color: #383a42; 127 | background: #fafafa; 128 | } 129 | 130 | .hljs-comment, 131 | .hljs-quote { 132 | color: #a0a1a7; 133 | font-style: italic; 134 | } 135 | 136 | .hljs-doctag, 137 | .hljs-keyword, 138 | .hljs-formula { 139 | color: #a626a4; 140 | } 141 | 142 | .hljs-section, 143 | .hljs-name, 144 | .hljs-selector-tag, 145 | .hljs-deletion, 146 | .hljs-subst { 147 | color: #e45649; 148 | } 149 | 150 | .hljs-literal { 151 | color: #0184bb; 152 | } 153 | 154 | .hljs-string, 155 | .hljs-regexp, 156 | .hljs-addition, 157 | .hljs-attribute, 158 | .hljs-meta-string { 159 | color: #50a14f; 160 | } 161 | 162 | .hljs-built_in, 163 | .hljs-class .hljs-title { 164 | color: #c18401; 165 | } 166 | 167 | .hljs-attr, 168 | .hljs-variable, 169 | .hljs-template-variable, 170 | .hljs-type, 171 | .hljs-selector-class, 172 | .hljs-selector-attr, 173 | .hljs-selector-pseudo, 174 | .hljs-number { 175 | color: #986801; 176 | } 177 | 178 | .hljs-symbol, 179 | .hljs-bullet, 180 | .hljs-link, 181 | .hljs-meta, 182 | .hljs-selector-id, 183 | .hljs-title { 184 | color: #4078f2; 185 | } 186 | 187 | .hljs-emphasis { 188 | font-style: italic; 189 | } 190 | 191 | .hljs-strong { 192 | font-weight: bold; 193 | } 194 | 195 | .hljs-link { 196 | text-decoration: underline; 197 | } 198 | -------------------------------------------------------------------------------- /karma.conf.ts: -------------------------------------------------------------------------------- 1 | import * as path from 'path'; 2 | import * as webpack from 'webpack'; 3 | 4 | export default (config: any) => { 5 | 6 | config.set({ 7 | 8 | // base path that will be used to resolve all patterns (eg. files, exclude) 9 | basePath: './', 10 | 11 | // frameworks to use 12 | // available frameworks: https://npmjs.org/browse/keyword/karma-adapter 13 | frameworks: ['jasmine'], 14 | 15 | // list of files / patterns to load in the browser 16 | files: [ 17 | 'test/entry.ts' 18 | ], 19 | 20 | // preprocess matching files before serving them to the browser 21 | // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor 22 | preprocessors: { 23 | 'test/entry.ts': ['webpack', 'sourcemap'] 24 | }, 25 | 26 | webpack: { 27 | resolve: { 28 | extensions: ['.ts', '.js'] 29 | }, 30 | module: { 31 | rules: [{ 32 | test: /\.ts$/, 33 | loader: 'tslint-loader', 34 | exclude: /node_modules/, 35 | enforce: 'pre', 36 | options: { 37 | emitErrors: config.singleRun, 38 | failOnHint: config.singleRun 39 | } 40 | }, { 41 | test: /\.ts$/, 42 | loader: 'awesome-typescript-loader', 43 | exclude: /node_modules/, 44 | options: { 45 | transpileOnly: !config.singleRun 46 | } 47 | }, { 48 | test: /src(\\|\/).+\.ts$/, 49 | exclude: /(node_modules|\.spec\.ts$)/, 50 | loader: 'istanbul-instrumenter-loader', 51 | enforce: 'post' 52 | }] 53 | }, 54 | plugins: [ 55 | new webpack.SourceMapDevToolPlugin({ 56 | filename: null, 57 | columns: false, 58 | test: /\.(ts|js)($|\?)/i 59 | }), 60 | new webpack.ContextReplacementPlugin( 61 | /angular(\\|\/)core(\\|\/)esm5/, 62 | path.join(__dirname, 'src') 63 | ) 64 | ] 65 | }, 66 | 67 | mochaReporter: { 68 | showDiff: true, 69 | output: 'autowatch' 70 | }, 71 | 72 | coverageIstanbulReporter: { 73 | reports: ['text-summary', 'html', 'lcovonly'], 74 | fixWebpackSourcePaths: true 75 | }, 76 | 77 | mime: { 78 | 'text/x-typescript': ['ts'] 79 | }, 80 | 81 | // test results reporter to use 82 | // possible values: 'dots', 'progress' 83 | // available reporters: https://npmjs.org/browse/keyword/karma-reporter 84 | reporters: ['progress', 'coverage-istanbul'], 85 | 86 | // level of logging 87 | // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG 88 | logLevel: config.LOG_INFO, 89 | 90 | // start these browsers 91 | // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher 92 | browsers: ['ChromeHeadless'], 93 | 94 | }); 95 | 96 | }; 97 | -------------------------------------------------------------------------------- /src/angularOData.module.ts: -------------------------------------------------------------------------------- 1 | import { CommonModule } from '@angular/common'; 2 | import { ModuleWithProviders, NgModule } from '@angular/core'; 3 | 4 | @NgModule({ 5 | declarations: [ ], 6 | imports: [ CommonModule ], 7 | exports: [ ] 8 | }) 9 | export class AngularODataModule { 10 | 11 | public static forRoot(): ModuleWithProviders { 12 | return { 13 | ngModule: AngularODataModule 14 | }; 15 | } 16 | 17 | } 18 | -------------------------------------------------------------------------------- /src/angularODataConfiguration.ts: -------------------------------------------------------------------------------- 1 | import { HttpHeaders, HttpParams, HttpResponse } from '@angular/common/http'; 2 | import { Injectable } from '@angular/core'; 3 | 4 | import { ODataPagedResult } from './angularODataPagedResult'; 5 | import { IODataResponseModel } from './angularODataResponseModel'; 6 | import { ODataUtils } from './angularODataUtils'; 7 | 8 | export class KeyConfigs { 9 | public filter = '$filter'; 10 | public top = '$top'; 11 | public skip = '$skip'; 12 | public orderBy = '$orderby'; 13 | public select = '$select'; 14 | public search = '$search'; 15 | public expand = '$expand'; 16 | public apply = '$apply'; 17 | public count = '$count'; 18 | public maxPerPage = 'odata.maxpagesize'; 19 | } 20 | 21 | @Injectable() 22 | export class ODataConfiguration { 23 | private readonly _postHeaders = new HttpHeaders({ 'Content-Type': 'application/json; charset=utf-8' }); 24 | private _baseUrl = 'http://localhost/odata'; 25 | 26 | public keys: KeyConfigs = new KeyConfigs(); 27 | 28 | public defaultRequestOptions: { 29 | headers: HttpHeaders; 30 | observe: 'response'; 31 | params?: HttpParams; 32 | reportProgress?: boolean; 33 | responseType?: 'json'; 34 | withCredentials?: boolean; 35 | } = { headers: new HttpHeaders(), observe: 'response' }; 36 | 37 | public postRequestOptions: { 38 | headers: HttpHeaders; 39 | observe: 'response'; 40 | params?: HttpParams; 41 | reportProgress?: boolean; 42 | responseType?: 'json'; 43 | withCredentials?: boolean; 44 | } = { headers: this._postHeaders, observe: 'response' }; 45 | 46 | public customRequestOptions: { 47 | headers: HttpHeaders; 48 | observe: 'response'; 49 | params?: HttpParams; 50 | reportProgress?: boolean; 51 | responseType?: 'json'; 52 | withCredentials?: boolean; 53 | } = { headers: new HttpHeaders(), observe: 'response' }; 54 | 55 | set baseUrl(baseUrl: string) { 56 | this._baseUrl = baseUrl.replace(/\/+$/, ''); 57 | } 58 | 59 | get baseUrl(): string { 60 | return this._baseUrl; 61 | } 62 | 63 | public getEntitiesUri(typeName: string): string { 64 | if (typeName) { 65 | return `${this.baseUrl}/${this.sanitizeTypeName(typeName)}`; 66 | } 67 | return this.baseUrl; 68 | } 69 | 70 | public getEntityUri(key: any, typeName: string): string { 71 | return `${this.getEntitiesUri(typeName)}(${ODataUtils.quoteValue(key)})`; 72 | } 73 | 74 | public handleError(err: any, caught: any): void { 75 | console.warn('OData error: ', err, caught); 76 | } 77 | 78 | public extractQueryResultDataAsNumber(res: HttpResponse): number { 79 | if (res.status < 200 || res.status >= 300) { 80 | throw new Error('Bad response status: ' + res.status); 81 | } 82 | 83 | return (res && res.body) as number; 84 | } 85 | 86 | public extractQueryResultData(res: HttpResponse>): T[] { 87 | if (res.status < 200 || res.status >= 300) { 88 | throw new Error('Bad response status: ' + res.status); 89 | } 90 | 91 | return (res && res.body && res.body.value) as T[]; 92 | } 93 | 94 | public extractQueryResultDataWithCount(res: HttpResponse>): ODataPagedResult { 95 | const pagedResult: ODataPagedResult = new ODataPagedResult(); 96 | 97 | if (res.status < 200 || res.status >= 300) { 98 | throw new Error('Bad response status: ' + res.status); 99 | } 100 | 101 | const body: any = res.body; 102 | const entities: T[] = body.value; 103 | 104 | pagedResult.data = entities; 105 | 106 | const parseResult = ODataUtils.tryParseInt(body['@odata.count']); 107 | if (parseResult.valid) { 108 | pagedResult.count = parseResult.value; 109 | } else { 110 | console.warn('Cannot determine OData entities count. Falling back to collection length.'); 111 | pagedResult.count = entities.length; 112 | } 113 | 114 | if (body['@odata.nextLink']) { 115 | pagedResult.nextLink = body['@odata.nextLink']; 116 | } 117 | 118 | return pagedResult; 119 | } 120 | 121 | private sanitizeTypeName(typeName: string): string { 122 | return typeName.replace(/\/+$/, '').replace(/^\/+/, ''); 123 | } 124 | } 125 | -------------------------------------------------------------------------------- /src/angularODataEnums.ts: -------------------------------------------------------------------------------- 1 | export enum ODataExecReturnType { 2 | 3 | // Default 4 | Array = 0, 5 | 6 | Count = 1, 7 | 8 | PagedResult = 2 9 | } 10 | -------------------------------------------------------------------------------- /src/angularODataPagedResult.ts: -------------------------------------------------------------------------------- 1 | export class ODataPagedResult { 2 | public data: T[]; 3 | public count: number; 4 | public nextLink: string; 5 | } 6 | -------------------------------------------------------------------------------- /src/angularODataResponseModel.ts: -------------------------------------------------------------------------------- 1 | export interface IODataResponseModel { 2 | '@odata.context': string; 3 | 4 | '@odata.count'?: number; 5 | 6 | '@odata.nextLink'?: string; 7 | 8 | value: T[]; 9 | } 10 | -------------------------------------------------------------------------------- /src/angularODataService.ts: -------------------------------------------------------------------------------- 1 | import { Observable, throwError } from 'rxjs'; 2 | import { catchError, map } from 'rxjs/operators'; 3 | 4 | import { HttpClient, HttpResponse } from '@angular/common/http'; 5 | 6 | import { ODataConfiguration } from './angularODataConfiguration'; 7 | import { DeleteOperation, GetOperation, PatchOperation, PostOperation, PutOperation } from './angularODataOperation'; 8 | import { ODataQuery } from './angularODataQuery'; 9 | import { ODataUtils } from './angularODataUtils'; 10 | 11 | export class ODataService { 12 | private _entitiesUri: string; 13 | 14 | constructor(private _typeName: string, private _http: HttpClient, private config: ODataConfiguration) { 15 | this._entitiesUri = config.getEntitiesUri(_typeName); 16 | } 17 | 18 | public get TypeName(): string { 19 | return this._typeName; 20 | } 21 | 22 | public Get(key: any): GetOperation { 23 | return new GetOperation(this._typeName, this.config, this._http, key); 24 | } 25 | 26 | public Post(entity: T): PostOperation { 27 | return new PostOperation(this._typeName, this.config, this._http, entity); 28 | } 29 | 30 | public Patch(entity: T, key: any): PatchOperation { 31 | return new PatchOperation(this._typeName, this.config, this._http, key, entity); 32 | } 33 | 34 | public Put(entity: T, key: any): PutOperation { 35 | return new PutOperation(this._typeName, this.config, this._http, key, entity); 36 | } 37 | 38 | public Delete(key: any): DeleteOperation { 39 | return new DeleteOperation(this._typeName, this.config, this._http, key); 40 | } 41 | 42 | public CustomAction(key: any, actionName: string, postdata: any): Observable { 43 | const body = postdata ? JSON.stringify(postdata) : null; 44 | return this._http.post(`${this.getEntityUri(key)}/${actionName}`, body, this.config.customRequestOptions).pipe(map(resp => resp)); 45 | } 46 | 47 | public CustomCollectionAction(actionName: string, postdata: any): Observable { 48 | const body = postdata ? JSON.stringify(postdata) : null; 49 | return this._http.post(`${this._entitiesUri}/${actionName}`, body, this.config.customRequestOptions).pipe(map(resp => resp)); 50 | } 51 | 52 | public CustomFunction(key: any, functionName: string, parameters?: any): Observable { 53 | if (parameters) { 54 | const params: string = ODataUtils.convertObjectToString(parameters); 55 | functionName = `${functionName}(${params})`; 56 | } else if (!functionName.endsWith(')') && !functionName.endsWith('()')) { 57 | functionName = `${functionName}()`; 58 | } 59 | return this._http.get(`${this.getEntityUri(key)}/${functionName}`, this.config.defaultRequestOptions).pipe(map(resp => resp)); 60 | } 61 | 62 | public CustomCollectionFunction(functionName: string, parameters?: any): Observable { 63 | if (parameters) { 64 | const params: string = ODataUtils.convertObjectToString(parameters); 65 | functionName = `${functionName}(${params})`; 66 | } else if (!functionName.endsWith(')') && !functionName.endsWith('()')) { 67 | functionName = `${functionName}()`; 68 | } 69 | return this._http.get(`${this._entitiesUri}/${functionName}`, this.config.defaultRequestOptions).pipe(map(resp => resp)); 70 | } 71 | 72 | public ItemProperty(key: string, propertyName: string): Observable { 73 | return this._http.get(`${this.getEntityUri(key)}/${propertyName}`, this.config.defaultRequestOptions) 74 | .pipe(map(r => r.body)); 75 | } 76 | 77 | public Query(): ODataQuery { 78 | return new ODataQuery(this.TypeName, this.config, this._http); 79 | } 80 | 81 | protected getEntityUri(key: any): string { 82 | return this.config.getEntityUri(key, this._typeName); 83 | } 84 | 85 | protected handleResponse(entity: Observable>): Observable { 86 | return entity 87 | .pipe( 88 | map(this.extractData), 89 | catchError((err: any, caught: Observable) => { 90 | if (this.config.handleError) { 91 | this.config.handleError(err, caught); 92 | } 93 | return throwError(err); 94 | }) 95 | ); 96 | } 97 | 98 | private extractData(res: HttpResponse): TResponse { 99 | if (res.status < 200 || res.status >= 300) { 100 | throw new Error('Bad response status: ' + res.status); 101 | } 102 | const body: any = res.body; 103 | return body || {}; 104 | } 105 | } 106 | -------------------------------------------------------------------------------- /src/angularODataServiceFactory.ts: -------------------------------------------------------------------------------- 1 | import { HttpClient } from '@angular/common/http'; 2 | import { Injectable } from '@angular/core'; 3 | 4 | import { ODataConfiguration } from './angularODataConfiguration'; 5 | import { ODataService } from './angularODataService'; 6 | 7 | @Injectable() 8 | export class ODataServiceFactory { 9 | 10 | constructor(private http: HttpClient, private config: ODataConfiguration) { 11 | } 12 | 13 | public CreateService(typeName: string, config?: ODataConfiguration): ODataService { 14 | return new ODataService(typeName, this.http, config ? config : this.config); 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/angularODataUtils.ts: -------------------------------------------------------------------------------- 1 | export class ODataUtils { 2 | public static convertObjectToString(obj: any): string { 3 | const properties: string[] = []; 4 | 5 | for (const prop in obj) { 6 | if (obj.hasOwnProperty(prop) && obj[prop] !== undefined) { 7 | const value: any = ODataUtils.quoteValue(obj[prop]); 8 | 9 | properties.push(`${prop}=${value}`); 10 | } 11 | } 12 | return properties.join(', '); 13 | } 14 | 15 | public static quoteValue(value: number | string | boolean | any): string { 16 | // check if GUID (UUID) type 17 | if (/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(value)) { 18 | return value; 19 | } 20 | 21 | // check if string 22 | if (typeof value === 'string') { 23 | const escaped = value.replace(/'/g, '\'\''); 24 | return `'${escaped}'`; 25 | } 26 | 27 | // check if boolean or number 28 | if (typeof value === 'boolean' || typeof value === 'number') { 29 | return `${value}`; 30 | } 31 | 32 | const parts: string[] = []; 33 | Object.getOwnPropertyNames(value).forEach((propertyName: string) => { 34 | const propertyValue: any = value[propertyName]; 35 | parts.push(`${propertyName}=${ODataUtils.quoteValue(propertyValue)}`); 36 | }); 37 | 38 | return parts.length > 0 ? parts.join(', ') : `${value}`; 39 | } 40 | 41 | public static tryParseInt(input?: any): { valid: boolean, value: number } { 42 | if (input !== null && !isNaN(input)) { 43 | const parsed: number = parseInt(input, 10); 44 | return { 45 | valid: !isNaN(parsed), 46 | value: parsed 47 | }; 48 | } 49 | 50 | return { 51 | valid: false, 52 | value: NaN 53 | }; 54 | } 55 | } 56 | -------------------------------------------------------------------------------- /src/index.ts: -------------------------------------------------------------------------------- 1 | export * from './angularOData.module'; 2 | export { ODataService } from './angularODataService'; 3 | export { ODataOperation } from './angularODataOperation'; 4 | export { ODataConfiguration } from './angularODataConfiguration'; 5 | export { ODataQuery } from './angularODataQuery'; 6 | export { ODataPagedResult } from './angularODataPagedResult'; 7 | export { ODataServiceFactory } from './angularODataServiceFactory'; 8 | export { IODataResponseModel } from './angularODataResponseModel'; 9 | export { ODataExecReturnType } from './angularODataEnums'; 10 | -------------------------------------------------------------------------------- /test/angularODataOperation.spec.ts: -------------------------------------------------------------------------------- 1 | import { assert } from 'chai'; 2 | import { Observable, of } from 'rxjs'; 3 | 4 | import { HttpClient } from '@angular/common/http'; 5 | import { HttpClientTestingModule } from '@angular/common/http/testing'; 6 | import { inject, TestBed } from '@angular/core/testing'; 7 | 8 | import { AngularODataModule } from '../src'; 9 | import { ODataConfiguration, ODataOperation, ODataServiceFactory } from './../src/index'; 10 | import { IEmployee } from './helpers/employee'; 11 | 12 | export class ODataOperationTest extends ODataOperation { 13 | public Exec(): Observable> { 14 | return of(new Array()); 15 | } 16 | 17 | public GetUrl(): string { 18 | return 'http://test'; 19 | } 20 | } 21 | 22 | describe('ODataOperation', () => { 23 | beforeEach(() => { 24 | TestBed.configureTestingModule({ 25 | providers: [ 26 | HttpClient, 27 | ODataConfiguration, 28 | ODataServiceFactory 29 | ], 30 | imports: [ 31 | AngularODataModule.forRoot(), 32 | HttpClientTestingModule 33 | ] 34 | }); 35 | }); 36 | 37 | it('Expand(string)`1', inject([HttpClient, ODataConfiguration], (http: HttpClient, config: ODataConfiguration) => { 38 | // Assign 39 | const test = new ODataOperationTest('Employees', config, http); 40 | 41 | // Act 42 | test.Expand('x'); 43 | 44 | // Assert 45 | assert.deepEqual(test['_expand'], ['x']); 46 | })); 47 | 48 | it('Expand(string)`2', inject([HttpClient, ODataConfiguration], (http: HttpClient, config: ODataConfiguration) => { 49 | // Assign 50 | const test = new ODataOperationTest('Employees', config, http); 51 | 52 | // Act 53 | test.Expand('x, y'); 54 | 55 | // Assert 56 | assert.deepEqual(test['_expand'], ['x', 'y']); 57 | })); 58 | 59 | it('Expand(string[])', inject([HttpClient, ODataConfiguration], (http: HttpClient, config: ODataConfiguration) => { 60 | // Assign 61 | const test = new ODataOperationTest('Employees', config, http); 62 | 63 | // Act 64 | test.Expand(['a', 'b', 'Boss.FirstName']); 65 | 66 | // Assert 67 | assert.deepEqual(test['_expand'], ['a', 'b', 'Boss.FirstName']); 68 | })); 69 | 70 | it('Select(string)', inject([HttpClient, ODataConfiguration], (http: HttpClient, config: ODataConfiguration) => { 71 | // Assign 72 | const test = new ODataOperationTest('Employees', config, http); 73 | 74 | // Act 75 | test.Select('x,y,z'); 76 | 77 | // Assert 78 | assert.deepEqual(test['_select'], ['x', 'y', 'z']); 79 | })); 80 | 81 | it('Select(string[])', inject([HttpClient, ODataConfiguration], (http: HttpClient, config: ODataConfiguration) => { 82 | // Assign 83 | const test = new ODataOperationTest('Employees', config, http); 84 | 85 | // Act 86 | test.Select(['a', 'b']); 87 | 88 | // Assert 89 | assert.deepEqual(test['_select'], ['a', 'b']); 90 | })); 91 | }); 92 | -------------------------------------------------------------------------------- /test/angularODataUtils.spec.ts: -------------------------------------------------------------------------------- 1 | import { assert } from 'chai'; 2 | import { ODataUtils } from '../src/angularODataUtils'; 3 | 4 | describe('ODataUtils', () => { 5 | 6 | it('quoteValue string', () => { 7 | // Act 8 | const value: string = ODataUtils.quoteValue('test'); 9 | 10 | // Assert 11 | assert.equal(value, `'test'`); 12 | }); 13 | 14 | it('quoteValue string with quotes', () => { 15 | // Act 16 | const value: string = ODataUtils.quoteValue('te\'st\''); 17 | 18 | // Assert 19 | assert.equal(value, `'te\'\'st\'\''`); 20 | }); 21 | 22 | it('quoteValue boolean', () => { 23 | // Act 24 | const value: string = ODataUtils.quoteValue(true); 25 | 26 | // Assert 27 | assert.equal(value, `true`); 28 | }); 29 | 30 | it('quoteValue integer', () => { 31 | // Act 32 | const value: string = ODataUtils.quoteValue(10); 33 | 34 | // Assert 35 | assert.equal(value, '10'); 36 | }); 37 | 38 | it('quoteValue double', () => { 39 | // Act 40 | const value: string = ODataUtils.quoteValue(-10.01); 41 | 42 | // Assert 43 | assert.equal(value, '-10.01'); 44 | }); 45 | 46 | it('quoteValue GUID', () => { 47 | // Act 48 | const value: string = ODataUtils.quoteValue('eefea99a-c988-44b8-ac37-b326a489c1e3'); 49 | 50 | // Assert 51 | assert.equal(value, 'eefea99a-c988-44b8-ac37-b326a489c1e3'); 52 | }); 53 | 54 | it('convertObjectToString', () => { 55 | // Act 56 | const value: string = ODataUtils.convertObjectToString( 57 | { str: 'abc', int: 10, double: -10.01, guid: 'eefea99a-c988-44b8-ac37-b326a489c1e3', omitted: undefined }); 58 | 59 | // Assert 60 | assert.equal(value, `str='abc', int=10, double=-10.01, guid=eefea99a-c988-44b8-ac37-b326a489c1e3`); 61 | }); 62 | 63 | }); 64 | -------------------------------------------------------------------------------- /test/entry.ts: -------------------------------------------------------------------------------- 1 | /// 2 | 3 | // tslint:disable:ordered-imports 4 | import 'core-js'; 5 | import 'zone.js/dist/zone'; 6 | import 'zone.js/dist/long-stack-trace-zone'; 7 | import 'zone.js/dist/async-test'; 8 | import 'zone.js/dist/fake-async-test'; 9 | import 'zone.js/dist/sync-test'; 10 | import 'zone.js/dist/proxy'; 11 | import 'zone.js/dist/jasmine-patch'; 12 | import { use } from 'chai'; 13 | import * as sinonChai from 'sinon-chai'; 14 | import { TestBed } from '@angular/core/testing'; 15 | import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing'; 16 | // import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing'; 17 | // import { HttpClient } from '@angular/common/http'; 18 | 19 | use(sinonChai); 20 | 21 | TestBed.initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting()); 22 | // TestBed.initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(HttpClient)); 23 | 24 | 25 | declare const require: any; 26 | const testsContext: any = require.context('./', true, /\.spec/); 27 | testsContext.keys().forEach(testsContext); 28 | -------------------------------------------------------------------------------- /test/helpers/employee.ts: -------------------------------------------------------------------------------- 1 | import { IOrder } from './order'; 2 | 3 | export interface IEmployee { 4 | EmployeeID: number; 5 | FirstName: string; 6 | LastName: string; 7 | City: string; 8 | BirthDate?: Date; 9 | Boss?: IEmployee; 10 | Orders?: IOrder[]; 11 | } 12 | -------------------------------------------------------------------------------- /test/helpers/employeeBuilder.ts: -------------------------------------------------------------------------------- 1 | import { IEmployee } from './employee'; 2 | 3 | export class IEmployeeBuilder { 4 | private _employee: IEmployee; 5 | 6 | constructor() { 7 | this._employee = { 8 | EmployeeID: 1, 9 | FirstName: 'f', 10 | LastName: 'l', 11 | City: 'c', 12 | BirthDate: undefined, 13 | Orders: undefined, 14 | Boss: undefined 15 | }; 16 | } 17 | 18 | public build(): IEmployee { 19 | return this._employee; 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /test/helpers/httpHeadersMatcher.ts: -------------------------------------------------------------------------------- 1 | import { HttpHeaders } from '@angular/common/http'; 2 | import { assert } from 'chai'; 3 | import { IAsymmetricMatcher } from './jasmineAsymmetricMatcher'; 4 | 5 | export class HttpHeadersMatcher implements IAsymmetricMatcher { 6 | 7 | constructor(private check: { [name: string]: string }) { 8 | } 9 | 10 | public asymmetricMatch(options: any): boolean { 11 | const headers: HttpHeaders = options.headers; 12 | 13 | assert.equal(options.observe, 'response'); 14 | 15 | Object.keys(this.check) 16 | .forEach((key: string) => { 17 | assert.equal(headers.get(key), this.check[key], `The header '${key}' does not have the correct value`); 18 | }); 19 | 20 | return true; 21 | } 22 | 23 | public jasmineToString(): string { 24 | return ``; 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /test/helpers/httpOptionsMatcher.ts: -------------------------------------------------------------------------------- 1 | import { HttpParams } from '@angular/common/http'; 2 | import { assert } from 'chai'; 3 | import { HttpHeadersMatcher } from './httpHeadersMatcher'; 4 | import { IAsymmetricMatcher } from './jasmineAsymmetricMatcher'; 5 | 6 | export class HttpOptionsMatcher implements IAsymmetricMatcher { 7 | 8 | constructor(private params: HttpParams, private headerMatcher?: HttpHeadersMatcher) { 9 | } 10 | 11 | public asymmetricMatch(options: any): boolean { 12 | assert.equal(options.observe, 'response'); 13 | assert.deepEqual(this.params, options.params); 14 | 15 | if (this.headerMatcher) { 16 | return this.headerMatcher.asymmetricMatch(options); 17 | } 18 | 19 | return true; 20 | } 21 | 22 | public jasmineToString(): string { 23 | return ``; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /test/helpers/httpResponseEmployeeBuilder.ts: -------------------------------------------------------------------------------- 1 | import { HttpResponse } from '@angular/common/http'; 2 | import { IODataResponseModel } from '../../src/index'; 3 | import { IEmployee } from './employee'; 4 | 5 | export class HttpResponseEmployeeBuilder { 6 | private readonly body: IODataResponseModel; 7 | private httpStatus: number; 8 | 9 | constructor() { 10 | this.body = { 11 | '@odata.context': 'http://test.org/odata/$metadata#Employees(EmployeeID,FirstName,LastName,BirthDate,City,Orders)', 12 | '@odata.count': 2, 13 | value: [ 14 | { 15 | EmployeeID: 1, 16 | FirstName: 'Nancy', 17 | LastName: 'Davolio', 18 | BirthDate: new Date('1948-12-08T00:00:00Z'), 19 | City: 'Seattle', 20 | Orders: [], 21 | Boss: undefined 22 | }, 23 | { 24 | EmployeeID: 2, 25 | FirstName: 'X', 26 | LastName: 'Y', 27 | BirthDate: new Date('1978-12-08T00:00:00Z'), 28 | City: 'Paris', 29 | Orders: [], 30 | Boss: undefined 31 | } 32 | ] 33 | }; 34 | 35 | this.httpStatus = 200; 36 | } 37 | 38 | public withODataCount(count: number | any): HttpResponseEmployeeBuilder { 39 | this.body['@odata.count'] = count; 40 | return this; 41 | } 42 | 43 | public removeODataCount(): HttpResponseEmployeeBuilder { 44 | delete this.body['@odata.count']; 45 | return this; 46 | } 47 | 48 | public withODataNextLink(link: string): HttpResponseEmployeeBuilder { 49 | this.body['@odata.nextLink'] = link; 50 | return this; 51 | } 52 | 53 | public withHttpStatuscode(status: number): HttpResponseEmployeeBuilder { 54 | this.httpStatus = status; 55 | return this; 56 | } 57 | 58 | public build(): HttpResponse> { 59 | return new HttpResponse>({ 60 | body: this.body, 61 | status: this.httpStatus 62 | }); 63 | } 64 | } 65 | -------------------------------------------------------------------------------- /test/helpers/jasmineAsymmetricMatcher.ts: -------------------------------------------------------------------------------- 1 | export interface IAsymmetricMatcher { 2 | asymmetricMatch(options: any): boolean; 3 | 4 | jasmineToString(): string; 5 | } 6 | -------------------------------------------------------------------------------- /test/helpers/order.ts: -------------------------------------------------------------------------------- 1 | export interface IOrder { 2 | OrderID: number; 3 | CustomerID: string; 4 | EmployeeID: number; 5 | OrderDate: Date; 6 | ShipName: string; 7 | } 8 | -------------------------------------------------------------------------------- /tsconfig-compodoc.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es5", 4 | "module": "commonjs", 5 | "moduleResolution": "node", 6 | "experimentalDecorators": true, 7 | "lib": ["es2015", "dom"] 8 | }, 9 | "include": [ 10 | "src" 11 | ], 12 | "exclude": [ 13 | "node_modules", 14 | "demo", 15 | "test", 16 | "karma.conf.ts", 17 | "webpack.config.ts", 18 | "webpack.config.umd.ts" 19 | ] 20 | } -------------------------------------------------------------------------------- /tsconfig-ngc.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es5", 4 | "module": "es2015", 5 | "moduleResolution": "node", 6 | "declaration": true, 7 | "experimentalDecorators": true, 8 | "baseUrl": "", 9 | "stripInternal": true, 10 | "outDir": "./dist", 11 | "sourceMap": true, 12 | "inlineSources": true, 13 | "types": [], 14 | "lib": ["es2015", "dom"] 15 | }, 16 | "files": [ 17 | "src/index.ts" 18 | ], 19 | "angularCompilerOptions": { 20 | "strictMetadataEmit": true, 21 | "genDir": "./dist/", 22 | "skipTemplateCodegen": true, 23 | "debug": true 24 | } 25 | } -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es5", 4 | "module": "commonjs", 5 | "moduleResolution": "node", 6 | "sourceMap": true, 7 | "emitDecoratorMetadata": true, 8 | "experimentalDecorators": true, 9 | "removeComments": false, 10 | "strictNullChecks": true, 11 | "noImplicitAny": false, 12 | "lib": [ "es2015", "dom" ] 13 | }, 14 | "include": [ 15 | "src/**/*", 16 | "test/**/*", 17 | "demo/**/*" 18 | ], 19 | "exclude": [ 20 | "node_modules" 21 | ] 22 | } -------------------------------------------------------------------------------- /tslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": [ 3 | "tslint-consistent-codestyle" 4 | ], 5 | "rulesDirectory": [ 6 | "node_modules/codelyzer" 7 | ], 8 | "rules": { 9 | "trailing-comma": [ 10 | false, 11 | { 12 | "multiline": "always", 13 | "singleline": "never" 14 | } 15 | ], 16 | "indent": [ 17 | true, 18 | "spaces", 19 | 4 20 | ], 21 | "interface-name": [ 22 | false, 23 | "always-prefix" 24 | ], 25 | "component-selector": [ 26 | true, 27 | "element", 28 | "ao", 29 | "kebab-case" 30 | ], 31 | "directive-selector": [ 32 | true, 33 | "attribute", 34 | "ao", 35 | "camelCase" 36 | ], 37 | "eofline": true, 38 | "import-destructuring-spacing": true, 39 | "no-access-missing-member": false, 40 | "no-attribute-parameter-decorator": true, 41 | "no-forward-ref": true, 42 | "no-input-rename": true, 43 | "no-output-rename": true, 44 | "no-trailing-whitespace": [ 45 | true, 46 | "ignore-comments" 47 | ], 48 | "prefer-const": true, 49 | "pipe-prefix": [ 50 | true, 51 | "ao" 52 | ], 53 | "semicolon": [ 54 | true, 55 | "always" 56 | ], 57 | "triple-equals": true, 58 | "use-host-property-decorator": true, 59 | "use-input-property-decorator": true, 60 | "use-life-cycle-interface": true, 61 | "use-output-property-decorator": true, 62 | "use-pipe-transform-interface": true, 63 | // General 64 | "no-console": [ 65 | true, 66 | "time", 67 | "timeEnd", 68 | "trace" 69 | ], 70 | "max-line-length": [ 71 | true, 72 | 500 73 | ], 74 | "no-string-literal": false, 75 | "no-use-before-declare": true, 76 | "object-literal-sort-keys": false, 77 | "ordered-imports": true, 78 | // tslint-consistent-codestyle settings-start 79 | "no-unused": true, // Disallows unused imports, variables, functions, classes, type parameters and more. 80 | "no-static-this": true, 81 | "no-var-before-return": true, 82 | "prefer-const-enum": true, 83 | // tslint-consistent-codestyle settings-end 84 | "quotemark": [ 85 | true, 86 | "single", 87 | "avoid-escape" 88 | ], 89 | "variable-name": [ 90 | true, 91 | "allow-leading-underscore", 92 | "allow-pascal-case", 93 | "ban-keywords", 94 | "check-format" 95 | ] 96 | } 97 | } -------------------------------------------------------------------------------- /way-of-working.txt: -------------------------------------------------------------------------------- 1 | https://github.com/mattlewis92/generator-angular-library/issues/47 2 | 3 | Ah I see where you're going wrong. Features, fixes should be their own independent changes. The release script is designed to release a set of commits all in own go. So your workflow should look something like 4 | 1/ Make a change in a file (let's assume it's a fix) 5 | 2/ Stage files 6 | 3/ npm run commit to use the interface to create the text 7 | 4/ Repeat steps 1-3 as many times as you want until you're ready to release 8 | 5/ Increase the version in package.json (but don't commit it) 9 | 6/ npm run release:git 10 | 7/ Optionally do npm run gh-pages 11 | 8/ npm run release:npm to publish to npm 12 | 13 | 14 | Other info: 15 | Once you've scaffolded out your library, everything is then controlled by npm scripts: 16 | 17 | npm start to serve the demo page of your library with live-reload as you develop. Unit tests are also run in the background. 18 | npm test will run your unit tests once and npm run test:watch will run them continuously 19 | npm run commit will run the git commit wizard when you're ready to commit a change 20 | npm run release will publish a new release. First make sure you've created the gh-pages branch and pushed it to github. 21 | Next change the version in package.json to the new version you would like to release, but don't commit it yet. 22 | Now run npm run release and the new version will be built and published to npm, as well as the demo and documentation generated and pushed to the gh-pages branch of your project. 23 | -------------------------------------------------------------------------------- /webpack.config.ts: -------------------------------------------------------------------------------- 1 | import * as path from 'path'; 2 | import * as webpack from 'webpack'; 3 | 4 | const IS_PROD: boolean = process.argv.indexOf('-p') > -1; 5 | 6 | export default { 7 | devtool: IS_PROD ? 'source-map' : 'eval', 8 | entry: path.join(__dirname, 'demo', 'entry.ts'), 9 | output: { 10 | filename: 'demo.js', 11 | path: IS_PROD ? path.join(__dirname, 'demo') : __dirname 12 | }, 13 | module: { 14 | rules: [ 15 | { 16 | test: /\.ts$/, 17 | loader: 'tslint-loader?emitErrors=false&failOnHint=false', 18 | exclude: /node_modules/, 19 | enforce: 'pre' 20 | }, 21 | { 22 | test: /\.ts$/, 23 | loader: 'awesome-typescript-loader', 24 | exclude: /node_modules/ 25 | }] 26 | }, 27 | resolve: { 28 | extensions: ['.ts', '.js'] 29 | }, 30 | devServer: { 31 | port: 8000, 32 | inline: true, 33 | hot: true, 34 | historyApiFallback: true, 35 | contentBase: 'demo' 36 | }, 37 | plugins: [ 38 | ...(IS_PROD ? [] : [new webpack.HotModuleReplacementPlugin()]), 39 | new webpack.DefinePlugin({ 40 | ENV: JSON.stringify(IS_PROD ? 'production' : 'development') 41 | }), 42 | new webpack.ContextReplacementPlugin( 43 | /angular(\\|\/)core(\\|\/)@angular/, 44 | path.join(__dirname, 'src') 45 | ), 46 | // https://github.com/angular/angular/issues/11580 47 | new webpack.ContextReplacementPlugin( 48 | /\@angular(\\|\/)core(\\|\/)fesm5/, 49 | path.join(__dirname, 'src') 50 | ) 51 | ] 52 | }; 53 | -------------------------------------------------------------------------------- /webpack.config.umd.ts: -------------------------------------------------------------------------------- 1 | import * as path from 'path'; 2 | import * as webpack from 'webpack'; 3 | 4 | const angularExternals = require('webpack-angular-externals'); 5 | const rxjsExternals = require('webpack-rxjs-externals'); 6 | const pkg = require('./package.json'); 7 | 8 | export default { 9 | entry: { 10 | 'angular-odata-es5.umd': path.join(__dirname, 'src', 'index.ts'), 11 | 'angular-odata-es5.umd.min': path.join(__dirname, 'src', 'index.ts'), 12 | }, 13 | output: { 14 | path: path.join(__dirname, 'dist', 'bundles'), 15 | filename: '[name].js', 16 | libraryTarget: 'umd', 17 | library: 'AngularODataES5' 18 | }, 19 | externals: [ 20 | angularExternals(), 21 | rxjsExternals() 22 | ], 23 | devtool: 'source-map', 24 | module: { 25 | rules: [ 26 | { 27 | test: /\.ts$/, 28 | loader: 'tslint-loader?emitErrors=true&failOnHint=true', 29 | exclude: /node_modules/, 30 | enforce: 'pre' 31 | }, 32 | { 33 | test: /\.ts$/, 34 | loader: 'awesome-typescript-loader', 35 | exclude: /node_modules/ 36 | }] 37 | }, 38 | resolve: { 39 | extensions: ['.ts', '.js'] 40 | }, 41 | plugins: [ 42 | new webpack.optimize.UglifyJsPlugin({ 43 | include: /\.min\.js$/, 44 | sourceMap: true 45 | }), 46 | new webpack.ContextReplacementPlugin( 47 | /angular(\\|\/)core(\\|\/)@angular/, 48 | path.join(__dirname, 'src') 49 | ), 50 | // https://github.com/angular/angular/issues/11580 51 | new webpack.ContextReplacementPlugin( 52 | /\@angular(\\|\/)core(\\|\/)fesm5/, 53 | path.join(__dirname, 'src') 54 | ), 55 | new webpack.BannerPlugin({ 56 | banner: ` 57 | /** 58 | * ${pkg.name} - ${pkg.description} 59 | * @version v${pkg.version} 60 | * @author ${pkg.author} 61 | * @link ${pkg.homepage} 62 | * @license ${pkg.license} 63 | */ 64 | `.trim(), 65 | raw: true, 66 | entryOnly: true 67 | }) 68 | ] 69 | }; 70 | --------------------------------------------------------------------------------