Andreas/ngx-admin
1
0
Fork 0
mirror of https://github.com/akveo/ngx-admin.git synced 2025-12-16 23:40:14 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

build(dependencies): update bootstrap to 4.0.0-alpha.6

Browse source
This commit is contained in:
hryb 2017-04-10 15:48:15 +03:00 • committed by Lex Zhukov
parent 2d6e848df3
commit ef2ca9c09c
25 changed files with 227 additions and 172 deletions
Download patch file Download diff file Expand all files Collapse all files

3
.bootstraprc
View file

@ -69,7 +69,6 @@ styles:
buttons: true buttons: true
# Components # Components
animation: true
dropdown: true dropdown: true
button-group: true button-group: true
input-group: true input-group: true
@ -86,7 +85,7 @@ styles:
list-group: true list-group: true
responsive-embed: true responsive-embed: true
close: true close: true
tags: true transitions: true
# Components w/ JavaScript # Components w/ JavaScript
modal: true modal: true

3
package.json
View file

@ -18,10 +18,11 @@
"@angularclass/conventions-loader": "1.0.13", "@angularclass/conventions-loader": "1.0.13",
"@angularclass/hmr": "1.2.2", "@angularclass/hmr": "1.2.2",
"@angularclass/hmr-loader": "3.0.2", "@angularclass/hmr-loader": "3.0.2",
"@ng-bootstrap/ng-bootstrap": "1.0.0-alpha.22",
"amcharts3": "github:amcharts/amcharts3", "amcharts3": "github:amcharts/amcharts3",
"ammap3": "github:amcharts/ammap3", "ammap3": "github:amcharts/ammap3",
"animate.css": "3.5.2", "animate.css": "3.5.2",
"bootstrap": "4.0.0-alpha.4", "bootstrap": "4.0.0-alpha.6",
"chart.js": "1.1.1", "chart.js": "1.1.1",
"chartist": "0.10.1", "chartist": "0.10.1",
"ckeditor": "4.6.0", "ckeditor": "4.6.0",

3
src/app/app.module.ts
View file

@ -4,6 +4,7 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http'; import { HttpModule } from '@angular/http';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { removeNgStyles, createNewHosts, createInputTransfer } from '@angularclass/hmr'; import { removeNgStyles, createNewHosts, createInputTransfer } from '@angularclass/hmr';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
/* /*
* Platform and Environment providers/directives/pipes * Platform and Environment providers/directives/pipes
@ -18,6 +19,7 @@ import { GlobalState } from './global.state';
import { NgaModule } from './theme/nga.module'; import { NgaModule } from './theme/nga.module';
import { PagesModule } from './pages/pages.module'; import { PagesModule } from './pages/pages.module';
// Application wide providers // Application wide providers
const APP_PROVIDERS = [ const APP_PROVIDERS = [
AppState, AppState,
@ -45,6 +47,7 @@ export type StoreType = {
FormsModule, FormsModule,
ReactiveFormsModule, ReactiveFormsModule,
NgaModule.forRoot(), NgaModule.forRoot(),
NgbModule.forRoot(),
PagesModule, PagesModule,
routing routing
], ],

6
src/app/pages/dashboard/pieChart/pieChart.scss
View file

@ -16,19 +16,19 @@
@media screen and (min-width: 1325px) { @media screen and (min-width: 1325px) {
.pie-chart-item-container { .pie-chart-item-container {
width: 25%; max-width: 25%;
flex: 0 0 25% flex: 0 0 25%
} }
} }
@media screen and (min-width: 700px) and (max-width: 1325px) { @media screen and (min-width: 700px) and (max-width: 1325px) {
.pie-chart-item-container { .pie-chart-item-container {
width: 50%; max-width: 50%;
flex: 0 0 50% flex: 0 0 50%
} }
} }
@media screen and (max-width: 700px) { @media screen and (max-width: 700px) {
.pie-chart-item-container { .pie-chart-item-container {
width: 100%; max-width: 100%;
flex: 0 0 100% flex: 0 0 100%
} }
} }

2
src/app/pages/dashboard/popularApp/popularApp.scss
View file

@ -42,6 +42,8 @@
} }
.row { .row {
margin: 0; margin: 0;
display: flex;
justify-content: space-between;
> div { > div {
padding: 0; padding: 0;
} }

18
src/app/pages/forms/components/inputs/components/ratinginputs/ratinginputs.html
View file

@ -1,9 +1,13 @@
<div class="col-md-4"> <div class="raiting-box">
<rating [(ngModel)]="_rate1" max="{{_max1}}" stateOn="ion-android-star" stateOff="ion-android-star-outline" class="rating"></rating> <div class="col-md-4">
<span class="help-block">Rate: {{_rate1}}</span> <rating [(ngModel)]="_rate1" max="{{_max1}}" stateOn="ion-android-star" stateOff="ion-android-star-outline"
</div> class="rating"></rating>
<span class="help-block">Rate: {{_rate1}}</span>
</div>
<div class="col-md-8"> <div class="col-md-8">
<rating [(ngModel)]="_rate2" max="{{_max2}}" stateOn="ion-ios-heart" stateOff="ion-ios-heart-outline" class="rating"></rating> <rating [(ngModel)]="_rate2" max="{{_max2}}" stateOn="ion-ios-heart" stateOff="ion-ios-heart-outline"
<span class="help-block">Rate: {{_rate2}}</span> class="rating"></rating>
<span class="help-block">Rate: {{_rate2}}</span>
</div>
</div> </div>

68
src/app/pages/ui/components/grid/grid.html
View file

@ -74,84 +74,84 @@
<h4 class="grid-h">Mobile and desktop</h4> <h4 class="grid-h">Mobile and desktop</h4>
<div class="row show-grid"> <div class="row show-grid">
<div class="col-xs-12 col-md-8"> <div class="col-12 col-md-8">
<div>xs-12 .col-md-8</div> <div>xs-12 .col-md-8</div>
</div> </div>
<div class="col-xs-6 col-md-4"> <div class="col-6 col-md-4">
<div>xs-6 .col-md-4</div> <div>xs-6 .col-md-4</div>
</div> </div>
</div> </div>
<div class="row show-grid"> <div class="row show-grid">
<div class="col-xs-6 col-md-4"> <div class="col-6 col-md-4">
<div>xs-6 .col-md-4</div> <div>xs-6 .col-md-4</div>
</div> </div>
<div class="col-xs-6 col-md-4"> <div class="col-6 col-md-4">
<div>xs-6 .col-md-4</div> <div>xs-6 .col-md-4</div>
</div> </div>
<div class="col-xs-6 col-md-4"> <div class="col-6 col-md-4">
<div>xs-6 .col-md-4</div> <div>xs-6 .col-md-4</div>
</div> </div>
</div> </div>
<div class="row show-grid"> <div class="row show-grid">
<div class="col-xs-6"> <div class="col-6">
<div>.col-xs-6</div> <div>.col-6</div>
</div> </div>
<div class="col-xs-6"> <div class="col-6">
<div>.col-xs-6</div> <div>.col-6</div>
</div> </div>
</div> </div>
<h4 class="grid-h">Mobile, tablet, desktop</h4> <h4 class="grid-h">Mobile, tablet, desktop</h4>
<div class="row show-grid"> <div class="row show-grid">
<div class="col-xs-12 col-sm-6 col-md-8"> <div class="col-12 col-sm-6 col-md-8">
<div>.col-xs-12 .col-sm-6 .col-md-8</div> <div>.col-12 .col-sm-6 .col-md-8</div>
</div> </div>
<div class="col-xs-6 col-md-4"> <div class="col-6 col-md-4">
<div>.col-xs-6 .col-md-4</div> <div>.col-6 .col-md-4</div>
</div> </div>
</div> </div>
<div class="row show-grid"> <div class="row show-grid">
<div class="col-xs-6 col-sm-4"> <div class="col-6 col-sm-4">
<div>.col-xs-6 .col-sm-4</div> <div>.col-6 .col-sm-4</div>
</div> </div>
<div class="col-xs-6 col-sm-4"> <div class="col-6 col-sm-4">
<div>.col-xs-6 .col-sm-4</div> <div>.col-6 .col-sm-4</div>
</div> </div>
<div class="clearfix hidden-xs-up"></div> <div class="clearfix hidden-xs-up"></div>
<div class="col-xs-6 col-sm-4"> <div class="col-6 col-sm-4">
<div>.col-xs-6 .col-sm-4</div> <div>.col-6 .col-sm-4</div>
</div> </div>
</div> </div>
<h4 class="grid-h">Column wrapping</h4> <h4 class="grid-h">Column wrapping</h4>
<div class="row show-grid"> <div class="row show-grid">
<div class="col-xs-9"> <div class="col-9">
<div>.col-xs-9</div> <div>.col-9</div>
</div> </div>
<div class="col-xs-4"> <div class="col-4">
<div>.col-xs-4<br>Since 9 + 4 = 13 &gt; 12, this 4-column-wide div gets wrapped onto a new line as one contiguous <div>.col-4<br>Since 9 + 4 = 13 &gt; 12, this 4-column-wide div gets wrapped onto a new line as one contiguous
unit. unit.
</div> </div>
</div> </div>
<div class="col-xs-6"> <div class="col-6">
<div>.col-xs-6<br>Subsequent columns continue along the new line.</div> <div>.col-6<br>Subsequent columns continue along the new line.</div>
</div> </div>
</div> </div>
<h4 class="grid-h">Responsive column resets</h4> <h4 class="grid-h">Responsive column resets</h4>
<div class="row show-grid"> <div class="row show-grid">
<div class="col-xs-6 col-sm-3"> <div class="col-6 col-sm-3">
<div>.col-xs-6 .col-sm-3 <p>Resize your viewport or check it out on your phone for an example.</p></div> <div>.col-6 .col-sm-3 <p>Resize your viewport or check it out on your phone for an example.</p></div>
</div> </div>
<div class="col-xs-6 col-sm-3"> <div class="col-6 col-sm-3">
<div>.col-xs-6 .col-sm-3</div> <div>.col-6 .col-sm-3</div>
</div> </div>
<div class="clearfix hidden-xs-up"></div> <div class="clearfix hidden-xs-up"></div>
<div class="col-xs-6 col-sm-3"> <div class="col-6 col-sm-3">
<div>.col-xs-6 .col-sm-3</div> <div>.col-6 .col-sm-3</div>
</div> </div>
<div class="col-xs-6 col-sm-3"> <div class="col-6 col-sm-3">
<div>.col-xs-6 .col-sm-3</div> <div>.col-6 .col-sm-3</div>
</div> </div>
</div> </div>
@ -217,7 +217,7 @@
</tr> </tr>
<tr> <tr>
<th class="text-nowrap" scope="row">Class prefix</th> <th class="text-nowrap" scope="row">Class prefix</th>
<td><code>.col-xs-</code></td> <td><code>.col-</code></td>
<td><code>.col-sm-</code></td> <td><code>.col-sm-</code></td>
<td><code>.col-md-</code></td> <td><code>.col-md-</code></td>
<td><code>.col-lg-</code></td> <td><code>.col-lg-</code></td>

6
src/app/pages/ui/components/icons/icons.html
View file

@ -13,7 +13,7 @@
<ba-card title="Socicon" baCardClass="with-scroll"> <ba-card title="Socicon" baCardClass="with-scroll">
<div class="row icons-list danger"> <div class="row icons-list danger">
<div class="col-xs-2" *ngFor="let icon of icons.socicon"><i class="socicon">{{ icon }}</i></div> <div class="col-2" *ngFor="let icon of icons.socicon"><i class="socicon">{{ icon }}</i></div>
</div> </div>
<a href="http://www.socicon.com/chart.php" target="_blank" class="see-all-icons">See all Socicon icons</a> <a href="http://www.socicon.com/chart.php" target="_blank" class="see-all-icons">See all Socicon icons</a>
</ba-card> </ba-card>
@ -30,14 +30,14 @@
<ba-card title="Ionicons" baCardClass="with-scroll"> <ba-card title="Ionicons" baCardClass="with-scroll">
<div class="row icons-list primary"> <div class="row icons-list primary">
<div class="col-xs-2" *ngFor="let icon of icons.ionicons"><i class="{{ icon }}"></i></div> <div class="col-2" *ngFor="let icon of icons.ionicons"><i class="{{ icon }}"></i></div>
</div> </div>
<a href="http://ionicons.com/" target="_blank" class="see-all-icons">See all ionicons icons</a> <a href="http://ionicons.com/" target="_blank" class="see-all-icons">See all ionicons icons</a>
</ba-card> </ba-card>
<ba-card title="Font Awesome Icons" baCardClass="with-scroll"> <ba-card title="Font Awesome Icons" baCardClass="with-scroll">
<div class="row icons-list success awesomeIcons"> <div class="row icons-list success awesomeIcons">
<div class="col-xs-2" *ngFor="let icon of icons.fontAwesomeIcons"><i class="fa {{ icon }}"></i></div> <div class="col-2" *ngFor="let icon of icons.fontAwesomeIcons"><i class="fa {{ icon }}"></i></div>
</div> </div>
<a href="http://fortawesome.github.io/Font-Awesome/icons/" target="_blank" class="see-all-icons">See all Font Awesome icons</a> <a href="http://fortawesome.github.io/Font-Awesome/icons/" target="_blank" class="see-all-icons">See all Font Awesome icons</a>
</ba-card> </ba-card>

14
src/app/pages/ui/components/modals/default-modal/default-modal.component.html Normal file
View file

@ -0,0 +1,14 @@
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">{{modalHeader}}</h4>
<button class="close" aria-label="Close" (click)="closeModal()">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
{{modalContent}}
</div>
<div class="modal-footer">
<button class="btn btn-primary confirm-btn" (click)="closeModal()">Save changes</button>
</div>
</div>

9
src/app/pages/ui/components/modals/default-modal/default-modal.component.scss Normal file
View file

@ -0,0 +1,9 @@
@import "../../../../../theme/sass/conf/conf";
.modal-buttons .btn {
margin-right: 20px;
}
.modal-content {
color: $dropdown-text;
}

28
src/app/pages/ui/components/modals/default-modal/default-modal.component.ts Normal file
View file

@ -0,0 +1,28 @@
import { Component, OnInit } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
@Component({
selector: 'add-service-modal',
styleUrls: [('./default-modal.component.scss')],
templateUrl: './default-modal.component.html'
})
export class DefaultModal implements OnInit {
modalHeader: string;
modalContent: string = `Lorem ipsum dolor sit amet,
consectetuer adipiscing elit, sed diam nonummy
nibh euismod tincidunt ut laoreet dolore magna aliquam
erat volutpat. Ut wisi enim ad minim veniam, quis
nostrud exerci tation ullamcorper suscipit lobortis
nisl ut aliquip ex ea commodo consequat.`;
constructor(private activeModal: NgbActiveModal) {
}
ngOnInit() {}
closeModal() {
this.activeModal.close();
}
}

31
src/app/pages/ui/components/modals/modals.component.ts
View file

@ -1,5 +1,6 @@
import { Component, ViewChild } from '@angular/core'; import { Component } from '@angular/core';
import { ModalDirective } from 'ng2-bootstrap'; import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { DefaultModal } from './default-modal/default-modal.component';
@Component({ @Component({
selector: 'modals', selector: 'modals',
@ -7,13 +8,29 @@ import { ModalDirective } from 'ng2-bootstrap';
templateUrl: './modals.html' templateUrl: './modals.html'
}) })
export class Modals { export class Modals {
@ViewChild('childModal') childModal: ModalDirective;
showChildModal(): void { constructor(private modalService: NgbModal) {}
this.childModal.show();
lgModalShow() {
const activeModal = this.modalService.open(DefaultModal, {size: 'lg'});
activeModal.componentInstance.modalHeader = 'Large Modal';
}
smModalShow(): void {
const activeModal = this.modalService.open(DefaultModal, {size: 'sm'});
activeModal.componentInstance.modalHeader = 'Small Modal';
} }
hideChildModal(): void { staticModalShow() {
this.childModal.hide(); const activeModal = this.modalService.open(DefaultModal, {size: 'sm',
backdrop: 'static'});
activeModal.componentInstance.modalHeader = 'Static modal';
activeModal.componentInstance.modalContent = `This is static modal, backdrop click
will not close it. Click × or confirmation button to close modal.`;
}
childModalShow() {
const activeModal = this.modalService.open(DefaultModal, {size: 'sm'});
activeModal.componentInstance.modalHeader = 'Child modal';
activeModal.componentInstance.modalContent = `I am a child modal, opened from parent component!`;
} }
} }

92
src/app/pages/ui/components/modals/modals.html
View file

@ -2,95 +2,11 @@
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<ba-card title="Modals" class="modal-buttons"> <ba-card title="Modals" class="modal-buttons">
<button class="btn btn-success" (click)="lgModal.show()">Large modal</button> <button class="btn btn-success" (click)="lgModalShow()">Large modal</button>
<button class="btn btn-warning" (click)="smModal.show()">Small modal</button> <button class="btn btn-warning" (click)="smModalShow()">Small modal</button>
<button class="btn btn-primary" (click)="staticModal.show()">Static modal</button> <button class="btn btn-primary" (click)="staticModalShow()">Static modal</button>
<button class="btn btn-danger" (click)="showChildModal()">Open child modal</button> <button class="btn btn-danger" (click)="childModalShow()">Open child modal</button>
</ba-card> </ba-card>
</div> </div>
</div> </div>
<div class="row">
</div>
</div>
<!-- Large modal -->
<div bsModal #lgModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button class="close" (click)="lgModal.hide()" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title">Large modal</h4>
</div>
<div class="modal-body">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
</div>
<div class="modal-footer">
<button class="btn btn-primary confirm-btn" (click)="lgModal.hide()">Save changes</button>
</div>
</div>
</div>
</div>
<!-- Small modal -->
<div bsModal #smModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button class="close" aria-label="Close" (click)="smModal.hide()">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title">Small modal</h4>
</div>
<div class="modal-body">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
</div>
<div class="modal-footer">
<button class="btn btn-primary confirm-btn" (click)="smModal.hide()">Save changes</button>
</div>
</div>
</div>
</div>
<!-- Static modal -->
<div class="modal fade" bsModal #staticModal="bs-modal" [config]="{backdrop: 'static'}" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button class="close" aria-label="Close" (click)="staticModal.hide()">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title">Static modal</h4>
</div>
<div class="modal-body">
This is static modal, backdrop click will not close it.
Click <b>&times;</b> or confirmation button to close modal.
</div>
<div class="modal-footer">
<button class="btn btn-primary confirm-btn" (click)="staticModal.hide()">Save changes</button>
</div>
</div>
</div>
</div>
<!-- control modal from parent component -->
<div bsModal #childModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button class="close" aria-label="Close" (click)="hideChildModal()">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title">Child modal</h4>
</div>
<div class="modal-body">
I am a child modal, opened from parent component!
</div>
<div class="modal-footer">
<button class="btn btn-primary confirm-btn" (click)="hideChildModal()">Save changes</button>
</div>
</div>
</div>
</div> </div>

4
src/app/pages/ui/ui.module.ts
View file

@ -21,6 +21,7 @@ import { LargeButtons } from './components/buttons/components/largeButtons';
import { DropdownButtons } from './components/buttons/components/dropdownButtons'; import { DropdownButtons } from './components/buttons/components/dropdownButtons';
import { GroupButtons } from './components/buttons/components/groupButtons'; import { GroupButtons } from './components/buttons/components/groupButtons';
import { IconsService } from './components/icons/icons.service'; import { IconsService } from './components/icons/icons.service';
import { DefaultModal } from './components/modals/default-modal/default-modal.component';
@NgModule({ @NgModule({
@ -46,7 +47,8 @@ import { IconsService } from './components/icons/icons.service';
IconButtons, IconButtons,
LargeButtons, LargeButtons,
DropdownButtons, DropdownButtons,
GroupButtons GroupButtons,
DefaultModal
], ],
providers: [ providers: [
IconsService IconsService

15
src/app/theme/components/baCheckbox/baCheckbox.component.ts
View file

@ -21,8 +21,12 @@ export class BaCheckbox implements ControlValueAccessor {
state.valueAccessor = this; state.valueAccessor = this;
} }
public onChange(value: any): void {} public onChange(value: any): void {
public onTouch(value: any): void {} }
public onTouch(value: any): void {
}
public writeValue(state: any): void { public writeValue(state: any): void {
this.state = state; this.state = state;
} }
@ -31,7 +35,10 @@ export class BaCheckbox implements ControlValueAccessor {
this.onChange = function(state: boolean) { this.onChange = function(state: boolean) {
this.writeValue(state); this.writeValue(state);
this.model.viewToModelUpdate(state); this.model.viewToModelUpdate(state);
} };
}
public registerOnTouched(fn: any): void {
this.onTouch = fn;
} }
public registerOnTouched(fn: any): void { this.onTouch = fn; }
} }

4
src/app/theme/components/baMultiCheckbox/baMultiCheckbox.component.ts
View file

@ -4,6 +4,7 @@ import {ControlValueAccessor, NgModel} from '@angular/forms';
@Component({ @Component({
selector: 'ba-multi-checkbox[ngModel]', selector: 'ba-multi-checkbox[ngModel]',
templateUrl: './baMultiCheckbox.html', templateUrl: './baMultiCheckbox.html',
styleUrls: ['./baMultiCheckbox.scss'],
providers: [NgModel] providers: [NgModel]
}) })
export class BaMultiCheckbox implements ControlValueAccessor { export class BaMultiCheckbox implements ControlValueAccessor {
@ -20,7 +21,6 @@ export class BaMultiCheckbox implements ControlValueAccessor {
public getProp(item: any, propName: string): string { public getProp(item: any, propName: string): string {
const prop = this.propertiesMapping[propName]; const prop = this.propertiesMapping[propName];
if (!prop) { if (!prop) {
return item[propName]; return item[propName];
} else if (typeof prop === 'function') { } else if (typeof prop === 'function') {
@ -38,7 +38,7 @@ export class BaMultiCheckbox implements ControlValueAccessor {
this.onChange = function(state: boolean) { this.onChange = function(state: boolean) {
this.writeValue(state); this.writeValue(state);
this.model.viewToModelUpdate(state); this.model.viewToModelUpdate(state);
} };
} }
public registerOnTouched(fn: any): void { this.onTouch = fn; } public registerOnTouched(fn: any): void { this.onTouch = fn; }
} }

2
src/app/theme/components/baMultiCheckbox/baMultiCheckbox.html
View file

@ -1,4 +1,4 @@
<div class="{{baMultiCheckboxClass}}"> <div class="{{baMultiCheckboxClass}} container-content">
<ba-checkbox *ngFor="let item of state" <ba-checkbox *ngFor="let item of state"
[(ngModel)]="item[propertiesMapping.model]" [(ngModel)]="item[propertiesMapping.model]"
[baCheckboxClass]="getProp(item, 'baCheckboxClass')" [baCheckboxClass]="getProp(item, 'baCheckboxClass')"

10
src/app/theme/components/baMultiCheckbox/baMultiCheckbox.scss Normal file
View file

@ -0,0 +1,10 @@
@import '../../sass/conf/conf';
.container-content {
width: 100%;
display: flex;
ba-checkbox {
width: 100%;
}
}

1
src/app/theme/sass/_buttons.scss
View file

@ -5,6 +5,7 @@ $hover: 24;
} }
.btn { .btn {
cursor: pointer;
border-radius: 5px; border-radius: 5px;
transition: all 0.1s ease; transition: all 0.1s ease;
padding: 0.344rem 1rem; padding: 0.344rem 1rem;

8
src/app/theme/sass/_form.scss
View file

@ -314,6 +314,10 @@ label.custom-input-danger {
.input-demo { .input-demo {
line-height: 25px; line-height: 25px;
ba-multi-checkbox {
width: 100%;
}
} }
@mixin validationState($color, $focusColor) { @mixin validationState($color, $focusColor) {
@ -400,6 +404,10 @@ label.custom-input-danger {
vertical-align: sub; vertical-align: sub;
} }
.raiting-box {
display: flex;
}
.help-block.error-block { .help-block.error-block {
display: none; display: none;
.has-error &.basic-block { .has-error &.basic-block {

19
src/app/theme/sass/_modal.scss Normal file
View file

@ -0,0 +1,19 @@
.modal-header {
border: none;
padding: 10px 15px 0 15px;
}
.modal-footer {
border: none;
}
button.close {
padding-bottom: 2px;
color: #000;
text-shadow: 0 1px 0 #fff;
opacity: .2;
&:hover {
opacity: .5;
}
}

9
src/app/theme/sass/_table.scss
View file

@ -340,3 +340,12 @@ th {
.table-responsive { .table-responsive {
margin-top: 10px; margin-top: 10px;
} }
.ng2-smart-pagination {
display: flex !important;
}
.ng2-smart-pagination-nav {
margin-top: 16px;
}

25
src/app/theme/sass/_typography.scss
View file

@ -432,52 +432,53 @@ a.learn-more {
@media screen and (min-width: 1620px) { @media screen and (min-width: 1620px) {
.col-xlg-1 { .col-xlg-1 {
width: 8.33333333%; max-width: 8.33333333%;
flex: 0 0 8.33333333%; flex: 0 0 8.33333333%;
} }
.col-xlg-2 { .col-xlg-2 {
width: 16.66666667%; max-width: 16.66666667%;
flex: 0 0 16.66666667%; flex: 0 0 16.66666667%;
} }
.col-xlg-3 { .col-xlg-3 {
width: 25%; max-width: 25%;
flex: 0 0 25%; flex: 0 0 25%;
} }
.col-xlg-4 { .col-xlg-4 {
width: 33.33333333%; max-width: 33.33333333%;
flex: 0 0 33.33333333%; flex: 0 0 33.33333333%;
} }
.col-xlg-5 { .col-xlg-5 {
width: 41.66666667%; max-width: 41.66666667%;
flex: 0 0 41.66666667%; flex: 0 0 41.66666667%;
} }
.col-xlg-6 { .col-xlg-6 {
width: 50%; max-width: 50%;
flex: 0 0 50%; flex: 0 0 50%;
} }
.col-xlg-7 { .col-xlg-7 {
width: 58.33333333%; max-width: 58.33333333%;
flex: 0 0 58.33333333%; flex: 0 0 58.33333333%;
} }
.col-xlg-8 { .col-xlg-8 {
width: 66.66666667%; max-width: 66.66666667%;
flex: 0 0 66.66666667%; flex: 0 0 66.66666667%;
} }
.col-xlg-9 { .col-xlg-9 {
width: 75%; max-width: 75%;
flex: 0 0 75%; flex: 0 0 75%;
} }
.col-xlg-10 { .col-xlg-10 {
width: 83.33333333%; max-width: 83.33333333%;
flex: 0 0 83.33333333%; flex: 0 0 83.33333333%;
} }
.col-xlg-11 { .col-xlg-11 {
width: 91.66666667%; max-width: 91.66666667%;
flex: 0 0 91.66666667%; flex: 0 0 91.66666667%;
} }
.col-xlg-12 { .col-xlg-12 {
width: 100%; max-width: 100%;
flex: 0 0 100%; flex: 0 0 100%;
} }
} }

1
src/app/theme/theme.scss
View file

@ -9,3 +9,4 @@
@import "sass/table"; @import "sass/table";
@import "sass/form"; @import "sass/form";
@import "sass/treeView"; @import "sass/treeView";
@import "sass/modal";

18
yarn.lock
View file

@ -70,6 +70,10 @@
version "1.2.2" version "1.2.2"
resolved "https://registry.yarnpkg.com/@angularclass/hmr/-/hmr-1.2.2.tgz#46a18f89a1e94d05c268b83c9480e005f73fc265" resolved "https://registry.yarnpkg.com/@angularclass/hmr/-/hmr-1.2.2.tgz#46a18f89a1e94d05c268b83c9480e005f73fc265"
"@ng-bootstrap/ng-bootstrap@1.0.0-alpha.22":
version "1.0.0-alpha.22"
resolved "https://registry.yarnpkg.com/@ng-bootstrap/ng-bootstrap/-/ng-bootstrap-1.0.0-alpha.22.tgz#aaad058cc39293ea6184e4b9b849f298c0b11a86"
"@types/electron@1.4.32": "@types/electron@1.4.32":
version "1.4.32" version "1.4.32"
resolved "https://registry.yarnpkg.com/@types/electron/-/electron-1.4.32.tgz#3c9fce4aa53b26213bc1f1b640206191d449fa76" resolved "https://registry.yarnpkg.com/@types/electron/-/electron-1.4.32.tgz#3c9fce4aa53b26213bc1f1b640206191d449fa76"
@ -592,12 +596,12 @@ bootstrap-loader@2.0.0-beta.21:
semver "^5.3.0" semver "^5.3.0"
strip-json-comments "^2.0.1" strip-json-comments "^2.0.1"
bootstrap@4.0.0-alpha.4: bootstrap@4.0.0-alpha.6:
version "4.0.0-alpha.4" version "4.0.0-alpha.6"
resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.0.0-alpha.4.tgz#823cb353d6c50a38df98aa18ec4df56ef0355e7a" resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.0.0-alpha.6.tgz#4f54dd33ac0deac3b28407bc2df7ec608869c9c8"
dependencies: dependencies:
jquery "1.9.1 - 3" jquery ">=1.9.1"
tether "^1.1.1" tether "^1.4.0"
boxen@^0.6.0: boxen@^0.6.0:
version "0.6.0" version "0.6.0"
@ -2725,7 +2729,7 @@ jquery-slimscroll@1.3.8:
dependencies: dependencies:
jquery ">= 1.7" jquery ">= 1.7"
"jquery@1.9.1 - 3", jquery@2.2.4, "jquery@>= 1.7", jquery@>=1.7.1: jquery@2.2.4, "jquery@>= 1.7", jquery@>=1.7.1, jquery@>=1.9.1:
version "2.2.4" version "2.2.4"
resolved "https://registry.yarnpkg.com/jquery/-/jquery-2.2.4.tgz#2c89d6889b5eac522a7eea32c14521559c6cbf02" resolved "https://registry.yarnpkg.com/jquery/-/jquery-2.2.4.tgz#2c89d6889b5eac522a7eea32c14521559c6cbf02"
@ -5416,7 +5420,7 @@ tar@^2.0.0, tar@~2.2.1:
fstream "^1.0.2" fstream "^1.0.2"
inherits "2" inherits "2"
tether@1.4.0, tether@^1.1.1: tether@1.4.0, tether@^1.4.0:
version "1.4.0" version "1.4.0"
resolved "https://registry.yarnpkg.com/tether/-/tether-1.4.0.tgz#0f9fa171f75bf58485d8149e94799d7ae74d1c1a" resolved "https://registry.yarnpkg.com/tether/-/tether-1.4.0.tgz#0f9fa171f75bf58485d8149e94799d7ae74d1c1a"