MaDgIK
/
connect-admin
13
0
Fork 0
Code Issues Pull Requests Projects Releases 8 Wiki Activity

Created branches and trunk folders

Browse Source 
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-admin-portal/trunk@49061 d315682c-612b-4755-9ff5-7f18f6832af3
master
argiro.kokogiannaki 7 years ago
commit 7afdc2079c
243 changed files with 70623 additions and 0 deletions
Show Stats Download Patch File Download Diff File

21
LICENSE
Unescape Escape View File

@ -0,0 +1,21 @@
MIT License
Copyright (c) 2017 Stefanos Gatsios
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

55
app/app.component.html
Unescape Escape View File

@ -0,0 +1,55 @@
<div id="wrapper">
<div id="sidebar-default" class="main-sidebar">
<div class="current-user">
<a class="name" href="http://www.openminted.eu">
<img width="100%" src="http://openminted.eu/wp-content/uploads/2016/02/OpenMINTED_Tag_Color.png" alt="OpenMinted">
</a>
</div>
<div class="menu-section">
<h3>General</h3>
<ul>
<li>
<a routerLink="/dashboard" routerLinkActive="active">
<i class="fa fa-globe"></i>
<span>Dashboard</span>
</a>
</li>
</ul>
</div>
<div class="menu-section">
<h3>FAQs</h3>
<ul>
<li>
<a routerLink="/topics" routerLinkActive="active">
<i class="fa fa-globe"></i>
<span>Topics</span>
</a>
</li>
<li>
<a routerLink="/questions" routerLinkActive="active">
<i class="fa fa-cog"></i>
<span>Questions</span>
</a>
</li>
</ul>
</div>
<div class="menu-section">
<h3>Help Content</h3>
<ul>
<li>
<a routerLink="/pages" routerLinkActive="active">
<i class="fa fa-globe"></i>
<span>Pages</span>
</a>
</li>
<li>
<a routerLink="/pageContents" routerLinkActive="active">
<i class="fa fa-cog"></i>
<span>Page Contents</span>
</a>
</li>
</ul>
</div>
</div>
<router-outlet></router-outlet>
</div>

15
app/app.component.ts
Unescape Escape View File

@ -0,0 +1,15 @@
/**
* Created by stefania on 3/21/16.
*/
import { Component } from '@angular/core';
@Component({
selector: 'metadata-registry-service',
templateUrl: './app.component.html',
})
export class AppComponent {
title = 'Metadata Registry Service';
}

65
app/app.module.ts
Unescape Escape View File

@ -0,0 +1,65 @@
/**
* Created by stefania on 9/16/16.
*/
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpModule, JsonpModule } from '@angular/http';
import { AppComponent } from "./app.component";
import { routing, appRoutingProviders } from "./app.routing";
import { DashboardComponent } from "./dashboard.component";
import { TopicsComponent } from "./pages/faq/topics.components";
import { QuestionsComponent } from "./pages/faq/questions.component";
import { FAQService } from "./services/faq.service";
import { ModalModule } from 'ngx-bootstrap';
import { TopicsFormComponent } from "./pages/faq/topics-form.component";
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { ModalFormComponent } from "./pages/modal-form.component";
import { QuestionsFormComponent } from "./pages/faq/questions-form.component";
import { DeleteConfirmationDialogComponent } from "./pages/delete-confirmation-dialog.component";
import { JWBootstrapSwitchModule } from 'jw-bootstrap-switch-ng2';
import { PagesComponent } from "./pages/helpcontent/pages.component";
import { HelpContentService } from "./services/help-content.service";
import { PageFormComponent } from "./pages/helpcontent/page-form.component";
import { PageHelpContentsComponent } from "./pages/helpcontent/page-help-contents.component";
import { NewPageHelpContentComponent } from "./pages/helpcontent/new-page-help-content.component";
import { CKEditorModule } from 'ng2-ckeditor';
import { PageContentFormComponent } from "./pages/helpcontent/page-help-content-form.component";
import { EditPageHelpContentComponent } from "./pages/helpcontent/edit-page-help-content.component";
@NgModule({
imports: [
BrowserModule,
routing,
HttpModule,
JsonpModule,
ModalModule.forRoot(),
FormsModule,
ReactiveFormsModule,
JWBootstrapSwitchModule,
CKEditorModule
],
declarations: [
AppComponent,
DashboardComponent,
TopicsComponent,
QuestionsComponent,
TopicsFormComponent,
ModalFormComponent,
QuestionsFormComponent,
DeleteConfirmationDialogComponent,
PagesComponent,
PageFormComponent,
PageHelpContentsComponent,
NewPageHelpContentComponent,
PageContentFormComponent,
EditPageHelpContentComponent
],
providers: [
FAQService,
HelpContentService,
appRoutingProviders
],
bootstrap: [ AppComponent ]
})
export class AppModule { }

54
app/app.routing.ts
Unescape Escape View File

@ -0,0 +1,54 @@
/**
* Created by stefania on 9/16/16.
*/
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { DashboardComponent } from "./dashboard.component";
import { TopicsComponent } from "./pages/faq/topics.components";
import { QuestionsComponent } from "./pages/faq/questions.component";
import { PagesComponent } from "./pages/helpcontent/pages.component";
import { PageHelpContentsComponent } from "./pages/helpcontent/page-help-contents.component";
import { NewPageHelpContentComponent } from "./pages/helpcontent/new-page-help-content.component";
import { EditPageHelpContentComponent } from "./pages/helpcontent/edit-page-help-content.component";
const appRoutes: Routes = [
{
path: '',
redirectTo: 'dashboard',
pathMatch: 'full'
},
{
path: 'dashboard',
component: DashboardComponent,
},
{
path: 'topics',
component: TopicsComponent,
},
{
path: 'questions',
component: QuestionsComponent,
},
{
path: 'pages',
component: PagesComponent,
},
{
path: 'pageContents',
component: PageHelpContentsComponent,
},
{
path: 'pageContents/new',
component: NewPageHelpContentComponent,
},
{
path: 'pageContents/edit/:id',
component: EditPageHelpContentComponent,
}
];
export const appRoutingProviders: any[] = [
];
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

17
app/dashboard.component.html
Unescape Escape View File

@ -0,0 +1,17 @@
<div id="dashboard">
<div id="content">
<div class="menubar fixed">
<div class="sidebar-toggler visible-xs">
<i class="ion-navicon"></i>
</div>
<div class="page-title">Dashboard</div>
</div>
<div class="content-wrapper">
<p>
A list of tools to help the administrator of the OpenMinTeD to manage FAQs, help texts, etc...
</p>
</div>
</div>
</div>

14
app/dashboard.component.ts
Unescape Escape View File

@ -0,0 +1,14 @@
/**
* Created by stefania on 3/21/16.
*/
import { Component } from '@angular/core';
@Component({
selector: 'dashboard',
templateUrl: 'dashboard.component.html',
})
export class DashboardComponent {
}

10
app/domain/active-topic-questions.ts
Unescape Escape View File

@ -0,0 +1,10 @@
/**
* Created by stefania on 4/26/17.
*/
import { Topic } from "./topic";
import { Question } from "./question";
export interface ActiveTopicQuestions {
topic: Topic;
questionList: Question[];
}

24
app/domain/page-help-content.ts
Unescape Escape View File

@ -0,0 +1,24 @@
/**
* Created by stefania on 7/13/17.
*/
import { Page } from "./page";
export interface PageHelpContent {
_id: string;
page: Page | string;
placement : string;
order: number;
content: string;
isActive: boolean;
}
export interface CheckPageHelpContent {
pageHelpContent : PageHelpContent;
checked : boolean;
}
export interface PageHelpContentFilterOptions {
id : string;
active : Boolean;
text : RegExp;
}

13
app/domain/page.ts
Unescape Escape View File

@ -0,0 +1,13 @@
/**
* Created by stefania on 7/13/17.
*/
export interface Page {
_id: string;
route: string;
name: string;
}
export interface CheckPage {
page : Page;
checked : boolean;
}

26
app/domain/question.ts
Unescape Escape View File

@ -0,0 +1,26 @@
/**
* Created by stefania on 4/26/17.
*/
import { Topic } from "./topic";
export interface Question {
_id: string;
question: string;
answer: string;
date : Date;
isActive: boolean;
weight: number;
hitCount: number;
topics: Topic[] | string[];
}
export interface CheckQuestion {
question : Question;
checked : boolean;
}
export interface QuestionFilterOptions {
id : string;
active : Boolean;
text : RegExp;
}

16
app/domain/topic.ts
Unescape Escape View File

@ -0,0 +1,16 @@
/**
* Created by stefania on 4/26/17.
*/
export interface Topic {
_id: string;
name: string;
description: string;
date : Date;
weight: number;
questionOrder: string;
}
export interface CheckTopic {
topic : Topic;
checked : boolean;
}

13
app/main.ts
Unescape Escape View File

@ -0,0 +1,13 @@
/**
* Created by stefania on 10/3/16.
*/
import './polyfills.ts';
//import './vendors.ts';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
import {enableProdMode} from "@angular/core";
const platform = platformBrowserDynamic();
if(process.env.PRODUCTION) {enableProdMode();}
platform.bootstrapModule(AppModule);

21
app/pages/delete-confirmation-dialog.component.html
Unescape Escape View File

@ -0,0 +1,21 @@
<div *ngIf="isModalShown" [config]="{ show: true }" (onHidden)="onHidden()" bsModal #autoShownModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-md">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close pull-right" aria-label="Close" (click)="hideModal()">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title"> Delete Confirmation </h4>
</div>
<div class="modal-body">
<ng-content></ng-content>
</div>
<div class="modal-footer">
<div class="confirmationModalButtons">
<a (click)="hideModal()" class="btn"><i></i> Cancel </a>
<a (click)="confirmedAction()" class="btn btn-danger"><i></i> Yes, delete them </a>
</div>
</div>
</div>
</div>
</div>

55
app/pages/delete-confirmation-dialog.component.ts
Unescape Escape View File

@ -0,0 +1,55 @@
/**
* Created by stefania on 5/2/17.
*/
import { Component, ViewChild, Input, Output, EventEmitter } from '@angular/core';
import { ModalDirective } from 'ngx-bootstrap/modal';
@Component({
selector: 'delete-confirmation-dialog',
templateUrl: './delete-confirmation-dialog.component.html'
})
export class DeleteConfirmationDialogComponent {
@ViewChild('autoShownModal')
public autoShownModal:ModalDirective;
@Input()
public isModalShown:boolean = false;
@Output() emmitObject: EventEmitter<any> = new EventEmitter();
private _ids: string[] = [];
public set ids(ids: string[]) {
this._ids = ids;
}
public showModal():void {
this.isModalShown = true;
}
public hideModal():void {
this.autoShownModal.hide();
}
public onHidden():void {
this.isModalShown = false;
}
public confirmedAction() {
this.emmitObject.emit(this._ids);
this.hideModal();
}
// public saveCustom(obj : any) {
// if (this.type == 'topic') {
// this._faqService.saveTopic(<Topic> obj).subscribe(
// data => this.emmitObject.emit(data),
// error => this.emmitError.emit(error)
// );
// } else if (this.type == 'question') {
// return;
// }
// this.hideModal();
// }
}

35
app/pages/faq/questions-form.component.html
Unescape Escape View File

@ -0,0 +1,35 @@
<form [formGroup]="myForm">
<div class="form-group required" [ngClass]="{'has-error':!myForm.controls.question.valid && myForm.controls.question.dirty}">
<label for="questionTag">Question</label>
<textarea class="form-control" formControlName="question" id="questionTag" placeholder="Question" rows="2"></textarea>
</div>
<div class="form-group required" [ngClass]="{'has-error':!myForm.controls.answer.valid && myForm.controls.answer.dirty}">
<label for="answerTag">Answer</label>
<textarea class="form-control" formControlName="answer" id="answerTag" placeholder="Answer" rows="3"></textarea>
</div>
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.weight.valid && myForm.controls.weight.dirty}">
<label for="topicWeightTag">Weight</label>
<input type="number" step="0.1" class="form-control" formControlName="weight" id="topicWeightTag" placeholder="Topic Weight (e.g. 3.5)">
</div>
<div class="form-group">
<label>Select Status</label>
<label class="checkbox">
<span style="font-weight: normal;">Active</span>
<input tabindex="0" type="checkbox" formControlName="isActive">
</label>
</div>
<div class="form-group required" [ngClass]="{'has-error':!myForm.controls.weight.valid && myForm.controls.weight.dirty}">
<label for="topicTag">Select Topic(s)</label>
<select multiple formControlName="topics" id="topicTag" class="form-control">
<option *ngFor="let topic of availableTopics" [value]="topic._id">{{topic.name}}</option>
</select>
<small class="form-text text-muted">Press <kbd>ctrl</kbd> + <kbd>click</kbd> to select more than one</small>
</div>
<input type="hidden" formControlName="_id">
</form>
<!--<pre>-->
<!--{{myForm.value | json}} |-->
<!--{{myForm.valid}}-->
<!--</pre>-->

51
app/pages/faq/questions-form.component.ts
Unescape Escape View File

@ -0,0 +1,51 @@
/**
* Created by stefania on 5/2/17.
*/
import {Component, OnInit, Input} from '@angular/core';
import {FormGroup, FormBuilder, Validators} from "@angular/forms";
import {Topic} from "../../domain/topic";
@Component({
selector: 'questions-form',
templateUrl: './questions-form.component.html',
})
export class QuestionsFormComponent implements OnInit{
@Input('group')
myForm: FormGroup;
@Input() availableTopics : Topic[] = [];
constructor(private _fb: FormBuilder){}
ngOnInit(): void {
}
public get form() {
return this._fb.group({
question : ['', Validators.required],
answer : ['', Validators.required],
topics : [[],Validators.required],
weight : ['0.0', Validators.required],
isActive : true,
_id : '',
// date : ''
});
}
public reset() {
this.myForm.patchValue({
question : '',
answer : '',
topics : [],
weight : '0.0',
// date : '',
isActive : true,
_id : ''
});
this.myForm.markAsPristine();
}
}

154
app/pages/faq/questions.component.html
Unescape Escape View File

@ -0,0 +1,154 @@
<div id="faqQuestions">
<div id="content">
<div class="menubar fixed">
<div class="sidebar-toggler visible-xs">
<i class="ion-navicon"></i>
</div>
<div class="page-title">FAQ Questions</div>
<form class="search">
<!--<input class="gwt-TextBox" placeholder="Search questions (question, answer)..." type="text">-->
<input #inputstring (keyup.enter)="filterBySearch(inputstring.value)" placeholder="Search questions (question, answer)..." type="text"/>
<input class="btn" type="submit">
</form>
<a (click)="showModal()" class="btn btn-success pull-right"><i></i> New Question </a>
</div>
<div class="content-wrapper" id="contentWrapper">
<div>
<div class="contentPanel">
<div [hidden]="!errorMessage" class="alert alert-danger" aria-hidden="true">
{{errorMessage}}
</div>
<div [hidden]="!successMessage" class="alert alert-success" aria-hidden="true">
{{successMessage}}
</div>
<div class="alert" style="display: none;" aria-hidden="true"><span></span><span></span><span></span></div>
<div class="row page-controls">
<div class="col-md-12 filters marginBottom20">
<div class="links form-group form-inline">
<div class="gwt-Label filterLabel">Filter by topic:</div>
<select class="input-xxlarge form-control" (change)="filterByTopic($event)">
<option value="">-- none selected --</option>
<option *ngFor="let topic of topics" value="{{topic._id}}">{{topic.name}}</option>
</select>
</div>
</div>
<div class="col-md-12 filters">
<div class="links">
<div class="gwt-Label filterLabel">Filter questions:</div>
<a [ngClass]="{'active' : filters.active==null}" (click)="displayAllQuestions()">
All Questions ({{counter.all}})
</a>
<a [ngClass]="{'active' : filters.active==true}" (click)="displayActiveQuestions()">
Active ({{counter.active}})
</a>
<a [ngClass]="{'active' : filters.active==false}" (click)="displayInactiveQuestions()">
Inactive ({{counter.inactive}})
</a>
</div>
<div class="show-options">
<div class="btn-group"><a href="javascript:;" class="btn dropdown-toggle"
data-toggle="dropdown"><i></i> Bulk Actions <span
class="caret"></span></a>
<ul class="dropdown-menu">
<li><a (click)="toggleQuestion(true,getSelectedQuestions())"><i></i> Activate </a></li>
<li><a (click)="toggleQuestion(false,getSelectedQuestions())"><i></i> Deactivate </a></li>
<li><a (click)="confirmDeleteSelectedQuestions()"><i></i> Delete </a></li>
</ul>
</div>
</div>
</div>
</div>
<div>
<div class="gwt-HTML">
<div class="row users-list">
<div class="col-md-12">
<div class="row headers">
<div class="col-sm-1 header select-users"><input id="allQuestionsCheckbox" [checked]="checkboxAll" type="checkbox" (change)="toggleCheckBoxes($event)">
</div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Date</a></label></div>
<div class="col-sm-2 header hidden-xs"><label><a href="#">Question</a></label></div>
<div class="col-sm-3 header hidden-xs"><label><a href="#">Answer</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Topics</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Weight</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Hit Count</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Active</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Actions</a></label></div>
</div>
<template [ngIf]="questionsCheckboxes && questionsCheckboxes.length>0">
<div *ngFor="let check of questionsCheckboxes; let i=index" class="row user">
<div class="col-sm-1 avatar"><input id="{{check.question._id}}" class="checkBox" type="checkbox"
name="questionscb[]" value="{{check.question._id}}" [(ngModel)]="check.checked">
</div>
<div class="col-sm-1">
<div class="date" href="#">{{check.question.date | date:'yyyy-MM-dd'}}</div>
</div>
<div class="col-sm-2">
<div class="name" href="#">{{check.question.question}}</div>
</div>
<div class="col-sm-3">
<div class="description" href="#">{{check.question.answer}}
</div>
</div>
<div class="col-sm-1">
{{getNames(check.question).join(', ')}}
<!--<div class="topics" href="#">{{check.question.topics}}</div>-->
<!--<span *ngFor="let topic of check.question.topics" class="label label-primary">{{topic.name}}</span>-->
</div>
<div class="col-sm-1">
<div class="weight" href="#">{{check.question.weight}}</div>
</div>
<div class="col-sm-1">
<div class="hitCount" href="#">{{check.question.hitCount}}</div>
</div>
<div class="col-sm-1">
<div *ngIf="check.question.isActive" class="activated" >
<input (click)="toggleQuestion(false,[check.question._id])" class="deactivate" src="imgs/check-icon.png" title="Deactivate" width="20" type="image" height="20">
</div>
<div *ngIf="!check.question.isActive" class="activated" >
<input (click)="toggleQuestion(true,[check.question._id])" class="deactivate" src="imgs/x-icon.png" title="Activate" width="20" type="image" height="20">
</div>
</div>
<!--<div class="col-sm-1">-->
<!--<bSwitch [switch-on-text]="'A'" [switch-off-text]="'I'"-->
<!--[switch-label-text]="''" [(ngModel)]="check.question.isActive"-->
<!--[switch-on-color]="'mySuccess'" [switch-off-color]="'default'"-->
<!--[switch-size]="'small'" [switch-handle-width]="22"-->
<!--(onChangeState)="toggleQuestion($event.currentValue,[check.question._id])"></bSwitch>-->
<!--</div>-->
<div class="col-sm-1">
<div class="actions" href="#">
<input title="Edit" src="imgs/icn_edit.png" class="edit" type="image" (click)="editQuestion(i)">
<input title="Delete" src="imgs/icn_trash.png" class="delete" type="image" (click)="confirmDeleteQuestion(check.question._id)">
</div>
</div>
</div>
</template>
<div *ngIf="questionsCheckboxes.length==0" class="col-md-12">
<div class="alert alert-warning">No questions found</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<modal-form #saveModal [saveText]="'Save'" [titleText]="'Add a new Question'" [formGroup]="formGroup" [type]="'question'"
[isModalShown]="isModalShown" (emmitObject)="questionSavedSuccessfully($event)" (emmitError)="handleError($event)">
<questions-form [group]="formGroup" [availableTopics]="topics"></questions-form>
</modal-form>
<modal-form #updateModal [saveText]="'Update'" [titleText]="'Update Question'" [formGroup]="formGroup" [type]="'question'"
[isModalShown]="isModalShown" (emmitObject)="questionUpdatedSuccessfully($event)" (emmitError)="handleError($event)">
<questions-form [group]="formGroup" [availableTopics]="topics"></questions-form>
</modal-form>
<delete-confirmation-dialog #deleteConfirmationModal [isModalShown]="isModalShown" (emmitObject)="confirmedDeleteQuestions($event)">
Are you sure you want to delete the selected question(s)?
</delete-confirmation-dialog>

243
app/pages/faq/questions.component.ts
Unescape Escape View File

@ -0,0 +1,243 @@
/**
* Created by stefania on 4/26/17.
*/
import { Component, ViewChild, OnInit } from '@angular/core';
import { FAQService } from "../../services/faq.service";
import { FormGroup } from "@angular/forms";
import { ModalFormComponent } from "../modal-form.component";
import { QuestionsFormComponent } from "./questions-form.component";
import { CheckQuestion, Question, QuestionFilterOptions } from "../../domain/question";
import { Topic } from "../../domain/topic";
import { DeleteConfirmationDialogComponent } from "../delete-confirmation-dialog.component";
@Component({
selector: 'questions',
templateUrl: './questions.component.html',
})
export class QuestionsComponent implements OnInit {
// @ViewChild(ModalFormComponent)
@ViewChild('saveModal')
public modal:ModalFormComponent;
@ViewChild('updateModal')
public updateModal:ModalFormComponent;
@ViewChild(QuestionsFormComponent)
public formComponent : QuestionsFormComponent;
@ViewChild('deleteConfirmationModal')
public deleteConfirmationModal : DeleteConfirmationDialogComponent;
public questionsCheckboxes : CheckQuestion[] = [];
public questions : Question[] = [];
public errorMessage: string = null;
public successMessage: string = null;
public formGroup : FormGroup;
public topics: Topic[];
public checkboxAll : boolean = false;
public filters : QuestionFilterOptions = {id : '', active : null, text : new RegExp('')};
public counter = {all : 0, active : 0, inactive : 0};
ngOnInit() {
this.getTopics();
this.getQuestions();
this.formGroup = this.formComponent.form;
}
constructor(private _faqService: FAQService) {}
getTopics() {
this._faqService.getTopics().subscribe(
topics => this.topics = topics,
error => this.errorMessage = <any>error);
}
public countQuestions() {
this.counter = {all : 0, active : 0, inactive : 0};
let filter = Object.assign({},this.filters);
filter.active = null;
this.questions.forEach(_ => {
if(this.filterQuestion(_,filter)){
if (_.isActive==true) this.counter.active++;
else this.counter.inactive++
}
});
this.counter.all = this.counter.active + this.counter.inactive;
}
getQuestions() {
let self = this;
this._faqService.getQuestions().subscribe(
questions => {
self.questions = questions;
self.counter.all = questions.length;
questions.forEach(_ => {
self.questionsCheckboxes.push(<CheckQuestion>{question : _, checked : false});
});
self.countQuestions();
},
error => this.errorMessage = <any>error);
}
public showModal():void {
this.modal.showModal();
}
public toggleCheckBoxes(event) {
this.questionsCheckboxes.forEach(_ => _.checked = event.target.checked);
this.checkboxAll = event.target.checked;
}
public applyCheck(flag : boolean) {
this.questionsCheckboxes.forEach(_ => _.checked = flag);
this.checkboxAll = false;
}
public getSelectedQuestions() : string[] {
return this.questionsCheckboxes.filter(question => question.checked == true)
.map(checkedQuestion => checkedQuestion.question).map(res => res._id);
}
public confirmDeleteQuestion(id : string) {
this.deleteConfirmationModal.ids = [id];
this.deleteConfirmationModal.showModal();
}
public confirmDeleteSelectedQuestions() {
this.deleteConfirmationModal.ids = this.getSelectedQuestions();
this.deleteConfirmationModal.showModal();
}
public confirmedDeleteQuestions(ids : string[]) {
this._faqService.deleteQuestions(ids).subscribe(
_ => this.deleteQuestionsFromArray(ids),
error => this.handleError(error)
);
}
private deleteQuestionsFromArray(ids : string[]) : void {
this.successMessage = `Successfully deleted Question(s)`;
for(let id of ids) {
let iqc = this.questionsCheckboxes.findIndex(_ => _.question._id == id);
let iq = this.questions.findIndex(_ => _._id == id);
this.questionsCheckboxes.splice(iqc, 1);
this.questions.splice(iqc, 1);
}
}
public editQuestion(i : number) {
let question : Question = Object.assign({}, this.questionsCheckboxes[i].question);
// question.topics = <Topic[]>Object.create(this.questionsCheckboxes[i].question.topics);
let topics : string[] = [];
for(let topic of <Topic[]>question.topics) {
topics.push(topic._id)
}
question.topics = topics;
console.log(question);
this.formGroup.patchValue(question);
this.updateModal.showModal();
}
public toggleQuestion(status : boolean, ids : string[]) {
this._faqService.toggleQuestion(ids,status).subscribe(
ret => {
for(let id of ret) {
let i = this.questionsCheckboxes.findIndex(_ => _.question._id == id);
this.questionsCheckboxes[i].question.isActive=status;
}
this.countQuestions();
this.applyCheck(false);
},
error => this.handleError(<any>error)
);
}
public saveQuestion(data : any):void {
console.log(data);
this._faqService.saveQuestion(data).subscribe(
question => this.questionSavedSuccessfully(question),
error => this.handleError(<any>error)
);
}
public questionSavedSuccessfully(question: Question) {
this.questionsCheckboxes.push(<CheckQuestion>{question : question, checked : false});
this.questions.push(question);
this.successMessage = `Question [${question.question}] saved successfully`;
this.applyCheck(false);
this.countQuestions();
}
public questionUpdatedSuccessfully(question : Question) {
this.questionsCheckboxes.find(checkItem => checkItem.question._id==question._id).question = question;
let index = this.questions.findIndex(checkItem => checkItem._id==question._id);
this.successMessage = `Question [${question.question}] updated successfully`;
this.questions[index] = question;
this.applyCheck(false);
this.countQuestions();
}
public filterQuestion(question : Question, filters : QuestionFilterOptions) : boolean {
let idFlag = filters.id == '' || (<Topic[]>question.topics).map(_ => _._id).includes(filters.id);
let activeFlag = filters.active == null || question.isActive == filters.active;
let textFlag = filters.text.toString() == '' || (question.question + ' ' +question.answer).match(filters.text) != null;
return idFlag && activeFlag && textFlag;
}
public applyFilter() {
this.questionsCheckboxes = [];
this.questions.filter(item => this.filterQuestion(item,this.filters)).forEach(
_ => this.questionsCheckboxes.push(<CheckQuestion>{question: _, checked: false})
);
this.countQuestions();
}
public filterByTopic(event: any) {
this.filters.id = event.target.value;
this.applyFilter();
}
public displayAllQuestions() {
this.filters.active = null;
this.applyFilter();
}
public displayActiveQuestions() {
this.filters.active = true;
this.applyFilter();
}
public filterBySearch(text : string) {
this.filters.text = new RegExp(text, "i");
this.applyFilter();
}
public displayInactiveQuestions() {
this.filters.active = false;
this.applyFilter();
}
public getNames(question : Question) : string[]{
return (<Topic[]>question.topics).map(_ => _.name);
}
handleError(error) {
if(error == null) {
this.formComponent.reset();
}else {
this.errorMessage = 'System error saving topic (Server responded: ' + error + ')';
}
}
}

26
app/pages/faq/topics-form.component.html
Unescape Escape View File

@ -0,0 +1,26 @@
<form [formGroup]="myForm">
<div class="form-group required" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.name.dirty}">
<label for="topicNameTag">Topic Name</label>
<input type="text" class="form-control" formControlName="name" id="topicNameTag" placeholder="Topic Name">
</div>
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.description.valid && myForm.controls.description.dirty}">
<label for="topicDescTag">Topic Description</label>
<textarea class="form-control" formControlName="description" id="topicDescTag" placeholder="Topic Description" rows="3"></textarea>
</div>
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.weight.valid && myForm.controls.weight.dirty}">
<label for="topicWeightTag">Weight</label>
<input type="number" step="0.1" class="form-control" formControlName="weight" id="topicWeightTag" placeholder="Topic Weight (e.g. 3.5)">
</div>
<div class="form-group">
<label for="topicQuestionOrder">Order questions by</label>
<select class="form-control" id="topicQuestionOrder" formControlName="questionOrder">
<option value="hits">Hit Count</option>
<option value="weight">Weight</option>
</select>
</div>
<input type="hidden" formControlName="_id">
<!--<input type="hidden" formControlName="date">-->
</form>
<!--<pre>-->
<!--{{myForm.value | json}}-->
<!--</pre>-->

46
app/pages/faq/topics-form.component.ts
Unescape Escape View File

@ -0,0 +1,46 @@
/**
* Created by stefanos on 28/4/2017.
*/
import {Component, OnInit, Input} from '@angular/core';
import {FormGroup, FormBuilder, Validators} from "@angular/forms";
@Component({
selector: 'topics-form',
templateUrl: './topics-form.component.html',
})
export class TopicsFormComponent implements OnInit{
@Input('group')
myForm: FormGroup;
constructor(private _fb: FormBuilder){}
ngOnInit(): void {
}
public get form() {
return this._fb.group({
name : ['', Validators.required],
description : '',
weight : ['0.0', Validators.required],
questionOrder : 'hits',
_id : ''
// date : '',
});
}
public reset() {
this.myForm.patchValue({
name : '',
description : '',
weight : '0.0',
questionOrder : 'hits',
_id : ''
});
this.myForm.markAsPristine();
}
}

111
app/pages/faq/topics.component.html
Unescape Escape View File

@ -0,0 +1,111 @@
<div id="faqTopics">
<div id="content">
<div class="menubar fixed">
<div class="sidebar-toggler visible-xs">
<i class="ion-navicon"></i>
</div>
<div class="page-title">FAQ Topics</div>
<form target="BSFormPanel_Admin_1" class="search">
<!--<input class="gwt-TextBox" placeholder="Search topics (name, description)..." type="text">-->
<input #inputstring (keyup.enter)="filterBySearch(inputstring.value)" placeholder="Search topics (name, description)..." type="text"/>
<input class="btn" type="submit">
</form>
<a (click)="showModal()" class="btn btn-success pull-right"><i></i> New Topic </a>
</div>
<div class="content-wrapper" id="contentWrapper">
<div>
<div class="contentPanel">
<div [hidden]="!errorMessage" class="alert alert-danger" aria-hidden="true">
{{errorMessage}}
</div>
<div [hidden]="!successMessage" class="alert alert-success" aria-hidden="true">
{{successMessage}}
</div>
<div class="alert" style="display: none;" aria-hidden="true"><span></span><span></span><span></span></div>
<div class="row page-controls">
<div class="col-md-12 filters">
<div class="show-options">
<div class="btn-group"><a href="javascript:;" class="btn dropdown-toggle"
data-toggle="dropdown"><i></i> Bulk Actions <span
class="caret"></span></a>
<ul class="dropdown-menu">
<li><a (click)="confirmDeleteSelectedTopics()"><i></i> Delete </a></li>
<li><a (click)="toggleTopic('weight',getSelectedTopics())"><i></i> Order Questions By Weight </a></li>
<li><a (click)="toggleTopic('hits',getSelectedTopics())"><i></i> Order Questions By Hit Count </a></li>
</ul>
</div>
</div>
</div>
</div>
<div>
<div class="gwt-HTML">
<div class="row users-list">
<div class="col-md-12">
<div class="row headers">
<div class="col-sm-1 header select-users"><input id="allTopicsCheckbox" type="checkbox" (change)="toggleCheckBoxes($event)">
</div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Date</a></label></div>
<div class="col-sm-2 header hidden-xs"><label><a href="#">Name</a></label></div>
<div class="col-sm-4 header hidden-xs"><label><a href="#">Description</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Weight</a></label></div>
<div class="col-sm-2 header hidden-xs"><label><a href="#">Questions Order</a></label>
</div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Actions</a></label></div>
</div>
<template [ngIf]="topicsCheckboxes && topicsCheckboxes.length>0">
<div *ngFor="let check of topicsCheckboxes; let i=index" class="row user">
<div class="col-sm-1 avatar"><input id="{{check.topic._id}}" class="checkBox" type="checkbox"
name="topicscb[]" value="{{check.topic._id}}" [(ngModel)]="check.checked">
</div>
<div class="col-sm-1">
<div class="date" href="#">{{check.topic.date | date:'yyyy-MM-dd'}}</div>
</div>
<div class="col-sm-2">
<div class="name" href="#">{{check.topic.name}}</div>
</div>
<div class="col-sm-4">
<div class="description" href="#">{{check.topic.description}}
</div>
</div>
<div class="col-sm-1">
<div class="weight" href="#">{{check.topic.weight}}</div>
</div>
<div class="col-sm-2">
<div class="questionsOrder" href="#">{{check.topic.questionOrder}}</div>
</div>
<div class="col-sm-1">
<div class="actions" href="#">
<input title="Edit" src="imgs/icn_edit.png" class="edit" type="image" (click)="editTopic(i)">
<input title="Delete" src="imgs/icn_trash.png" class="delete" type="image" (click)="confirmDeleteTopic(check.topic._id)">
</div>
</div>
</div>
</template>
<div *ngIf="topicsCheckboxes.length==0" class="col-md-12">
<div class="alert alert-warning">No topics found</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<modal-form #saveModal [saveText]="'Save'" [titleText]="'Add a new Topic'" [formGroup]="formGroup"
[isModalShown]="isModalShown" (emmitObject)="topicSavedSuccessfully($event)" (emmitError)="handleError($event)">
<topics-form [group]="formGroup"></topics-form>
</modal-form>
<modal-form #updateModal [saveText]="'Update'" [titleText]="'Update Topic'" [formGroup]="formGroup"
[isModalShown]="isModalShown" (emmitObject)="topicUpdatedSuccessfully($event)" (emmitError)="handleError($event)">
<topics-form [group]="formGroup"></topics-form>
</modal-form>
<delete-confirmation-dialog #deleteConfirmationModal [isModalShown]="isModalShown" (emmitObject)="confirmedDeleteTopic($event)">
Are you sure you want to delete the selected topic(s)?
</delete-confirmation-dialog>

169
app/pages/faq/topics.components.ts
Unescape Escape View File

@ -0,0 +1,169 @@
/**
* Created by stefania on 4/26/17.
*/
import { Component, ViewChild, OnInit } from '@angular/core';
import { Topic, CheckTopic } from "../../domain/topic";
import { FAQService } from "../../services/faq.service";
import { FormGroup } from "@angular/forms";
import { ModalFormComponent } from "../modal-form.component";
import { TopicsFormComponent } from "./topics-form.component";
import { DeleteConfirmationDialogComponent } from "../delete-confirmation-dialog.component";
@Component({
selector: 'topics',
templateUrl: './topics.component.html',
})
export class TopicsComponent implements OnInit {
// @ViewChild(ModalFormComponent)
@ViewChild('saveModal')
public modal:ModalFormComponent;
@ViewChild('updateModal')
public updateModal:ModalFormComponent;
@ViewChild('deleteConfirmationModal')
public deleteConfirmationModal : DeleteConfirmationDialogComponent;
@ViewChild(TopicsFormComponent)
public formComponent : TopicsFormComponent;
public topicsCheckboxes : CheckTopic[] = [];
public topics : Topic[] = [];
public errorMessage: string = null;
public successMessage: string = null;
public formGroup : FormGroup;
private searchText : RegExp = new RegExp('');
ngOnInit() {
this.getTopics();
this.formGroup = this.formComponent.form;
}
constructor(private _faqService: FAQService) {}
getTopics() {
let self = this;
this._faqService.getTopics().subscribe(
topics => {
self.topics = topics;
topics.forEach(_ => {
self.topicsCheckboxes.push(<CheckTopic>{topic : _, checked : false});
});
},
error => this.handleError('System error retrieving topics topics', error));
}
public showModal():void {
this.modal.showModal();
}
public toggleCheckBoxes(event) {
this.topicsCheckboxes.forEach(_ => _.checked = event.target.checked);
}
public applyCheck(flag : boolean) {
this.topicsCheckboxes.forEach(_ => _.checked = flag);
}
public getSelectedTopics() : string[] {
return this.topicsCheckboxes.filter(topic => topic.checked == true).map(checkedTopic => checkedTopic.topic).map(res => res._id);
}
private deleteTopicsFromArray(ids : string[]) : void {
this.successMessage = `Successfully deleted Topic(s)`;
for(let id of ids) {
let i = this.topicsCheckboxes.findIndex(_ => _.topic._id == id);
this.topicsCheckboxes.splice(i, 1);
}
}
public confirmDeleteTopic(id : string) {
this.deleteConfirmationModal.ids = [id];
this.deleteConfirmationModal.showModal();
}
public confirmDeleteSelectedTopics() {
this.deleteConfirmationModal.ids = this.getSelectedTopics();
this.deleteConfirmationModal.showModal();
}
public confirmedDeleteTopic(ids : string[]) {
this._faqService.deleteTopics(ids).subscribe(
_ => this.deleteTopicsFromArray(ids),
error => this.handleError('System error deleting the selected topics', error)
);
}
public sort(type : string) {
if(type=='weight') {
this.topicsCheckboxes.sort(function(a, b) {
return a.topic.weight - b.topic.weight;
});
} else if (type == 'hits') {
}
}
public editTopic(i : number) {
let topic : Topic = this.topicsCheckboxes[i].topic;
this.formGroup.patchValue(topic);
this.updateModal.showModal();
}
public toggleTopic(order : string, ids : string[]) {
this._faqService.orderTopic(ids,order).subscribe(
ret => {
for(let id of ret) {
let i = this.topicsCheckboxes.findIndex(_ => _.topic._id == id);
this.topicsCheckboxes[i].topic.questionOrder=order;
}
},
error => this.handleError('System error ordering topics', <any>error)
);
this.applyCheck(false);
}
public topicSavedSuccessfully(topic: Topic) {
this.topicsCheckboxes.push(<CheckTopic>{topic : topic, checked : false});
this.successMessage = `Topic [${topic.name}] saved successfully`;
this.applyCheck(false);
}
public topicUpdatedSuccessfully(topic : Topic) {
this.topicsCheckboxes.find(checkItem => checkItem.topic._id==topic._id).topic = topic;
this.successMessage = `Topic [${topic.name}] updated successfully`;
this.applyCheck(false);
}
public filterBySearch(text : string) {
this.searchText = new RegExp(text,'i');
this.applyFilter();
}
public applyFilter() {
this.topicsCheckboxes = [];
this.topics.filter(item => this.filterQuestion(item)).forEach(
_ => this.topicsCheckboxes.push(<CheckTopic>{topic: _, checked: false})
);
}
public filterQuestion(topic : Topic) : boolean {
let textFlag = this.searchText.toString() == '' || (topic.name + ' ' +topic.description).match(this.searchText) != null;
return textFlag;
}
handleError(message: string, error) {
if(error == null) {
this.formComponent.reset();
} else {
this.errorMessage = message + ' (Server responded: ' + error + ')';
}
}
}

20
app/pages/helpcontent/edit-page-help-content.component.html
Unescape Escape View File

@ -0,0 +1,20 @@
<div id="editPageHelpContent">
<div id="content">
<div class="menubar fixed">
<div class="sidebar-toggler visible-xs">
<i class="ion-navicon"></i>
</div>
<div class="page-title">Edit Help Content</div>
</div>
<div class="content-wrapper">
<div>
<div *ngIf="errorMessage" class="alert alert-danger">{{errorMessage}}</div>
<page-content-form [group]="formGroup"></page-content-form>
<a (click)="saveCustom()" class="btn btn-success"><i></i>Update page content</a>
</div>
</div>
</div>
</div>

68
app/pages/helpcontent/edit-page-help-content.component.ts
Unescape Escape View File

@ -0,0 +1,68 @@
/**
* Created by stefania on 7/14/17.
*/
import { Component, ViewChild, OnInit, OnDestroy } from '@angular/core';
import { PageContentFormComponent } from "./page-help-content-form.component";
import { Subscription } from "rxjs/Subscription";
import { HelpContentService } from "../../services/help-content.service";
import { PageHelpContent } from "../../domain/page-help-content";
import { ActivatedRoute, Router } from "@angular/router";
@Component({
selector: 'edit-page-help-content',
templateUrl: 'edit-page-help-content.component.html',
})
export class EditPageHelpContentComponent implements OnInit, OnDestroy{
@ViewChild(PageContentFormComponent)
public formComponent : PageContentFormComponent;
private sub: Subscription;
private pageHelpContent: PageHelpContent;
private errorMessage : string = null;
constructor(
private route: ActivatedRoute,
private router: Router,
private _helpContentService: HelpContentService) {}
ngOnInit() {
this.sub = this.route.params.subscribe(params => {
let id = params['id'];
this._helpContentService.getPageHelpContent(id as string).subscribe(
pageHelpContent => this.updateForm(pageHelpContent),
error => this.handleError('System error retrieving page help content', error));
});
}
ngOnDestroy() {
this.sub.unsubscribe();
}
handleError(message: string, error) {
this.errorMessage = message + ' (Server responded: ' + error + ')';
}
private updateForm(pageHelpContent : PageHelpContent) {
this.pageHelpContent = pageHelpContent;
this.formComponent.myForm.patchValue((pageHelpContent));
// console.log("patching",pageHelpContent);
}
private saveCustom() {
if(this.formComponent.myForm.valid) {
let pageHelpContent : PageHelpContent = this.formComponent.myForm.value;
this._helpContentService.savePageHelpContent(pageHelpContent).subscribe(
_ => this.router.navigate(['/pageContents']),
err => this.handleError('System error updating page content', err)
);
} else {
this.errorMessage = "Please fill all required fields";
}
}
}

20
app/pages/helpcontent/new-page-help-content.component.html
Unescape Escape View File

@ -0,0 +1,20 @@
<div id="newPageHelpContent">
<div id="content">
<div class="menubar fixed">
<div class="sidebar-toggler visible-xs">
<i class="ion-navicon"></i>
</div>
<div class="page-title">New Help Content</div>
</div>
<div class="content-wrapper">
<div>
<div *ngIf="errorMessage" class="alert alert-danger">{{errorMessage}}</div>
<page-content-form [group]="formGroup"></page-content-form>
<a (click)="saveCustom()" class="btn btn-success"><i></i>Save page content</a>
</div>
</div>
</div>
</div>

46
app/pages/helpcontent/new-page-help-content.component.ts
Unescape Escape View File

@ -0,0 +1,46 @@
/**
* Created by stefania on 7/13/17.
*/
import { Component, ViewChild } from '@angular/core';
import { ActivatedRoute, Router } from "@angular/router";
import { PageContentFormComponent } from "./page-help-content-form.component";
import { PageHelpContent } from "../../domain/page-help-content";
import { HelpContentService } from "../../services/help-content.service";
@Component({
selector: 'new-page-help-content',
templateUrl: 'new-page-help-content.component.html',
})
export class NewPageHelpContentComponent {
@ViewChild(PageContentFormComponent)
public formComponent : PageContentFormComponent;
private errorMessage : string = null;
constructor(
private route: ActivatedRoute,
private router: Router,
private _helpContentService: HelpContentService) {}
private saveCustom() {
this.errorMessage = null;
if(this.formComponent.myForm.valid) {
let pageHelpContent : PageHelpContent = this.formComponent.myForm.value;
this._helpContentService.savePageHelpContent(pageHelpContent).subscribe(
_ => this.router.navigate(['/pageContents']),
err => this.handleError('System error saving page content', err)
);
} else {
this.errorMessage = "Please fill all required fields";
}
}
handleError(message: string, error) {
this.errorMessage = message + ' (Server responded: ' + error + ')';
}
}

14
app/pages/helpcontent/page-form.component.html
Unescape Escape View File

@ -0,0 +1,14 @@
<form [formGroup]="myForm">
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.route.dirty}">
<label for="pageRouteTag">Page Route</label>
<input type="text" class="form-control" formControlName="route" id="pageRouteTag" placeholder="Page Route">
</div>
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.name.dirty}">
<label for="pageNameTag">Page Name</label>
<input type="text" class="form-control" formControlName="name" id="pageNameTag" placeholder="Page Name">
</div>
<input type="hidden" formControlName="_id">
</form>
<!--<pre>-->
<!--{{myForm.value | json}}-->
<!--</pre>-->

39
app/pages/helpcontent/page-form.component.ts
Unescape Escape View File

@ -0,0 +1,39 @@
/**
* Created by stefania on 7/13/17.
*/
import {Component, OnInit, Input} from '@angular/core';
import {FormGroup, FormBuilder, Validators} from "@angular/forms";
@Component({
selector: 'page-form',
templateUrl: './page-form.component.html',
})
export class PageFormComponent implements OnInit{
@Input('group')
myForm: FormGroup;
constructor(private _fb: FormBuilder){}
ngOnInit(): void {
}
public get form() {
return this._fb.group({
route : ['', Validators.required],
name : ['', Validators.required],
_id : ''
});
}
public reset() {
this.myForm.patchValue({
route : '',
name : '',
_id : ''
});
}
}

54
app/pages/helpcontent/page-help-content-form.component.html
Unescape Escape View File

@ -0,0 +1,54 @@
<div *ngIf="errorMessage" class="alert alert-danger">{{errorMessage}}</div>
<form [formGroup]="myForm">
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.page.valid && myForm.controls.page.dirty}">
<label for="pageTag">Select Page</label>
<select formControlName="page" id="pageTag" class="form-control">
<option *ngFor="let page of availablePages" [value]="page._id">{{page.name}}</option>
</select>
</div>
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.placement.valid && myForm.controls.placement.dirty}">
<label for="placementTag">Select Placement</label>
<select formControlName="placement" id="placementTag" class="form-control">
<option [value]="'top'">Top</option>
<option [value]="'left'">Left</option>
<option [value]="'right'">Right</option>
<option [value]="'bottom'">Bottom</option>
</select>
</div>
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.content.valid && myForm.controls.content.dirty}">
<label>Content</label>
<div>
<ckeditor
[readonly]="false"
debounce="500"
formControlName="content"
[config]="{allowedContent: true,extraAllowedContent : '*(*)'}">
<!--id="contentTag"-->
<!--(ready)="onReady($event)"-->
<!--(focus)="onFocus($event)"-->
<!--[config]="{uiColor: '#99000'}"-->
<!--(blur)="onBlur($event)"-->
<!--(change)="onChange($event)"-->
</ckeditor>
</div>
<!--<textarea class="form-control" formControlName="content" id="contentTag" placeholder="Content" rows="3"></textarea>-->
</div>
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.order.valid && myForm.controls.order.dirty}">
<label for="orderTag">Order</label>
<input type="number" step="1" class="form-control" formControlName="order" id="orderTag" placeholder="Order (e.g. 2)">
</div>
<div class="form-group">
<label>Select Status</label>
<label class="checkbox">
<span style="font-weight: normal;">Active</span>
<input tabindex="0" type="checkbox" formControlName="isActive">
</label>
</div>
<input type="hidden" formControlName="_id">
</form>
<!--<pre>-->
<!--{{myForm.value | json}}-->
<!--{{myForm.valid}}-->
<!--</pre>-->

60
app/pages/helpcontent/page-help-content-form.component.ts
Unescape Escape View File

@ -0,0 +1,60 @@
/**
* Created by stefania on 7/14/17.
*/
import { Component, OnInit, Input } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from "@angular/forms";
import { Page } from "../../domain/page";
import { HelpContentService } from "../../services/help-content.service";
@Component({
selector: 'page-content-form',
templateUrl: './page-help-content-form.component.html',
})
export class PageContentFormComponent implements OnInit{
@Input('group')
myForm: FormGroup;
private availablePages : Page[] = [];
private errorMessage: string;
private ckeditorContent : string;
constructor(private _fb: FormBuilder, private _helpContentService: HelpContentService){}
ngOnInit() {
this.myForm = this.form;
this._helpContentService.getPages().subscribe(
pages => this.availablePages = pages,
error => this.handleError('System error retrieving pages', error));
}
public get form() {
return this._fb.group({
page : ['',Validators.required],
placement : ['', Validators.required],
content : ['', Validators.required],
order : ['1', Validators.required],
isActive : true,
_id : '',
});
}
public reset() {
this.myForm.patchValue({
page : '',
placement : '',
content : [''],
order : '1',
isActive : true,
_id : ''
});
this.myForm.markAsPristine();
}
handleError(message: string, error) {
this.errorMessage = message + ' (Server responded: ' + error + ')';
}
}

127
app/pages/helpcontent/page-help-contents.component.html
Unescape Escape View File

@ -0,0 +1,127 @@
<div id="pageContents">
<div id="content">
<div class="menubar fixed">
<div class="sidebar-toggler visible-xs">
<i class="ion-navicon"></i>
</div>
<div class="page-title">Page Help Contents</div>
<form class="search">
<!--<input class="gwt-TextBox" placeholder="Search questions (question, answer)..." type="text">-->
<input #inputstring (keyup.enter)="filterBySearch(inputstring.value)" placeholder="Search page content (content)..." type="text"/>
<input class="btn" type="submit">
</form>
<a routerLink="/pageContents/new" class="btn btn-success pull-right"><i></i> New Page Content </a>
</div>
<div class="content-wrapper" id="contentWrapper">
<div>
<div class="contentPanel">
<div class="alert alert-danger" style="display: none;" aria-hidden="true">
<span></span><span></span><span></span></div>
<div class="alert alert-success" style="display: none;" aria-hidden="true">
<span></span><span></span><span></span></div>
<div class="alert" style="display: none;" aria-hidden="true"><span></span><span></span><span></span></div>
<div class="row page-controls">
<div class="col-md-12 filters marginBottom20">
<div class="links form-group form-inline">
<div class="gwt-Label filterLabel">Filter by page:</div>
<select class="input-xxlarge form-control" (change)="filterByPage($event)">
<option value="">-- none selected --</option>
<option *ngFor="let page of pages" value="{{page._id}}">{{page.name}}</option>
</select>
</div>
</div>
<div class="col-md-12 filters">
<div class="links">
<div class="gwt-Label filterLabel">Filter page contents:</div>
<a [ngClass]="{'active' : filters.active==null}" (click)="displayAllPageHelpContents()">
All Page Contents ({{counter.all}})
</a>
<a [ngClass]="{'active' : filters.active==true}" (click)="displayActivePageHelpContents()">
Active ({{counter.active}})
</a>
<a [ngClass]="{'active' : filters.active==false}" (click)="displayInactivePageHelpContents()">
Inactive ({{counter.inactive}})
</a>
</div>
<div class="show-options">
<div class="btn-group"><a href="javascript:;" class="btn dropdown-toggle"
data-toggle="dropdown"><i></i> Bulk Actions <span
class="caret"></span></a>
<ul class="dropdown-menu">
<li><a (click)="togglePageHelpContents(true,getSelectedPageHelpContents())"><i></i> Activate </a></li>
<li><a (click)="togglePageHelpContents(false,getSelectedPageHelpContents())"><i></i> Deactivate </a></li>
<li><a (click)="confirmDeleteSelectedPageHelpContents()"><i></i> Delete </a></li>
</ul>
</div>
</div>
</div>
</div>
<div>
<div class="gwt-HTML">
<div class="row users-list">
<div class="col-md-12">
<div class="row headers">
<div class="col-sm-1 header select-users"><input id="allPageHelpContentsCheckbox" [checked]="checkboxAll" type="checkbox" (change)="toggleCheckBoxes($event)">
</div>
<div class="col-sm-2 header hidden-xs"><label><a href="#">Page</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Placement</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Order</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Active</a></label></div>
<div class="col-sm-5 header hidden-xs"><label><a href="#">Content</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Actions</a></label></div>
</div>
<template [ngIf]="pageHelpContentsCheckboxes && pageHelpContentsCheckboxes.length>0">
<div *ngFor="let check of pageHelpContentsCheckboxes; let i=index" class="row user">
<div class="col-sm-1 avatar"><input id="{{check.pageHelpContent._id}}" class="checkBox" type="checkbox"
name="pageHelpContentscb[]" value="{{check.pageHelpContent._id}}" [(ngModel)]="check.checked">
</div>
<div class="col-sm-2">
<div class="page" href="#">{{check.pageHelpContent.page.name}}</div>
</div>
<div class="col-sm-1">
<div class="placement" href="#">{{check.pageHelpContent.placement}}</div>
</div>
<div class="col-sm-1">
<div class="order" href="#">{{check.pageHelpContent.order}}
</div>
</div>
<div class="col-sm-1">
<div *ngIf="check.pageHelpContent.isActive" class="activated" >
<input (click)="togglePageHelpContents(false,[check.pageHelpContent._id])" class="deactivate" src="imgs/check-icon.png" title="Deactivate" width="20" type="image" height="20">
</div>
<div *ngIf="!check.pageHelpContent.isActive" class="activated" >
<input (click)="togglePageHelpContents(true,[check.pageHelpContent._id])" class="deactivate" src="imgs/x-icon.png" title="Activate" width="20" type="image" height="20">
</div>
</div>
<div class="col-sm-5">
<div class="content" href="#">{{check.pageHelpContent.content}}
</div>
</div>
<div class="col-sm-1">
<div class="actions" href="#">
<input title="Edit" src="imgs/icn_edit.png" class="edit" type="image" (click)="editPageHelpContent(check.pageHelpContent._id)">
<input title="Delete" src="imgs/icn_trash.png" class="delete" type="image" (click)="confirmDeletePageHelpContent(check.pageHelpContent._id)">
</div>
</div>
</div>
</template>
<div *ngIf="pageHelpContentsCheckboxes.length==0" class="col-md-12">
<div class="alert alert-warning">No page contents found</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<delete-confirmation-dialog #deleteConfirmationModal [isModalShown]="isModalShown" (emmitObject)="confirmedDeletePageHelpContents($event)">
Are you sure you want to delete the selected page content(s)?
</delete-confirmation-dialog>

222
app/pages/helpcontent/page-help-contents.component.ts
Unescape Escape View File

@ -0,0 +1,222 @@
/**
* Created by stefania on 7/13/17.
*/
import { Component, ViewChild, OnInit } from '@angular/core';
import { FormGroup } from "@angular/forms";
import { DeleteConfirmationDialogComponent } from "../delete-confirmation-dialog.component";
import { HelpContentService } from "../../services/help-content.service";
import { PageHelpContent, CheckPageHelpContent, PageHelpContentFilterOptions } from "../../domain/page-help-content";
import { Page } from "../../domain/page";
import {Router} from "@angular/router";
@Component({
selector: 'page-help-contents',
templateUrl: './page-help-contents.component.html',
})
export class PageHelpContentsComponent implements OnInit {
// @ViewChild(ModalFormComponent)
// @ViewChild('saveModal')
// public modal:ModalFormComponent;
//
// @ViewChild('updateModal')
// public updateModal:ModalFormComponent;
//
// @ViewChild(PageHelpContentsFormComponent)
// public formComponent : PageHelpContentsFormComponent;
@ViewChild('deleteConfirmationModal')
public deleteConfirmationModal : DeleteConfirmationDialogComponent;
public pageHelpContentsCheckboxes : CheckPageHelpContent[] = [];
public pageHelpContents : PageHelpContent[] = [];
public errorMessage: string;
public formGroup : FormGroup;
public pages: Page[];
public checkboxAll : boolean = false;
public filters : PageHelpContentFilterOptions = {id : '', active : null, text : new RegExp('')};
public counter = {all : 0, active : 0, inactive : 0};
ngOnInit() {
this.getPages();
this.getPageHelpContents();
// this.formGroup = this.formComponent.form;
}
constructor(private _helpService: HelpContentService, private router : Router) {}
getPages() {
this._helpService.getPages().subscribe(
pages => this.pages = pages,
error => this.handleError('System error retrieving pages', error));
}
public countPageHelpContents() {
this.counter = {all : 0, active : 0, inactive : 0};
let filter = Object.assign({},this.filters);
filter.active = null;
this.pageHelpContents.forEach(_ => {
if(this.filterPageHelpContent(_,filter)){
if (_.isActive==true) this.counter.active++;
else this.counter.inactive++
}
});
this.counter.all = this.counter.active + this.counter.inactive;
}
getPageHelpContents() {
let self = this;
this._helpService.getPageHelpContents().subscribe(
pageHelpContents => {
self.pageHelpContents = pageHelpContents as Array<PageHelpContent>;
self.counter.all = self.pageHelpContents.length;
self.pageHelpContents.forEach(_ => {
self.pageHelpContentsCheckboxes.push(<CheckPageHelpContent>{pageHelpContent : _, checked : false});
});
self.countPageHelpContents();
},
error => this.handleError('System error retrieving page contents', error));
}
// public showModal():void {
// this.modal.showModal();
// }
public toggleCheckBoxes(event) {
this.pageHelpContentsCheckboxes.forEach(_ => _.checked = event.target.checked);
this.checkboxAll = event.target.checked;
}
public applyCheck(flag : boolean) {
this.pageHelpContentsCheckboxes.forEach(_ => _.checked = flag);
this.checkboxAll = false;
}
public getSelectedPageHelpContents() : string[] {
return this.pageHelpContentsCheckboxes.filter(pageHelpContent => pageHelpContent.checked == true)
.map(checkedPageHelpContent => checkedPageHelpContent.pageHelpContent).map(res => res._id);
}
public confirmDeletePageHelpContent(id : string) {
this.deleteConfirmationModal.ids = [id];
this.deleteConfirmationModal.showModal();
}
public confirmDeleteSelectedPageHelpContents() {
this.deleteConfirmationModal.ids = this.getSelectedPageHelpContents();
this.deleteConfirmationModal.showModal();
}
public confirmedDeletePageHelpContents(ids : string[]) {
this._helpService.deletePageHelpContents(ids).subscribe(
_ => this.deletePageHelpContentsFromArray(ids),
error => this.handleError('System error deleting the selected page content(s)', error)
);
}
private deletePageHelpContentsFromArray(ids : string[]) : void {
for(let id of ids) {
let iqc = this.pageHelpContentsCheckboxes.findIndex(_ => _.pageHelpContent._id == id);
let iq = this.pageHelpContents.findIndex(_ => _._id == id);
this.pageHelpContentsCheckboxes.splice(iqc, 1);
this.pageHelpContents.splice(iqc, 1);
}
}
public editPageHelpContent(_id : string) {
this.router.navigate(['/pageContents/edit/', _id]);
}
public togglePageHelpContents(status : boolean, ids : string[]) {
this._helpService.togglePageHelpContents(ids,status).subscribe(
ret => {
for(let id of ret) {
let i = this.pageHelpContentsCheckboxes.findIndex(_ => _.pageHelpContent._id == id);
this.pageHelpContentsCheckboxes[i].pageHelpContent.isActive=status;
}
this.countPageHelpContents();
this.applyCheck(false);
},
error => this.handleError('System error changing the status of the selected page content(s)', error)
);
}
public savePageHelpContent(data : any):void {
console.log(data);
this._helpService.savePageHelpContent(data).subscribe(
pageHelpContent => this.pageHelpContentSavedSuccessfully(pageHelpContent),
error => this.handleError('System error saving the specified help content', error)
);
}
public pageHelpContentSavedSuccessfully(pageHelpContent: PageHelpContent) {
this.pageHelpContentsCheckboxes.push(<CheckPageHelpContent>{pageHelpContent : pageHelpContent, checked : false});
this.pageHelpContents.push(pageHelpContent);
this.applyCheck(false);
this.countPageHelpContents();
}
public pageHelpContentUpdatedSuccessfully(pageHelpContent : PageHelpContent) {
this.pageHelpContentsCheckboxes.find(checkItem => checkItem.pageHelpContent._id==pageHelpContent._id).pageHelpContent = pageHelpContent;
let index = this.pageHelpContents.findIndex(checkItem => checkItem._id==pageHelpContent._id);
this.pageHelpContents[index] = pageHelpContent;
this.applyCheck(false);
this.countPageHelpContents();
}
public filterPageHelpContent(pageHelpContent : PageHelpContent, filters : PageHelpContentFilterOptions) : boolean {
let idFlag = filters.id == '' || (<Page>pageHelpContent.page)._id == filters.id;
let activeFlag = filters.active == null || pageHelpContent.isActive == filters.active;
let textFlag = filters.text.toString() == '' || (pageHelpContent.content).match(filters.text) != null;
return idFlag && activeFlag && textFlag;
}
public applyFilter() {
this.pageHelpContentsCheckboxes = [];
this.pageHelpContents.filter(item => this.filterPageHelpContent(item,this.filters)).forEach(
_ => this.pageHelpContentsCheckboxes.push(<CheckPageHelpContent>{pageHelpContent: _, checked: false})
);
this.countPageHelpContents();
}
public filterByPage(event: any) {
this.filters.id = event.target.value;
this.applyFilter();
}
public displayAllPageHelpContents() {
this.filters.active = null;
this.applyFilter();
}
public displayActivePageHelpContents() {
this.filters.active = true;
this.applyFilter();
}
public filterBySearch(text : string) {
this.filters.text = new RegExp(text, "i");
this.applyFilter();
}
public displayInactivePageHelpContents() {
this.filters.active = false;
this.applyFilter();
}
handleError(message: string, error) {
if(error == null) {
// this.formComponent.reset();
}
this.errorMessage = message + ' (Server responded: ' + error + ')';
}
}

92
app/pages/helpcontent/pages.component.html
Unescape Escape View File

@ -0,0 +1,92 @@
<div id="pages">
<div id="content">
<div class="menubar fixed">
<div class="sidebar-toggler visible-xs">
<i class="ion-navicon"></i>
</div>
<div class="page-title">Pages</div>
<form target="BSFormPanel_Admin_1" class="search">
<input #inputstring (keyup.enter)="filterBySearch(inputstring.value)" placeholder="Search pages (route, name)..." type="text"/>
<input class="btn" type="submit">
</form>
<a (click)="showModal()" class="btn btn-success pull-right"><i></i> New Page </a>
</div>
<div class="content-wrapper" id="contentWrapper">
<div>
<div class="contentPanel">
<div class="alert alert-danger" style="display: none;" aria-hidden="true">
<span></span><span></span><span></span></div>
<div class="alert alert-success" style="display: none;" aria-hidden="true">
<span></span><span></span><span></span></div>
<div class="alert" style="display: none;" aria-hidden="true"><span></span><span></span><span></span></div>
<div class="row page-controls">
<div class="col-md-12 filters">
<div class="show-options">
<div class="btn-group"><a href="javascript:;" class="btn dropdown-toggle"
data-toggle="dropdown"><i></i> Bulk Actions <span
class="caret"></span></a>
<ul class="dropdown-menu">
<li><a (click)="confirmDeleteSelectedPages()"><i></i> Delete </a></li>
</ul>
</div>
</div>
</div>
</div>
<div>
<div class="gwt-HTML">
<div class="row users-list">
<div class="col-md-12">
<div class="row headers">
<div class="col-sm-1 header select-users"><input id="allPageCheckbox" type="checkbox" (change)="toggleCheckBoxes($event)">
</div>
<div class="col-sm-4 header hidden-xs"><label><a href="#">Route</a></label></div>
<div class="col-sm-6 header hidden-xs"><label><a href="#">Name</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Actions</a></label></div>
</div>
<template [ngIf]="pagesCheckboxes && pagesCheckboxes.length>0">
<div *ngFor="let check of pagesCheckboxes; let i=index" class="row user">
<div class="col-sm-1 avatar"><input id="{{check.page._id}}" class="checkBox" type="checkbox"
name="pagescb[]" value="{{check.page._id}}" [(ngModel)]="check.checked">
</div>
<div class="col-sm-4">
<div class="route" href="#">{{check.page.route}}</div>
</div>
<div class="col-sm-6">
<div class="name" href="#">{{check.page.name}}</div>
</div>
<div class="col-sm-1">
<div class="actions" href="#">
<input title="Edit" src="imgs/icn_edit.png" class="edit" type="image" (click)="editPage(i)">
<input title="Delete" src="imgs/icn_trash.png" class="delete" type="image" (click)="confirmDeletePage(check.page._id)">
</div>
</div>
</div>
</template>
<div *ngIf="pagesCheckboxes.length==0" class="col-md-12">
<div class="alert alert-warning">No pages found</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<modal-form #saveModal [saveText]="'Save'" [titleText]="'Add a new Page'" [formGroup]="formGroup" [type]="'page'"
[isModalShown]="isModalShown" (emmitObject)="pageSavedSuccessfully($event)" (emmitError)="handleError($event)">
<page-form [group]="formGroup"></page-form>
</modal-form>
<modal-form #updateModal [saveText]="'Update'" [titleText]="'Update Page'" [formGroup]="formGroup" [type]="'page'" s
[isModalShown]="isModalShown" (emmitObject)="pageUpdatedSuccessfully($event)" (emmitError)="handleError($event)">
<page-form [group]="formGroup"></page-form>
</modal-form>
<delete-confirmation-dialog #deleteConfirmationModal [isModalShown]="isModalShown" (emmitObject)="confirmedDeletePages($event)">
Are you sure you want to delete the selected page(s)?
</delete-confirmation-dialog>

140
app/pages/helpcontent/pages.component.ts
Unescape Escape View File

@ -0,0 +1,140 @@
/**
* Created by stefania on 7/13/17.
*/
import { Component, ViewChild, OnInit } from '@angular/core';
import { HelpContentService } from "../../services/help-content.service";
import { FormGroup } from "@angular/forms";
import { ModalFormComponent } from "../modal-form.component";
import { DeleteConfirmationDialogComponent } from "../delete-confirmation-dialog.component";
import { PageFormComponent } from "./page-form.component";
import { CheckPage, Page } from "../../domain/page";
@Component({
selector: 'pages',
templateUrl: './pages.component.html',
})
export class PagesComponent implements OnInit {
// @ViewChild(ModalFormComponent)
@ViewChild('saveModal')
public modal:ModalFormComponent;
@ViewChild('updateModal')
public updateModal:ModalFormComponent;
@ViewChild('deleteConfirmationModal')
public deleteConfirmationModal : DeleteConfirmationDialogComponent;
@ViewChild(PageFormComponent)
public formComponent : PageFormComponent;
public pagesCheckboxes : CheckPage[] = [];
public pages : Page[] = [];
public errorMessage: string;
public formGroup : FormGroup;
private searchText : RegExp = new RegExp('');
ngOnInit() {
this.getPages();
this.formGroup = this.formComponent.form;
}
constructor(private _helpContentService: HelpContentService) {}
getPages() {
let self = this;
this._helpContentService.getPages().subscribe(
pages => {
self.pages = pages;
pages.forEach(_ => {
self.pagesCheckboxes.push(<CheckPage>{page : _, checked : false});
});
},
error => this.handleError('System error retrieving pages', error));
}
public showModal():void {
this.modal.showModal();
}
public toggleCheckBoxes(event) {
this.pagesCheckboxes.forEach(_ => _.checked = event.target.checked);
}
public applyCheck(flag : boolean) {
this.pagesCheckboxes.forEach(_ => _.checked = flag);
}
public getSelectedPages() : string[] {
return this.pagesCheckboxes.filter(page => page.checked == true).map(checkedPage => checkedPage.page).map(res => res._id);
}
private deletePagesFromArray(ids : string[]) : void {
for(let id of ids) {
let i = this.pagesCheckboxes.findIndex(_ => _.page._id == id);
this.pagesCheckboxes.splice(i, 1);
}
}
public confirmDeletePage(id : string) {
this.deleteConfirmationModal.ids = [id];
this.deleteConfirmationModal.showModal();
}
public confirmDeleteSelectedPages() {
this.deleteConfirmationModal.ids = this.getSelectedPages();
this.deleteConfirmationModal.showModal();
}
public confirmedDeletePages(ids : string[]) {
this._helpContentService.deletePages(ids).subscribe(
_ => this.deletePagesFromArray(ids),
error => this.handleError('System error deleting the selected pages', error)
);
}
public editPage(i : number) {
let page : Page = this.pagesCheckboxes[i].page;
this.formGroup.patchValue(page);
this.updateModal.showModal();
}
public pageSavedSuccessfully(page: Page) {
this.pagesCheckboxes.push(<CheckPage>{page : page, checked : false});
this.applyCheck(false);
}
public pageUpdatedSuccessfully(page : Page) {
this.pagesCheckboxes.find(checkItem => checkItem.page._id==page._id).page = page;
this.applyCheck(false);
}
public filterBySearch(text : string) {
this.searchText = new RegExp(text,'i');
this.applyFilter();
}
public applyFilter() {
this.pagesCheckboxes = [];
this.pages.filter(item => this.filterPages(item)).forEach(
_ => this.pagesCheckboxes.push(<CheckPage>{page: _, checked: false})
);
}
public filterPages(page : Page) : boolean {
let textFlag = this.searchText.toString() == '' || (page.route + ' ' +page.name).match(this.searchText) != null;
return textFlag;
}
handleError(message: string, error) {
if(error == null) {
this.formComponent.reset();
}
this.errorMessage = message + ' (Server responded: ' + error + ')';
}
}

22
app/pages/modal-form.component.html
Unescape Escape View File

@ -0,0 +1,22 @@
<div *ngIf="isModalShown" [config]="{ show: true }" (onHidden)="onHidden()" bsModal #autoShownModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-md">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close pull-right" aria-label="Close" (click)="hideModal()">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title"> {{titleText}} </h4>
</div>
<div class="modal-body">
<div *ngIf="errorMessage" class="alert alert-danger" aria-hidden="true">{{ errorMessage }}</div>
<ng-content></ng-content>
</div>
<div class="modal-footer">
<div class="confirmationModalButtons">
<a (click)="hideModal()" class="btn"><i></i> Cancel </a>
<a (click)="saveCustom(formGroup.value)" class="btn btn-success"><i></i> {{saveText}} </a>
</div>
</div>
</div>
</div>
</div>

85
app/pages/modal-form.component.ts
Unescape Escape View File

@ -0,0 +1,85 @@
/**
* Created by stefanos on 28/4/2017.
*/
import { Component, ViewChild, Input, Output, EventEmitter, OnInit } from '@angular/core';
import { ModalDirective } from 'ngx-bootstrap/modal';
import { FormGroup } from "@angular/forms";
import { FAQService } from "../services/faq.service";
import { Topic } from "../domain/topic";
import { Question } from "../domain/question";
import { HelpContentService } from "../services/help-content.service";
import { Page } from "../domain/page";
@Component({
selector: 'modal-form',
templateUrl: './modal-form.component.html'
})
export class ModalFormComponent {
constructor(private _faqService : FAQService, private _helpService: HelpContentService){
}
@ViewChild('autoShownModal')
public autoShownModal:ModalDirective;
@Input()
public isModalShown:boolean = false;
@Input()
public saveText : string;
@Input()
public titleText : string;
@Input()
public formGroup : FormGroup;
@Input()
public type : string = 'topic';
public errorMessage : string = null;
@Output() emmitObject: EventEmitter<any> = new EventEmitter();
@Output() emmitError: EventEmitter<any> = new EventEmitter();
public showModal():void {
this.isModalShown = true;
}
public hideModal():void {
this.autoShownModal.hide();
}
public onHidden():void {
this.isModalShown = false;
this.emmitError.emit(null);
this.errorMessage = null;
}
public saveCustom(obj : any) {
if(!this.formGroup.valid) {
this.errorMessage = "Please fill in all required fields marked with *"
} else {
if (this.type == 'topic') {
this._faqService.saveTopic(<Topic> obj).subscribe(
data => this.emmitObject.emit(data),
error => this.emmitError.emit(error)
);
} else if (this.type == 'question') {
this._faqService.saveQuestion(<Question> obj).subscribe(
data => this.emmitObject.emit(data),
error => this.emmitError.emit(error)
);
} else if (this.type == 'page') {
this._helpService.savePage(<Page> obj).subscribe(
data => this.emmitObject.emit(data),
error => this.emmitError.emit(error)
);
}
this.hideModal();
}
}
}

49
app/polyfills.ts
Unescape Escape View File

@ -0,0 +1,49 @@
/**
* Created by stefanos on 25/4/2017.
*/
// Polyfills
// import 'ie-shim'; // Internet Explorer 9 support
import 'reflect-metadata';
// import 'core-js/es6';
// Added parts of es6 which are necessary for your project or your browser support requirements.
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/set';
import 'core-js/es6/weak-map';
import 'core-js/es6/weak-set';
import 'core-js/es6/typed';
import 'core-js/es6/reflect';
// see issue https://github.com/AngularClass/angular2-webpack-starter/issues/709
// import 'core-js/es6/promise';
import 'intl';
import 'intl/locale-data/jsonp/en'
import 'core-js/es7/reflect';
import 'zone.js/dist/zone';
import 'ng2-ckeditor/lib';
// if ('production' === ENV) {
// // Production
//
// } else {
//
// // Development
// Error.stackTraceLimit = Infinity;
//
// /* tslint:disable no-var-requires */
// require('zone.js/dist/long-stack-trace-zone');
//
// }

132
app/services/faq.service.ts
Unescape Escape View File

@ -0,0 +1,132 @@
/**
* Created by stefania on 4/26/17.
*/
import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Rx';
import { Topic } from './../domain/topic';
import { Question } from './../domain/question';
import { ActiveTopicQuestions } from './../domain/active-topic-questions';
@Injectable()
export class FAQService {
constructor (private http: Http) {}
private _faqsUrl = process.env.API_ENDPOINT;
static removeNulls(obj){
var isArray = obj instanceof Array;
for (var k in obj){
if (obj[k]===null || obj[k]==='') isArray ? obj.splice(k,1) : delete obj[k];
else if (typeof obj[k]=="object") FAQService.removeNulls(obj[k]);
}
}
getTopics() {
return this.http.get(this._faqsUrl + 'topic')
.map(res => <Array<Topic>> res.json())
.catch(this.handleError);
}
saveTopic(topic: Topic) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
FAQService.removeNulls(topic);
return this.http.post(this._faqsUrl + 'topic', JSON.stringify(topic), options)
.map(res => <Topic> res.json())
.catch(this.handleError);
}
updateTopic(topic: Topic) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
FAQService.removeNulls(topic);
return this.http.put(this._faqsUrl + 'topic', JSON.stringify(topic), options)
.map(res => <Topic> res.json())
.catch(this.handleError);
}
deleteTopics(ids : string[]) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
return this.http.post(this._faqsUrl + 'topic/delete',JSON.stringify(ids), options)
.catch(this.handleError);
}
orderTopic(ids: string[], order: string) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
return this.http.post(this._faqsUrl + 'topic/toggle?order='+ order, JSON.stringify(ids), options)
.map( res => <string[]> res.json())
.catch(this.handleError);
}
getQuestions() {
return this.http.get(this._faqsUrl + 'question')
.map(res => <Array<Question>> res.json())
.catch(this.handleError);
}
saveQuestion(question: Question) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
FAQService.removeNulls(question);
return this.http.post(this._faqsUrl + 'question', JSON.stringify(question), options)
.map(res => <Question> res.json())
.catch(this.handleError);
}
toggleQuestion(ids : string[],status : boolean) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
return this.http.post(this._faqsUrl + 'question/toggle?status='+ status.toString(), JSON.stringify(ids), options)
.map( res => <string[]> res.json())
.catch(this.handleError);
}
deleteQuestion(id : string) {
return this.http.delete(this._faqsUrl + 'question/' + id)
.catch(this.handleError);
}
deleteQuestions(ids : string[]) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
return this.http.post(this._faqsUrl + 'question/delete',JSON.stringify(ids), options)
.catch(this.handleError);
}
// getResources() {
// return this.http.get(this._resourcesUrl)
// .map(res => <ResourcePage> res.json())
// .catch(this.handleError);
// }
//
// getResource(resourceType: string, id: string) {
// return this.http.get(this._resourcesUrl + resourceType + "/" + id)
// .map(res => <Resource> res.json())
// .catch(this.handleError);
// }
private handleError(error: Response) {
// in a real world app, we may send the error to some remote logging infrastructure
// instead of just logging it to the console
console.error(error);
return Observable.throw(error.json().error || 'Server error');
}
}

122
app/services/help-content.service.ts
Unescape Escape View File

@ -0,0 +1,122 @@
/**
* Created by stefania on 7/13/17.
*/
import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs/Rx';
import { Page } from "../domain/page";
import {PageHelpContent} from "../domain/page-help-content";
@Injectable()
export class HelpContentService {
constructor(private http:Http) {
}
private _helpContentUrl = process.env.API_ENDPOINT;
static removeNulls(obj){
var isArray = obj instanceof Array;
for (var k in obj){
if (obj[k]===null || obj[k]==='') isArray ? obj.splice(k,1) : delete obj[k];
else if (typeof obj[k]=="object") HelpContentService.removeNulls(obj[k]);
}
}
getPages() {
return this.http.get(this._helpContentUrl + 'page')
.map(res => <Array<Page>> res.json())
.catch(this.handleError);
}
savePage(page: Page) {
console.log("savePage",page);
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
HelpContentService.removeNulls(page);
return this.http.post(this._helpContentUrl + 'page', JSON.stringify(page), options)
.map(res => <Page> res.json())
.catch(this.handleError);
}
updatePage(page: Page) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
HelpContentService.removeNulls(page);
return this.http.put(this._helpContentUrl + 'page', JSON.stringify(page), options)
.map(res => <Page> res.json())
.catch(this.handleError);
}
deletePages(ids : string[]) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
return this.http.post(this._helpContentUrl + 'page/delete',JSON.stringify(ids), options)
.catch(this.handleError);
}
getPageHelpContents() {
return this.http.get(this._helpContentUrl + 'pagehelpcontent')
.map(res => <Array<PageHelpContent>> res.json())
.catch(this.handleError);
}
getPageHelpContent(id : string) {
return this.http.get(this._helpContentUrl + 'pagehelpcontent/' + id)
.map(res => <PageHelpContent> res.json())
.catch(this.handleError);
}
savePageHelpContent(pageHelpContent: PageHelpContent) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
HelpContentService.removeNulls(pageHelpContent);
return this.http.post(this._helpContentUrl + 'pagehelpcontent', JSON.stringify(pageHelpContent), options)
.map(res => <PageHelpContent> res.json())
.catch(this.handleError);
}
updatePageHelpContent(pageHelpContent: PageHelpContent) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
HelpContentService.removeNulls(pageHelpContent);
return this.http.put(this._helpContentUrl + 'pagehelpcontent', JSON.stringify(pageHelpContent), options)
.map(res => <PageHelpContent> res.json())
.catch(this.handleError);
}
deletePageHelpContents(ids : string[]) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
return this.http.post(this._helpContentUrl + 'pagehelpcontent/delete',JSON.stringify(ids), options)
.catch(this.handleError);
}
togglePageHelpContents(ids : string[],status : boolean) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
return this.http.post(this._helpContentUrl + 'pagehelpcontent/toggle?status='+ status.toString(), JSON.stringify(ids), options)
.map( res => <string[]> res.json())
.catch(this.handleError);
}
private handleError(error: Response) {
// in a real world app, we may send the error to some remote logging infrastructure
// instead of just logging it to the console
console.error(error);
return Observable.throw(error.json().error || 'Server error');
}
}

BIN
css/.sass-cache/4a19cf49ca39d0ca12d0eeede1f8c47985b3bbe2/_bootstrap-overrides.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/4f25e7470e383c6c18683fb82a17a050335e8155/_config.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/4f25e7470e383c6c18683fb82a17a050335e8155/_layout.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/8694951a6926e32b2a543604d41915b342b7d36a/_custom_animations.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_account.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_billing_form.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_calendar.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_datatables.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_docs.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_email_templates.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_form.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_form_product.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_gallery.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_index.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_invoice.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_latest_activity.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_pricing.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_pricing_alt.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_projects.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_reports.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_reports_alt.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_search.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_sidebar.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_signin.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_signup.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_status.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_steps.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_ui.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_user_profile.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_users.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/93c5abef81e0ea962209c4387f7449bb54811ab3/_wizard.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/ad3dbc8ad8226153be3f634dee8e18f8714b9c90/theme.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/f0632ccd65fa691aea741c6b048a4689022a673c/_elements.scssc
View File

Binary file not shown.

BIN
css/.sass-cache/f0632ccd65fa691aea741c6b048a4689022a673c/_mixins.scssc
View File

Binary file not shown.

181
css/bootstrap/_bootstrap-overrides.scss
Unescape Escape View File

@ -0,0 +1,181 @@
/* ==============================================================================
// Pagination
// ============================================================================== */
.pagination>.active {
>a,
>span,
>a:hover,
>span:hover,
>a:focus,
>span:focus {
background-color: #5585B3;
border-color: #4477A3;
}
}
.pagination >li>a,
.pagination >li>span,
.pager li>a,
.pager li>span {
@include transition(all 0.25s linear);
}
/* ==============================================================================
// Modal
// ============================================================================== */
.modal-backdrop {
z-index: 10400;
&.in {
opacity: .35;
filter: alpha(opacity=35);
}
}
.modal {
z-index: 10500;
&.in {
.modal-dialog {
@include transform(translate(0,0) scale3d(1,1,1) !important);
}
}
&.fade {
@include transition(all .1s ease-out);
.modal-dialog {
@include transform(translate(0,0) scale3d(1.1,1.1,1.1));
@include transitionPrefix(transform, .1s ease-out);
}
}
.modal-dialog {
@include transform(translate(0,0) scale3d(1.1,1.1,1.1));
margin-top: 80px;
}
}
/* ==============================================================================
// Tooltips
// ============================================================================== */
.tooltip {
font-size: 13px;
.tooltip-inner {
font-weight: 600;
}
}
/* ==============================================================================
// Labels
// ============================================================================== */
.label-danger {
background: #D66363;
}
/* ==============================================================================
// Buttons
// ============================================================================== */
.btn {
&.btn-default {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.2);
@include transition(all .2s linear);
&:focus,
&:active {
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.14);
}
}
&.btn-primary {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.2);
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
@include transition(all .2s linear);
&:focus,
&:active {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.14);
}
}
&.btn-success {
border: 1px solid #63a042;
background-color: #76b852;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.2);
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
@include transition(all .2s linear);
&:focus,
&:active {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.14);
}
&:hover {
background-color: #47a447;
}
}
&.btn-danger {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.3);
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
@include transition(all .2s linear);
&:focus,
&:active {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.14);
}
}
&.btn-info {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.3);
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
@include transition(all .2s linear);
&:focus,
&:active {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.14);
}
}
&.btn-warning {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.3);
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
@include transition(all .2s linear);
&:focus,
&:active {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.14);
}
}
}
/* ==============================================================================
// Input groups
// ============================================================================== */
.input-group-addon {
background-color: #F2F7FA;
}
/* ==============================================================================
// Forms related
// ============================================================================== */
.form-horizontal .has-feedback .form-control-feedback {
right: 8px;
}
/* ==============================================================================
// <code></code>
// ============================================================================== */
code {
color: #256CC7;
background-color: #F8F2F9;
}

5785
css/bootstrap/bootstrap.css vendored
View File

File diff suppressed because it is too large Load Diff

7
css/bootstrap/bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long

7309
css/compiled/theme.css
View File

File diff suppressed because it is too large Load Diff

574
css/modules/_elements.scss
Unescape Escape View File

@ -0,0 +1,574 @@
*:focus {
outline: none;
}
a,
button,
input[type="submit"] {
&:focus {
outline: none !important;
}
}
/* ==============================================================================
// Custom buttons
// ============================================================================== */
.button {
-webkit-font-smoothing: antialiased;
border: 0;
outline: none;
padding: 1px;
display: inline-block;
text-decoration: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0 1px 0 rgba(0,0,0,0.075);
-moz-box-shadow: 0 1px 0 rgba(0,0,0,0.075);
-ms-box-shadow: 0 1px 0 rgba(0,0,0,0.075);
-o-box-shadow: 0 1px 0 rgba(0,0,0,0.075);
box-shadow: 0 1px 0 rgba(0,0,0,0.075);
height: 33px;
background: #adb2bb;
background: -webkit-linear-gradient(#ccd0d6, #adb2bb);
background: -moz-linear-gradient(#ccd0d6, #adb2bb);
background: -ms-linear-gradient(#ccd0d6, #adb2bb);
background: -o-linear-gradient(#ccd0d6, #adb2bb);
background: linear-gradient(#ccd0d6, #adb2bb);
@include transition(all .1s linear);
@include transform(scale3d(1, 1, 1));
&[disabled],
&.disabled {
pointer-events: none;
cursor: not-allowed;
box-shadow: none;
span {
box-shadow: none;
background: #E7EBF0;
background: #E7EBF0;
background: -webkit-linear-gradient(#E7EBF0, #E7EBF0);
background: -moz-linear-gradient(#E7EBF0, #E7EBF0);
background: -ms-linear-gradient(#E7EBF0, #E7EBF0);
background: -o-linear-gradient(#E7EBF0, #E7EBF0);
background: linear-gradient(#E7EBF0, #E7EBF0);
}
}
&:hover {
text-decoration: none;
}
&:active,
&.active {
background: #b5bac2;
background: -webkit-linear-gradient(#b5bac2, #b5bac2);
background: -moz-linear-gradient(#b5bac2, #b5bac2);
background: -ms-linear-gradient(#b5bac2, #b5bac2);
background: -o-linear-gradient(#b5bac2, #b5bac2);
background: linear-gradient(#b5bac2, #b5bac2);
@include transform(scale3d(0.95, 0.95, 0.95));
span,
span {
color: #444;
background: #eff1f4;
background: -webkit-linear-gradient(#e6e8eb, #eff1f4);
background: -moz-linear-gradient(#e6e8eb, #eff1f4);
background: -ms-linear-gradient(#e6e8eb, #eff1f4);
background: -o-linear-gradient(#e6e8eb, #eff1f4);
background: linear-gradient(#e6e8eb, #eff1f4);
-webkit-box-shadow: inset 0 1px 0 rgba(0,0,0,0.1);
-moz-box-shadow: inset 0 1px 0 rgba(0,0,0,0.1);
-ms-box-shadow: inset 0 1px 0 rgba(0,0,0,0.1);
-o-box-shadow: inset 0 1px 0 rgba(0,0,0,0.1);
box-shadow: inset 0 1px 0 rgba(0,0,0,0.1);
}
}
span {
display: block;
font-size: 14px;
padding-left: 15px;
padding-right: 15px;
height: 31px;
line-height: 31px;
border-radius: 4px;
font-weight: bold;
font-family: $helvetica;
color: #333;
text-shadow: 0 1px 0 #fff;
background: #f6f9fc;
background: #eff1f4;
background: -webkit-linear-gradient(#f7f8fa, #eff1f4);
background: -moz-linear-gradient(#f7f8fa, #eff1f4);
background: -ms-linear-gradient(#f7f8fa, #eff1f4);
background: -o-linear-gradient(#f7f8fa, #eff1f4);
background: linear-gradient(#f7f8fa, #eff1f4);
-webkit-box-shadow: inset 0 1px 0 white;
-moz-box-shadow: inset 0 1px 0 white;
-ms-box-shadow: inset 0 1px 0 white;
-o-box-shadow: inset 0 1px 0 white;
box-shadow: inset 0 1px 0 white;
@include transition(all .1s linear);
}
}
/* ==============================================================================
// Custom pager
// ============================================================================== */
.paging {
a {
position: relative;
font-size: 11px;
display: inline-block;
width: 28px;
height: 27px;
border: 1px solid #D7DADD;
text-align: center;
line-height: 26px;
border-radius: 5px;
color: #60A3D8;
&:active {
background: #fafafa;
box-shadow: inset 0 3px 5px rgba(0,0,0,.1)
}
&.disabled {
color: #B9B9B9;
cursor: default;
}
i {
&.fa-chevron-left {
position: relative;
left: -1px;
}
&.fa-trash-o {
font-size: 14px;
}
}
}
}
/* ==============================================================================
// Welcome modal
// ============================================================================== */
#welcome-modal {
.modal-dialog {
margin-top: 65px;
}
.modal-content {
background: #f5f8fc;
background: -webkit-linear-gradient(#fff,#f5f8fc);
background: -moz-linear-gradient(#fff,#f5f8fc);
background: -ms-linear-gradient(#fff,#f5f8fc);
background: -o-linear-gradient(#fff,#f5f8fc);
background: linear-gradient(#fff,#f5f8fc);
font-family: $helvetica;
.modal-header {
border-bottom: 0;
}
.modal-body {
padding-bottom: 50px;
header {
text-align: center;
font-weight: 600;
font-size: 22px;
color: #444;
margin-bottom: 23px;
}
p {
font-size: 13px;
color: #555;
margin: 0 auto;
width: 80%;
text-align: center;
line-height: 20px;
}
.get-started {
margin-top: 40px;
.col-md-4 {
text-align: center;
padding-bottom: 50px;
i {
font-size: 38px;
color: #7FA5BE;
}
a {
color: #576C91;
display: block;
margin-top: 12px;
font-size: 13px;
}
}
}
.go-dashboard {
color: #008cdd;
text-align: center;
display: block;
margin-top: 10px;
}
}
}
}
/* ==============================================================================
// Form controls
// ============================================================================== */
input[type="text"],
input[type="email"],
input[type="password"] {
&.form-control {
/*box-shadow: inset 0 1px 1px rgba(0,0,0,0.2);
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.2);
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.2);*/
/*height: 39px;*/
box-shadow: none;
@include placeholder {
color: #B1B1B1;
font-weight: 400;
font-size: 14px;
}
&:focus {
/*border-color: #98D2FF;*/
outline: none;
/*box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px rgba(166, 205, 236, 0.6);*/
box-shadow: none;
}
}
}
textarea {
&.form-control {
/*box-shadow: inset 0 1px 1px rgba(0,0,0,0.2);
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.2);
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.2);*/
box-shadow: none;
@include placeholder {
color: #B1B1B1;
font-weight: 400;
font-size: 14px;
}
&:focus {
/*border-color: #98D2FF;*/
outline: none;
/*box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px rgba(166, 205, 236, 0.6);*/
box-shadow: none;
}
}
}
/*
Create a custom select by adding a [data-smart-select]
to any select. e.g. <select class="form-control" data-smart-select>
and it will automatically be converted into a customized select
that is wrapped inside a .fake-select-wrap
*/
.fake-select-wrap {
position: relative;
display: inline-block;
width: 100%;
height: 34px;
line-height: 30px;
margin: 0;
> select {
position: absolute !important;
z-index: 3;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
top: 0 !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
padding: 0 !important;
margin: 0 !important;
width: 100% !important;
height: 100% !important;
cursor: pointer;
}
> .fake-select {
position: relative;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border-radius: 4px;
width: 100%;
margin: 0;
vertical-align: bottom;
padding: 0 10px;
white-space: nowrap;
padding-right: 20px;
text-overflow: ellipsis;
/*overflow: hidden;*/
border: 1px solid #ccc;
background: #fff;
height: 34px;
line-height: 30px;
cursor: pointer;
color: #444;
&.focus {
border-color: #98c7f8;
&:after {
color: #81B5EC;
}
}
&:after {
font-family: 'FontAwesome';
font-size: 13px;
content: "\f078";
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-weight: 400;
color: #757575;
display: block;
position: absolute;
right: 13px;
height: 100%;
top: 17px;
line-height: 0;
}
}
}
/* ==============================================================================
// jQuery Validate messages
// ============================================================================== */
form {
label.error {
position: relative !important;
display: inline-block !important;
margin-top: -2px !important;
margin-bottom: -8px !important;
color: #fff !important;
font-weight: normal !important;
font-size: 14px !important;
padding: 5px 8px !important;
background: #589BC9 !important;
border-radius: 4px !important;
&.valid {
display: none !important;
}
&:after {
bottom: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-bottom-color: #589BC9;
border-width: 5px;
left: 30px;
margin-left: -5px;
}
}
}
/* ==============================================================================
// Flot charts tooltip
// ============================================================================== */
#flotTip {
background-color: #000;
color: #fff;
/*border: 1px solid rgb(204, 204, 204);*/
/*box-shadow: rgba(0, 0, 0, 0.0980392) 0px 1px;*/
padding: 3px 11px 4px;
border-radius: 4px;
z-index: 9999;
.value {
display: block;
text-align: center;
font-weight: 600;
}
}
/* ==============================================================================
// Skin Switcher
// ============================================================================== */
.skin-switcher {
position: fixed;
right: 0px;
top: 160px;
z-index: 999999;
.toggler {
cursor: pointer;
/*padding: 10px 15px;*/
padding: 8px 15px;
border-radius: 4px 0 0 4px;
background: #fff;
box-shadow: -1px 0px 3px rgba(0, 0, 0, 0.25), 2px 2px 3px rgba(0, 0, 0, 0.12);
.ion-settings {
color: #666;
font-size: 21px;
}
.brankic-brush {
font-size: 25px;
color: #8C6DEC;
}
}
.menu {
position: absolute;
right: 50px;
top: -4px;
background: #fff;
width: 165px;
border-radius: 3px;
padding: 8px 0;
list-style-type: none;
box-shadow: 0 8px 13px rgba(0,0,0,0.36),0 0 0 1px rgba(0,0,0,0.06);
opacity: 0;
@include transform(scale(0));
@include transition(all 300ms cubic-bezier(0.34,1.41,0.7,1));
@include transform-origin(100% 15px);
&.active {
opacity: 1;
@include transform(scale(1));
}
&:before {
content: "";
position: absolute;
display: block;
width: 37px;
height: 12px;
right: -24px;
top: 20px;
background-image: url("../../images/popover-arrow.png");
background-size: 100% 100%;
@include transform(rotate(90deg));
}
li {
padding: 8px 15px;
border-bottom: 1px solid #E6E6E6;
&:last-child {
border-bottom: 0;
}
a {
position: relative;
text-decoration: none;
display: block;
color: #4C5661;
font-size: 15px;
@include transition(all .2s linear);
&:hover {
color: #000;
}
&.active {
.fa-check {
opacity: 1;
}
}
.color {
width: 10px;
height: 10px;
border-radius: 50%;
display: inline-block;
margin-right: 5px;
&.default {
border: 3px solid #319DDB;
}
&.clear {
border: 3px solid #BFDFF1;
}
&.dark {
border: 3px solid #808FCA;
}
&.black {
border: 3px solid #3E4052;
}
&.flat {
border: 3px solid #d8dfe6;
}
&.flat-dark {
border: 3px solid #363e45;
}
}
.fa-check {
color: #83C490;
font-size: 14px;
position: absolute;
top: 4px;
right: 4px;
opacity: 0;
@include transition(all .2s linear);
}
}
}
}
}
/* ==============================================================================
// jQuery Datepicker
// ============================================================================== */
.datepicker-dropdown {
z-index: 9999999 !important;
}

87
css/modules/_mixins.scss
Unescape Escape View File

@ -0,0 +1,87 @@
@mixin transition($transitions) {
-webkit-transition: $transitions;
-moz-transition: $transitions;
-ms-transition: $transitions;
-o-transition: $transitions;
transition: $transitions;
}
/* this mixin makes possible to add transition to a specific vendor, example: */
/* -webkit-transition: -webkit-transform 0.5s linear; */
@mixin transitionPrefix($property, $values) {
-webkit-transition: -webkit-#{$property} #{$values};
-moz-transition: -moz-#{$property} #{$values};
-ms-transition: -ms-#{$property} #{$values};
-o-transition: -o-#{$property} #{$values};
transition: #{$property} #{$values};
}
@mixin background-gradient($from, $to) {
background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, $from), color-stop(100%, $to));
background: -webkit-linear-gradient($from, $to);
background: -moz-linear-gradient($from, $to);
background: -o-linear-gradient($from, $to);
background: linear-gradient($from, $to);
}
@mixin transform ($transforms) {
-moz-transform: $transforms;
-o-transform: $transforms;
-ms-transform: $transforms;
-webkit-transform: $transforms;
transform: $transforms;
}
@mixin transform-origin ($values) {
-webkit-transform-origin: $values;
-moz-transform-origin: $values;
-o-transform-origin: $values;
-ms-transform-origin: $values;
transform-origin: $values;
}
@mixin placeholder {
&::-webkit-input-placeholder {@content}
&:-moz-placeholder {@content}
&::-moz-placeholder {@content}
&:-ms-input-placeholder {@content}
}
@mixin animation($animations) {
-webkit-animation: $animations;
-moz-animation: $animations;
-o-animation: $animations;
-ms-animation: $animations;
animation: $animations;
}
@mixin animationDelay($value) {
-webkit-animation-delay: $value;
-moz-animation-delay: $value;
-o-animation-delay: $value;
-ms-animation-delay: $value;
animation-delay: $value;
}
@mixin animationDuration($value) {
-webkit-animation-duration: $value;
-moz-animation-duration: $value;
-o-animation-duration: $value;
animation-duration: $value;
}
@mixin keyFrame($name) {
@-webkit-keyframes $name{
@content
}
@-moz-keyframes $name{
@content
}
@-o-keyframes $name{
@content
}
@keyframes $name{
@content
}
}

27
css/partials/_config.scss
Unescape Escape View File

@ -0,0 +1,27 @@
/* roboto font */
/*@import url(http://fonts.googleapis.com/css?family=Roboto:400,100,100italic,300italic,300,400italic,500,500italic,700,700italic,900,900italic);*/
/* source sans pro */
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900,200italic,300italic,400italic,600italic,700italic,900italic);
/* lato */
@import url(http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic);
/* merriweather */
/*@import url(http://fonts.googleapis.com/css?family=Merriweather:400,300italic,300,400italic,700,700italic);*/
$roboto: "Roboto";
$arial: "Arial";
$lato: 'Lato', 'Helvetica Neue', Arial;
$helvetica: "Helvetica Neue", Helvetica, Arial;
$myriad: Myriad Pro, Lato, Helvetica Neue, Arial;
$sourceSans: Source Sans Pro, Helvetica Neue, Arial;
$merriweather: "Merriweather", Georgia;
$helvetica: "Helvetica Neue", Arial;
$sidebarBg: #2F343D;
/*$sidebarBg: #35485e;*/
$imagesPath: '../../images';
$maxMedium: 991px;
$minMedium: 768px;
$maxSmall: 767px;

3044
css/partials/_layout.scss
View File

File diff suppressed because it is too large Load Diff

407
css/partials/pages/_account.scss
Unescape Escape View File

@ -0,0 +1,407 @@
#account {
#content {
padding: 0;
#sidebar {
left: 0;
top: 0;
bottom: 0;
position: absolute;
width: 22%;
background: #fcfcfc;
border-right: 1px solid #E8ECF1;
@media (max-width: $maxMedium) {
width: 28%;
}
@media (max-width: $maxSmall) {
position: relative;
width: 100%;
}
.sidebar-toggler {
position: absolute;
top: 8px;
left: 32px;
font-size: 36px;
cursor: pointer;
}
h3 {
margin: 0;
text-align: center;
font-size: 19px;
padding: 22px 0;
@media (max-width: $maxSmall) {
padding: 22px 0 0;
}
}
.menu {
list-style-type: none;
padding: 0;
margin: 0;
@media (max-width: $maxSmall) {
margin-top: 15px;
padding-bottom: 10px;
}
li {
a {
display: block;
padding: 13px 30px;
font-size: 15px;
color: #555;
text-decoration: none;
@include transition(all .2s linear);
&.active,
&:hover {
color: #6787DA;
}
i {
min-width: 30px;
&.ion-ios7-person-outline {
font-size: 30px;
position: relative;
top: 4px;
}
&.ion-ios7-email-outline {
font-size: 24px;
position: relative;
top: 4px;
}
&.ion-ios7-help-outline {
font-size: 24px;
position: relative;
top: 4px;
}
&.ion-card {
font-size: 21px;
position: relative;
top: 3px;
}
}
}
}
}
}
#panel {
top: 0;
position: relative;
width: 78%;
margin-left: 22%;
padding: 24px 50px;
padding-bottom: 80px;
@media (max-width: $maxMedium) {
width: 72%;
margin-left: 28%;
}
@media (max-width: $maxSmall) {
position: relative;
width: 100%;
margin-left: 0;
padding: 24px;
}
/* account-profile.html specific styles */
&.profile {
h3 {
margin: 0;
font-size: 18px;
}
.intro {
margin-top: 25px;
color: #555;
}
form {
width: 65%;
margin-top: 35px;
@media (max-width: $maxMedium) {
width: 100%;
}
.form-group {
margin-bottom: 25px;
}
.avatar-field {
position: relative;
left: -15px;
margin-bottom: 35px;
label {
margin-top: 22px;
color: #4F587A;
font-weight: 500;
margin-bottom: 10px;
}
}
.action {
margin-top: 40px;
}
}
}
/* account-billing specific styles */
&.billing {
h3 {
margin: 0;
font-size: 18px;
}
.plan {
margin-top: 40px;
.current-plan {
font-size: 15px;
label {
margin-right: 20px;
font-weight: 600;
}
.change-plan {
display: inline-block;
margin-left: 20px;
font-size: 14px;
.ion-edit {
margin-left: 5px;
font-size: 13px;
}
}
.status {
.value {
color: #3FA244;
font-weight: 600;
}
}
}
.current-cc {
position: relative;
margin-top: 35px;
padding-top: 35px;
padding-bottom: 40px;
font-size: 15px;
color: #444;
&:before {
content: '';
position: absolute;
top: 0;
height: 2px;
width: 100px;
background: #eee;
}
&:after {
content: '';
position: absolute;
bottom: 0;
height: 2px;
width: 100px;
background: #eee;
}
label {
margin-right: 20px;
font-weight: 600;
}
img {
max-width: 25px;
margin-right: 8px;
position: relative;
top: -2px;
}
.manage-cc {
display: inline-block;
margin-left: 20px;
font-size: 14px;
.ion-edit {
margin-left: 5px;
font-size: 13px;
}
}
.next {
font-size: 13px;
display: block;
margin-top: 4px;
}
}
.invoices {
margin-top: 40px;
h3 {
font-size: 17px;
font-weight: 600;
color: #555;
}
table {
margin-top: 25px;
tr:first-child {
td {
border-top: 0;
}
}
}
}
}
}
/* account-notifications specific styles */
&.notifications {
h3 {
margin: 0;
font-size: 18px;
}
.settings {
margin-top: 40px;
.digest {
h4 {
font-weight: 600;
font-size: 16px;
margin-bottom: 15px;
}
p {
width: 80%;
font-size: 13px;
}
}
.types {
margin-top: 40px;
h4 {
font-weight: 600;
font-size: 16px;
margin-bottom: 30px;
}
section {
margin-bottom: 30px;
.title {
text-transform: uppercase;
color: #999;
font-weight: normal;
display: block;
margin-bottom: 10px;
font-size: 15px;
}
.row {
margin-bottom: 5px;
@media (max-width: $maxSmall) {
margin-bottom: 15px;
}
}
.bootstrap-switch {
float: right;
font-family: $helvetica;
@media (max-width: $maxSmall) {
float: left;
margin-top: 5px;
}
.bootstrap-switch-default {
font-size: 13px;
}
}
}
}
.actions {
margin-top: 40px;
}
}
}
/* account-support specific styles */
&.support {
h3 {
margin: 0;
font-size: 18px;
}
.topics {
margin-top: 40px;
.topic {
margin-top: 30px;
i {
font-size: 36px;
/*color: #74A9E2;*/
color: #9696D1;
position: relative;
top: 2px;
&.ion-pie-graph {
font-size: 34px;
top: 4px;
}
&.ion-archive {
font-size: 37px;
}
}
a {
font-size: 16px;
color: #444;
font-weight: 600;
text-decoration: none;
}
p {
font-size: 15px;
margin-top: 3px;
color: #444;
}
}
}
}
}
}
}

63
css/partials/pages/_billing_form.scss
Unescape Escape View File

@ -0,0 +1,63 @@
#billing-form {
.billing {
max-width: 640px;
margin: 0 auto;
margin-top: 40px;
.secure {
margin-bottom: 20px;
.lock {
font-weight: 600;
color: #666;
.fa-lock {
color: #ccc;
font-size: 17px;
margin-right: 7px;
position: relative;
top: 1px;
}
}
}
#billing {
.control-label {
text-align: left;
}
.instructions {
margin-top: 40px;
strong {
font-size: 15px;
color: #454545;
}
}
.mobile-margin-bottom {
@media (max-width: $maxSmall) {
margin-bottom: 15px;
}
}
.action {
margin-top: 40px;
text-align: center;
.btn {
font-size: 16px;
padding: 10px 14px;
@include transition(all .2s linear);
i.fa-chevron-right {
font-size: 13px;
margin-left: 13px;
}
}
}
}
}
}

99
css/partials/pages/_calendar.scss
Unescape Escape View File

@ -0,0 +1,99 @@
#calendar {
.content-wrapper {
position: relative;
}
/* calendar-wrapper popup */
#new-event-popup {
position: absolute;
background: #fff;
text-align: left;
width: 300px;
border: 1px solid #CBD0D5;
box-shadow: 0px 2px 3px 0 rgba(0, 0, 0, 0.13);
border-radius: 4px;
padding: 14px 20px 14px 20px;
z-index: 999;
left: 194px;
top: 40px;
h5 {
text-transform: uppercase;
font-weight: 600;
margin: 0 0 21px 0;
font-size: 14px;
color: #7e91aa;
}
.field {
margin-bottom: 12px;
.date {
margin-left: 15px;
}
.event-input {
position: relative;
margin-left: 10px;
width: 75%;
display: inline-block;
}
}
input[type="submit"] {
float: right;
margin-right: 15px;
margin-top: 7px;
margin-bottom: 5px;
}
i.fa-times {
position: absolute;
right: 11px;
cursor: pointer;
top: 12px;
font-size: 13px;
color: #5B7683;
@include transition(all .1s linear);
&:hover {
color: #92A6AF;
}
}
.pointer {
position: absolute;
bottom: 0;
left: 46%;
.arrow,
.arrow_border {
border-color: #fff transparent transparent transparent;
border-width: 11px;
border-style: solid;
font-size: 0;
left: 50%;
line-height: 0;
margin: 0 auto;
position: absolute;
top: 0;
width: 0;
z-index: 1002;
left: 0;
margin-left: 45%;
}
.arrow_border {
border-color: #BABDC0 transparent transparent transparent;
border-width: 12px;
margin-left: -1px;
border-style: solid;
z-index: 1001;
top: 0px;
}
}
}
}

50
css/partials/pages/_datatables.scss
Unescape Escape View File

@ -0,0 +1,50 @@
#datatables {
.content-wrapper {
margin-top: 40px;
padding-bottom: 40px;
thead th {
border-top: 1px solid #dee3ea;
border-bottom: 1px solid #dee3ea;
padding: 10px 18px 15px 15px;
}
td {
padding: 11px 15px;
}
.dataTables_length {
float: right;
margin-bottom: 25px;
@media (max-width: $maxSmall) {
float: none;
}
}
.dataTables_filter {
float: left;
text-align: left;
@media (max-width: $maxSmall) {
float: none;
margin-bottom: 25px;
}
}
.dataTables_info {
display: none;
}
.dataTables_paginate {
float: none;
text-align: center;
margin-top: 70px;
}
#datatable-example {
}
}
}

309
css/partials/pages/_docs.scss
Unescape Escape View File

@ -0,0 +1,309 @@
#docs {
font-family: $helvetica;
#guide {
background: #F4F8FA;
border-right: 1px solid #DADFE5;
left: 0;
top: 0;
position: fixed;
overflow: hidden;
overflow-y: auto;
width: 210px;
z-index: 25;
height: 100%;
.logo {
margin-top: 0;
font-size: 29px;
a {
color: #000;
font-family: $myriad;
padding: 20px 0 15px 23px;
display: block;
border-bottom: 1px solid #D6DCE0;
box-shadow: 0px 1px #FFF;
@include transition(color .15s linear);
&:hover {
color: #858585;
text-decoration: none;
}
}
}
.menu {
> li {
&.active {
> .nav {
display: block;
}
> a {
background: #DEEAF1;
}
}
a {
color: #3391C9;
font-weight: 500;
font-size: 13px;
padding: 10px 15px 10px 25px;
@include transition(all .15s linear);
&:hover {
background: #DEEAF1;
}
}
> .nav {
margin-bottom: 7px;
display: none;
li {
a {
font-weight: 400;
color: #48A0D6;
padding: 6px 15px 5px 35px;
}
}
}
}
}
}
#api-docs {
background: #FFF;
margin-left: 210px;
min-width: 750px;
#methods {
background: #292E33;
position: relative;
margin-left: 50%;
.languages {
position: fixed;
top: 0;
width: 100%;
padding: 5px 0 5px 20px;
background: #3B4249;
box-shadow: 2px 1px 3px #000;
z-index: 999;
.language {
display: inline-block;
color: #C0CEDD;
padding: 5px 15px;
font-size: 13px;
&.selected {
color: #fff;
}
}
}
.method {
&:nth-child(2) {
.method-section {
.method-description {
padding-top: 0px;
border-top: 0px;
}
.method-example {
padding-top: 35px;
border-top: 0;
box-shadow: none;
}
}
}
&:last-child {
.method-section {
padding-bottom: 70px;
}
}
.method-section {
margin-left: -100%;
position: relative;
padding-top: 50px;
.method-description {
width: 50%;
float: left;
padding: 0 30px;
border-top: 1px solid #E5E7EB;
padding-top: 40px;
h3 {
font-size: 21px;
margin-top: 0;
margin-bottom: 20px;
}
p {
font-size: 13px;
color: #666;
line-height: 21px;
margin-bottom: 20px;
}
.info {
margin-top: 45px;
margin-bottom: 40px;
h4 {
font-size: 14px;
border-bottom: 1px solid #E4E4E4;
padding-bottom: 15px;
}
.field {
margin-top: 17px;
font-size: 13px;
.key {
width: 40%;
float: left;
text-align: right;
padding-right: 10px;
font-weight: bold;
color: #333;
}
.desc {
width: 60%;
float: right;
padding-left: 10px;
color: #555;
line-height: 21px;
strong {
display: block;
color: #333;
margin-bottom: 5px;
}
}
}
}
}
.method-example {
margin-left: 50%;
width: 50%;
padding: 75px 30px 0;
border-top: 1px solid #000;
box-shadow: inset 0px 1px rgba(255, 255, 255, 0.17);
color: #fff;
pre {
background: none;
border: none;
margin: 0;
padding: 0;
code {
background: none;
font-family: Monaco, Consolas, Menlo;
font-size: 12px;
display: none;
&.always-visible {
display: block !important;
}
&.ruby {
display: block;
}
color: #DAE4F2;
> * {
color: #DAE4F2;
line-height: 20px;
}
}
.ruby {
color: #DAE4F2;
> * {
color: #DAE4F2;
line-height: 20px;
}
[class*=keyword] {
color: #9AB4DB;
}
[class*=string] {
color: #DAD0C6;
}
[class*=comment] {
color: #B4B4B4;
}
[class*=constant] {
color: #FFDF9D;
}
[class*=symbol] {
color: #9ECBEE;
}
}
.python {
color: #DAE4F2;
> * {
color: #DAE4F2;
line-height: 20px;
}
[class*=keyword] {
color: #9AB4DB;
}
[class*=string] {
color: #DAD0C6;
}
[class*=comment] {
color: #B4B4B4;
}
[class*=class] {
color: #FFDF9D;
}
[class*=params] {
color: #9ECBEE;
}
}
.php {
color: #DAE4F2;
> * {
color: #DAE4F2;
line-height: 20px;
}
[class*=keyword] {
color: #9AB4DB;
}
[class*=string] {
color: #DAD0C6;
}
[class*=comment] {
color: #B4B4B4;
}
}
}
}
}
}
}
}
}

53
css/partials/pages/_email_templates.scss
Unescape Escape View File

@ -0,0 +1,53 @@
#email-templates {
.header {
margin-top: 10px;
font-size: 18px;
margin-bottom: 50px;
}
.emails {
text-align: center;
.email {
display: inline-block;
position: relative;
margin-right: 45px;
margin-bottom: 55px;
&:hover {
i {
opacity: 1;
}
}
.name {
font-size: 19px;
margin-top: 10px;
text-align: center;
}
i {
font-size: 35px;
position: absolute;
left: calc(50% - 9px);
top: calc(50% - 40px);
color: #AE92D1;
opacity: 0;
cursor: pointer;
@include transition(all .2s linear);
}
.wrapper {
border: 1px solid #eee;
}
img {
max-height: 345px;
cursor: pointer;
}
}
}
}

41
css/partials/pages/_form.scss
Unescape Escape View File

@ -0,0 +1,41 @@
#form {
#content {
form {
margin-top: 35px;
input[type="file"] {
position: relative;
top: 7px;
height: 40px;
}
.address {
margin: 25px 0;
.form-group {
.col-sm-3 {
@media (max-width: $maxSmall) {
margin-bottom: 15px;
}
}
}
}
.form-control-feedback {
color: #60B5EE;
font-size: 19px;
}
.form-actions {
margin-top: 35px;
.btn {
margin-right: 15px;
}
}
}
}
}

112
css/partials/pages/_form_product.scss
Unescape Escape View File

@ -0,0 +1,112 @@
#form-product {
form {
margin-top: 35px;
margin-bottom: 80px;
input[type="file"] {
position: relative;
top: 7px;
height: 40px;
}
.fake-select-wrap {
width: 250px;
margin-bottom: 8px;
}
.help {
position: relative;
top: -6px;
left: 5px;
.fa-question-circle {
color: #959595;
}
}
.well {
.pic {
margin-bottom: 15px;
img {
max-width: 300px;
}
}
.remove-image {
display: inline-block;
margin-top: 15px;
}
}
/* rating plugin */
#raty {
margin-top: 6px;
margin-bottom: 8px;
}
/* datepicker input */
input.datepicker {
display: inline-block;
margin-right: 10px;
width: 150px;
color: #555;
padding-left: 15px;
}
/* colorpicker input */
div.minicolors {
width: 250px;
margin-bottom: 10px;
}
.fa-calendar {
color: #789BCE;
}
.form-control-feedback {
color: #60B5EE;
font-size: 19px;
}
.form-actions {
margin-top: 55px;
.btn {
margin-right: 15px;
}
}
}
/* Description summernote plugin editor */
.note-editor {
border: 1px solid #ccc;
border-radius: 4px;
.note-toolbar {
border-radius: 4px 4px 0 0;
background: #FAFCFF;
border-bottom: 1px solid #ccc;
.btn-default {
box-shadow: none;
}
}
.note-statusbar {
border-radius: 0 0 4px 4px;
background: #FAFCFF;
.note-resizebar {
border-top: 1px solid #ccc;
.note-icon-bar {
width: 17px;
border-top: 1px solid #C9C9C9;
}
}
}
}
}

137
css/partials/pages/_gallery.scss
Unescape Escape View File

@ -0,0 +1,137 @@
#gallery {
#content {
padding: 0;
padding-top: 65px;
min-height: inherit;
padding-bottom: 55px;
.content-wrapper {
margin-top: 0;
}
}
.gallery-wrapper {
overflow: hidden;
.image {
width: 25%;
height: 190px;
position: relative;
background-size: cover;
display: inline-block;
float: left;
@include transition(all .15s ease-out);
@media (max-width: $maxMedium) {
height: 150px;
}
@media (max-width: $maxSmall) {
height: 130px;
width: 33.3333%;
}
&:hover {
z-index: 2;
&:after {
background: transparent;
}
.mask {
opacity: 1;
}
}
.mask {
position: absolute;
left: 0;
right: 0;
bottom: 0;
top: 0;
opacity: 0;
background: rgba(106, 101, 161, 0.87);
@include transition(all .2s ease-in);
.name {
color: #fff;
font-size: 18px;
text-align: center;
font-weight: 600;
margin-top: 25%;
@media (max-width: $maxMedium) {
font-size: 15px;
}
}
.date {
color: #fff;
font-size: 16px;
text-align: center;
margin-top: 3px;
@media (max-width: $maxMedium) {
font-size: 14px;
}
}
}
}
}
.filter {
position: fixed;
z-index: 99999;
left: 230px;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.85);
padding: 18px 30px;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.21);
border-top: 1px solid #000;
font-size: 13px;
@media (max-width: $maxMedium) {
left: 80px;
}
@media (max-width: $maxSmall) {
left: 0;
padding: 15px;
}
span {
color: #fff;
margin-right: 20px;
text-transform: uppercase;
font-weight: 600;
@media (max-width: $maxSmall) {
display: none;
}
}
a {
color: #fff;
text-transform: uppercase;
margin-right: 8px;
font-weight: 600;
padding: 4px 13px;
@media (max-width: $maxSmall) {
text-transform: capitalize;
}
&.active {
background: #6a65a1;
border-radius: 20px;
}
}
}
}

227
css/partials/pages/_index.scss
Unescape Escape View File

@ -0,0 +1,227 @@
#dashboard {
.menubar {
.period-select {
float: right;
min-width: 350px;
position: relative;
top: -3px;
.input-group {
width: 150px;
float: left;
.input-group-addon {
background: #F0F4F8;
}
i {
font-size: 14px;
color: #577FC7;
position: relative;
top: 1px;
}
input[type="text"] {
height: 31px;
line-height: 18px;
font-size: 14px;
color: #777;
}
}
p {
position: relative;
top: 4px;
margin: 0 12px;
}
}
}
.metrics {
margin-top: 30px;
font-family: $helvetica;
border: 1px solid #000;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.3);
background-color: #363e4a;
background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #303d4f), color-stop(100%, #435266)),#686e78;
background: -webkit-linear-gradient(#303d4f,#435266),#686e78;
background: -moz-linear-gradient(#303d4f,#435266),#686e78;
background: -o-linear-gradient(#303d4f,#435266),#686e78;
background: linear-gradient(#303d4f,#435266),#686e78;
border-radius: 5px;
.metric {
float: left;
width: 25%;
padding: 23px 0;
text-align: center;
border-right: 1px solid #526075;
@media(max-width: $maxSmall) {
width: 50%;
}
.field {
color: #f4f4f4;
margin-bottom: 9px;
display: inline-block;
font-size: 14px;
@media (max-width: $maxMedium) {
font-size: 14px;
}
}
.data {
display: block;
color: #fff;
font-size: 27px;
text-shadow: 1px 1px #000;
@media (max-width: $maxMedium) {
font-size: 21px;
}
}
}
}
.chart {
margin: 40px 0 70px;
background: #fff;
border: 1px solid #DFE3EB;
padding: 25px 25px;
border-radius: 5px;
box-shadow: inset 0 1px 0 #ededed;
h3 {
font-size: 18px;
margin-bottom: 25px;
font-weight: 600;
margin-top: 0px;
.total {
font-size: 14px;
position: relative;
top: 6px;
left: -8px;
color: #2D96BE;
.change {
display: inline-block;
border-radius: 3px;
padding: 2px 5px;
margin-left: 7px;
font-size: 13px;
&.up {
color: #3fb83f;
i {
color: #3fb83f;
}
}
&.down {
color: #CC4C4C;
i {
color: #CC4C4C;
}
}
i {
font-size: 11px;
position: relative;
top: -1px;
}
}
}
}
#visitors-chart {
height: 230px;
position: relative;
}
}
.charts-half {
margin-top: 50px;
.chart {
width: 48%;
margin-top: 0;
@media (max-width: $maxMedium) {
width: 100%;
}
#payments-chart {
height: 200px;
position: relative;
}
#signups-chart {
height: 200px;
position: relative;
}
}
}
.barchart {
margin-bottom: 70px;
h3 {
font-size: 18px;
margin-bottom: 25px;
font-weight: 600;
margin-top: 0;
}
#bar-chart {
height: 200px;
width: 99%;
padding-right: 10px !important;
}
}
.referrals {
padding-left: 15px;
h3 {
font-size: 18px;
margin-bottom: 25px;
font-weight: 600;
margin-top: 0;
}
.referral {
span {
color: #444;
.data {
font-weight: 600;
margin-right: 5px;
border-right: 1px solid #e0e0e0;
padding-right: 7px;
}
}
.progress {
margin-top: 5px;
height: 4px;
background: #f0f0f0;
box-shadow: none;
.progress-bar {
background: #a5d15f;
}
}
}
}
}

251
css/partials/pages/_invoice.scss
Unescape Escape View File

@ -0,0 +1,251 @@
#invoice {
#content {
padding: 40px 80px;
@media (max-width: $maxMedium) {
padding: 40px;
}
@media (max-width: $maxSmall) {
padding: 20px;
}
.menubar {
padding: 20px 80px;
@media (max-width: $maxMedium) {
padding: 20px 40px;
}
@media (max-width: $maxSmall) {
padding: 20px;
}
.options {
a {
margin-left: 25px;
color: #96AEC4;
text-decoration: none;
@include transition(all .2s linear);
@media (max-width: $maxSmall) {
position: relative;
top: 4px;
margin-left: 10px;
i {
display: none;
}
}
&:hover {
color: #344D63;
}
i {
margin-right: 3px;
}
}
}
}
}
.page-title {
padding-left: 10px;
strong {
margin-left: 6px;
}
}
.invoice-wrapper {
background: #FFF;
margin-top: 60px;
padding: 0 10px;
border-radius: 4px;
margin-bottom: 40px;
font-size: 15px;
.intro {
line-height: 25px;
color: #444;
position: relative;
.status {
position: absolute;
top: 0;
right: 0;
border: 2px solid rgb(155, 201, 112);
padding: 1px 12px;
border-radius: 4px;
color: rgb(107, 173, 44);
text-transform: uppercase;
font-weight: 600;
letter-spacing: 1.5px;
font-size: 16px;
}
}
.payment-info {
margin-top: 25px;
padding-top: 15px;
span {
color: #7C8594;
}
strong {
display: block;
color: #444;
margin-top: 3px;
}
@media(max-width: 767px) {
.text-right {
text-align: left;
margin-top: 20px;
}
}
}
.payment-details {
border-top: 2px solid #EBECEE;
margin-top: 30px;
padding-top: 20px;
line-height: 22px;
span {
color: #7C8594;
display: block;
}
a {
display: inline-block;
margin-top: 5px;
}
@media(max-width: 767px) {
.text-right {
text-align: left;
margin-top: 20px;
}
}
}
.line-items {
margin-top: 40px;
.headers {
color: #7C8594;
font-size: 14px;
letter-spacing: .3px;
border-bottom: 2px solid #EBECEE;
padding-bottom: 4px;
}
.items {
margin-top: 8px;
border-bottom: 2px solid #EBECEE;
padding-bottom: 8px;
.item {
padding: 10px 0;
color: #696969;
@media(max-width: 767px) {
font-size: 13px;
}
.amount {
letter-spacing: 0.1px;
color: #84868A;
font-size: 16px;
@media(max-width: 767px) {
font-size: 13px;
}
}
}
}
.total {
margin-top: 30px;
.extra-notes {
float: left;
width: 40%;
text-align: left;
color: #7A7A7A;
line-height: 20px;
@media(max-width: 767px) {
width: 100%;
margin-bottom: 30px;
float: none;
}
strong {
display: block;
margin-bottom: 5px;
color: #454545;
}
}
.field {
margin-bottom: 7px;
font-size: 14px;
color: #555;
&.grand-total {
margin-top: 10px;
font-size: 17px;
font-weight: 500;
span {
color: #20A720;
font-size: 22px;
font-weight: 600;
}
}
span {
display: inline-block;
margin-left: 20px;
min-width: 85px;
color: #84868A;
font-size: 15px;
}
}
}
.print {
margin-top: 50px;
text-align: center;
a {
display: inline-block;
border: 1px solid #9CB5D6;
padding: 13px 13px;
border-radius: 5px;
color: #708DC0;
font-size: 14px;
@include transition(all .2s linear);
&:hover {
text-decoration: none;
border-color: #333;
color: #333;
}
i {
margin-right: 3px;
font-size: 14px;
}
}
}
}
}
}

242
css/partials/pages/_latest_activity.scss
Unescape Escape View File

@ -0,0 +1,242 @@
#latest-activity {
.content-wrapper {
margin-bottom: 40px;
}
.filter-user {
float: right;
@media (max-width: $maxSmall) {
float: none;
}
.dropdown-menu {
right: 0;
left: auto;
@media (max-width: $maxSmall) {
left: 0;
right: auto;
}
}
}
h3 {
margin-top: 30px;
margin-bottom: 40px;
font-size: 22px;
small {
margin-left: 15px;
}
}
.moment {
width: 100%;
padding-bottom: 50px;
position: relative;
&.first {
&:before {
height: 130%;
top: -20px;
}
&:after {
content: '';
position: absolute;
left: 23px;
top: -20px;
width: 7px;
height: 7px;
background: #eee;
border-radius: 50%;
@media (max-width: $maxMedium) {
left: 16px;
}
@media (max-width: $maxMedium) {
display: none;
}
}
}
&.last {
&:before {
background: #fff;
}
}
&:before {
content: '';
position: absolute;
left: 25px;
top: 5px;
width: 3px;
height: 100%;
background: #eee;
@media (max-width: $maxMedium) {
left: 18px;
}
@media (max-width: $maxMedium) {
display: none;
}
}
.icon {
background: #90C7EC;
width: 35px;
height: 35px;
border-radius: 50%;
position: absolute;
left: 24px;
top: 4px;
@media (max-width: $maxMedium) {
left: 17px;
}
&.violet {
background: #E25495;
}
&.yellow {
background: #EBC77B;
}
&.dark {
background: #515C6E;
}
&.purple {
background: #816DB4;
}
.fa {
color: #fff;
position: absolute;
&.fa-comment {
top: 10px;
left: 11px;
}
&.fa-upload {
left: 11px;
top: 10px;
}
&.fa-check {
top: 10px;
left: 10px;
}
&.fa-files-o {
top: 10px;
left: 9px;
font-size: 17px;
}
&.fa-quote-left {
top: 10px;
left: 11px;
}
}
}
.message {
.avatar {
max-width: 53px;
border-radius: 5px;
float: left;
margin-right: 25px;
@media (max-width: $maxSmall) {
margin-bottom: 10px;
}
}
.content {
float: left;
width: 80%;
@media (max-width: $maxSmall) {
width: 100%;
}
p {
margin-top: 15px;
color: #555;
&.border-bottom {
border-bottom: 1px solid #ECECEC;
padding-bottom: 20px;
}
.date {
display: block;
color: #8F8F8F;
margin-bottom: 6px;
font-size: 13px;
}
}
.files {
margin-top: 20px;
display: table;
.file {
display: table-cell;
padding-right: 25px;
max-width: 190px;
vertical-align: top;
text-align: center;
img {
border-radius: 3px;
}
.name {
display: inline-block;
margin-top: 11px;
line-height: 17px;
font-size: 13px;
}
}
}
.big-file {
margin-top: 20px;
padding: 10px;
border: 1px solid #ECECEC;
border-radius: 4px;
img {
float: left;
max-width: 50px;
margin-right: 20px;
border: 1px solid #ECECEC;
padding: 5px;
border-radius: 4px;
}
.name {
display: inline-block;
font-weight: 600;
margin-top: 5px;
color: #333;
}
.size {
color: #A7A7A7;
}
}
}
}
}
}

284
css/partials/pages/_pricing.scss
Unescape Escape View File

@ -0,0 +1,284 @@
#pricing {
#content {
min-height: 850px;
}
.pricing-wizard {
h4 {
margin-top: 40px;
font-weight: 500;
text-transform: uppercase;
letter-spacing: .5px;
text-align: center;
font-size: 21px;
color: #59646F;
}
.steps {
width: 660px;
margin: 0 auto;
margin-top: 55px;
border-bottom: 1px solid #ECECEC;
padding-bottom: 15px;
.step {
display: inline-block;
font-size: 14px;
text-transform: uppercase;
font-weight: 600;
color: #ABBBC7;
position: relative;
padding-left: 50px;
margin-right: 40px;
@include transition(all .2s linear);
&.active {
color: #5A6A81;
&:after {
content: '';
height: 2px;
width: 100%;
background: #5D8DB9;
position: absolute;
top: 35px;
left: 25px;
}
}
}
}
.step-panel {
position: absolute;
left: 0;
right: 0;
z-index: 1;
opacity: 0;
@include transition(all .2s linear);
@media (max-width: $maxSmall) {
position: relative;
display: none;
&.active {
display: block;
}
}
&.active {
opacity: 1;
z-index: 2;
}
}
.choose-plan {
max-width: 640px;
margin: 0 auto;
margin-top: 40px;
.instructions {
color: #444;
padding-bottom: 20px;
padding-left: 10px;
strong {
font-size: 15px;
color: #555;
}
span {
font-weight: 600;
display: block;
margin-top: 30px;
color: #929191;
border-bottom: 1px solid #E6E6E6;
padding-bottom: 15px;
}
}
.plans {
.plan {
margin-top: 5px;
position: relative;
padding: 12px 0;
border-radius: 5px;
cursor: pointer;
@include transition(all .15s linear);
@media (max-width: $maxSmall) {
padding: 12px 8px;
}
&.selected {
.select {
.fa-check {
display: inline-block;
}
}
}
&.selected,
&:hover {
background: #ebf2fb;
.price {
color: #458EDB;
}
.info {
.details {
color: #73ACE9;
}
}
.select {
border: 2px solid #8FC4FD;
}
}
.price {
float: left;
width: 115px;
padding-left: 10px;
font-size: 20px;
position: relative;
top: 4px;
color: #81838A;
@media (max-width: $maxSmall) {
font-size: 17px;
float: none;
padding-left: 0;
top: 0;
margin-bottom: 5px;
}
}
.info {
float: left;
width: 260px;
.name {
font-size: 17px;
font-weight: 600;
color: #3e95f1;
}
.details {
color: #888;
}
}
.select {
position: absolute;
right: 10px;
top: 18px;
width: 27px;
height: 27px;
border-radius: 25px;
border: 2px solid #ccc;
.fa-check {
position: relative;
top: 2px;
left: 4px;
color: #057DFF;
display: none;
}
}
}
.action {
text-align: right;
margin-top: 40px;
@media (max-width: $maxSmall) {
text-align: center;
}
.btn {
font-size: 17px;
i {
font-size: 13px;
margin-left: 7px;
}
}
}
}
}
.billing {
max-width: 640px;
margin: 0 auto;
margin-top: 40px;
.secure {
margin-bottom: 20px;
.lock {
font-weight: 600;
color: #666;
.fa-lock {
color: #ccc;
font-size: 17px;
margin-right: 7px;
position: relative;
top: 1px;
}
}
}
#billing-form {
.control-label {
text-align: left;
}
.instructions {
margin-top: 40px;
strong {
font-size: 15px;
color: #454545;
}
}
.mobile-margin-bottom {
@media (max-width: $maxSmall) {
margin-bottom: 15px;
}
}
.action {
margin-top: 40px;
.btn {
font-size: 16px;
@include transition(all .2s linear);
i.fa-chevron-right {
font-size: 13px;
margin-left: 7px;
}
i.fa-chevron-left {
font-size: 13px;
margin-right: 7px;
color: #777;
}
}
}
}
}
}
}

263
css/partials/pages/_pricing_alt.scss
Unescape Escape View File

@ -0,0 +1,263 @@
#pricing-alt {
#content {
padding: 40px;
.content-wrapper {
margin-top: 0;
}
}
.sidebar-toggler {
position: absolute;
font-size: 37px;
padding: 12px;
top: 0;
left: 8px;
cursor: pointer;
}
#first-option {
margin-bottom: 100px;
.header {
text-align: center;
h3 {
font-size: 24px;
color: #444;
line-height: 25px;
font-weight: 500;
margin-bottom: 7px;
}
p {
font-size: 16px;
font-weight: 400;
color: #888;
}
}
.charts {
margin-top: 45px;
.chart {
background-color: #fff;
border: 1px solid #D8D8D8;
border-radius: 5px;
box-shadow: 0px 0px 2px 0px rgba(181, 181, 181, 0.3);
padding: 20px 40px 30px;
position: relative;
text-align: center;
width: 97%;
min-height: 315px;
position: relative;
top: 18px;
@media(min-width: 992px) {
&.first {
float: right;
left: 45px;
}
&.last {
left: -45px;
}
}
@media (max-width: 991px) {
float: none !important;
left: 0px !important;
top: 0px !important;
margin: 0 auto;
width: 55%;
margin-bottom: 25px !important;
&.last {
margin-bottom: 0px !important;
}
}
@media (max-width: 600px) {
width: 90% !important;
}
&.featured {
z-index: 999;
border-color: #C3DCEB;
box-shadow: 0 0 13px -2px #B4DAF1;
@media(min-width: 992px) {
margin: 0 auto;
top: 5px;
min-height: 450px;
}
.popular {
position: absolute;
top: 0px;
left: 0px;
}
.quantity {
margin-top: 15px;
padding-bottom: 5px;
}
.button {
margin-top: 22px;
}
}
.plan-name {
text-align: center;
font-size: 20px;
font-weight: 400;
color: #444;
width: 90%;
margin: 0 auto;
margin-top: 5px;
}
.quantity {
text-align: center;
border-bottom: 1px solid #d5d5d5;
margin-top: 10px;
.dollar {
font-size: 19px;
position: relative;
top: -18px;
}
.price {
font-size: 49px;
}
.period {
font-size: 17px;
position: relative;
top: -8px;
margin-left: 4px;
}
}
.specs {
margin-top: 20px;
.spec {
font-size: 15px;
color: #5D636D;
text-align: center;
margin-bottom: 15px;
.variable {
color: #1FAFE7;
font-weight: 600;
}
}
}
.button {
margin-top: 20px;
height: 38px;
span {
height: 36px;
line-height: 35px;
padding-left: 23px;
padding-right: 23px;
}
}
}
}
.message {
p {
text-align: center;
color: #4A5366;
margin-top: 23px;
}
}
.faq {
margin-top: 40px;
.header h3 {
font-size: 22px;
color: #454545;
text-align: left;
}
.questions {
margin-top: 30px;
.question {
margin-bottom: 45px;
@media(min-width: 992px) {
width: 90%;
}
strong {
font-weight: 500;
font-size: 17px;
color: #333;
}
p {
color: #555;
margin-top: 12px;
font-size: 14px;
line-height: 22px;
}
}
}
}
.contact {
margin-top: 40px;
.wrapper {
background: #F7F8FB;
border: 1px solid #EAEDF7;
border-radius: 8px;
padding: 25px 60px;
box-shadow: inset rgba(100, 100, 100, 0.25) 0 1px 1px;
margin: 0 auto;
@media (max-width: $maxSmall) {
padding: 20px;
}
}
h4 {
font-size: 15px;
position: relative;
color: #373F46;
text-align: center;
font-weight: 500;
text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.8);
@media (max-width: 991px) {
line-height: 26px;
}
span {
position: relative;
font-size: 23px;
top: 4px;
margin-right: 4px;
color: #626E7A;
@media (max-width: 991px) {
position: relative;
left: 0px;
top: 5px;
}
}
}
}
}
}

173
css/partials/pages/_projects.scss
Unescape Escape View File

@ -0,0 +1,173 @@
#projects {
.project-list {
margin-top: 20px;
}
.project {
float: left;
width: 30%;
margin: 0 10px;
margin-bottom: 25px;
padding: 13px;
border: 1px solid #E4EAF1;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
border-radius: 5px;
min-height: 227px;
position: relative;
@media (max-width: $maxMedium) {
width: 43%;
}
@media (max-width: $maxSmall) {
width: 94%;
}
&.new {
border: 2px dotted #BEDAF8;
box-shadow: none;
a {
display: block;
text-align: center;
text-decoration: none;
}
i {
font-size: 60px;
color: #C4DEF8;
margin-top: 40px;
display: block;
}
.info {
display: inline-block;
font-size: 21px;
color: #9AC0E7;
padding-top: 10px;
}
}
.info {
padding: 20px 0 30px;
text-align: center;
.name {
font-size: 20px;
color: #8C5DAC;
color: #5D93AC;
font-weight: 600;
}
.category {
font-weight: 600;
color: #444;
}
.last-update {
font-size: 13px;
color: #8C939E;
margin-top: 7px;
}
}
.members {
position: absolute;
bottom: 13px;
width: 91%;
img {
margin: 0 3px 4px 3px;
max-width: 38px;
border-radius: 50%;
}
.add-more {
display: inline-block;
width: 20px;
height: 20px;
background: #22B92E;
text-align: center;
float: right;
margin-top: 12px;
color: #fff;
border-radius: 3px;
font-size: 10px;
line-height: 22px;
@include transition(all .15s linear);
&:hover {
background: #8BDBA1;
}
}
.menu {
position: absolute;
right: -70px;
bottom: 26px;
background: #fff;
width: 155px;
z-index: 999;
border-radius: 3px;
padding: 7px 0;
list-style-type: none;
box-shadow: 0px 3px 11px rgba(0, 0, 0, 0.35);
opacity: 0;
@include transform(scale(0));
@include transition(all 300ms cubic-bezier(0.34,1.61,0.7,1));
@include transform-origin(50% 100%);
&.active {
opacity: 1;
@include transform(scale(1));
}
&:hover {
opacity: 1;
@include transform(scale(1));
}
&:after {
content: "";
position: absolute;
display: block;
width: 37px;
height: 12px;
bottom: -12px;
left: 49%;
margin-left: -18.5px;
background-image: url("#{$imagesPath}/popover-arrow.png");
background-size: 100% 100%;
@include transform(rotateX(180deg));
}
li {
padding: 8px 0;
border-bottom: 1px solid #E6E6E6;
text-align: center;
&:last-child {
border-bottom: 0;
}
a {
text-decoration: none;
display: block;
font-weight: 600;
color: #54A0E2;
@include transition(all .2s linear);
&:hover {
color: #333;
}
}
}
}
}
}
}

155
css/partials/pages/_reports.scss
Unescape Escape View File

@ -0,0 +1,155 @@
#reports {
.menubar {
.options {
a {
margin-left: 25px;
color: #96AEC4;
text-decoration: none;
@include transition(all .2s linear);
@media (max-width: $maxSmall) {
position: relative;
top: 4px;
}
&:hover {
color: #344D63;
}
i {
margin-right: 3px;
@media (max-width: $maxSmall) {
display: none;
}
}
}
}
}
.stats {
margin: 0 -40px;
margin-top: -24px;
padding: 26px 40px 29px;
background: #FAFBFD;
border-top: 3px solid #ADBDD5;
border-bottom: 1px solid #E2E4F5;
@media (max-width: $maxSmall) {
margin-left: -20px;
margin-right: -20px;
padding-bottom: 15px;
}
.stat {
float: left;
width: 25%;
@media (max-width: $maxSmall) {
width: 50%;
margin-bottom: 20px;
}
label {
font-weight: normal;
color: rgba(147, 156, 190, 1);
}
.value {
font-size: 21px;
font-weight: 600;
color: #454545;
text-shadow: 1px 1px #fff;
.change {
display: inline-block;
margin-left: 10px;
font-size: 13px;
&.up {
color: rgb(72, 180, 63);
}
&.down {
color: rgb(221, 94, 94);
}
i {
font-size: 16px;
position: relative;
top: 1px;
}
}
}
}
}
.chart {
margin-top: 35px;
h3 {
font-size: 19px;
.btn-group {
.btn {
border-color: #B7D5F5;
background: #fff;
color: #555F8A;
&.active {
background: #F9FBFF;
box-shadow: inset 0 2px 4px rgba(0,0,0,.125);
}
}
}
}
#sales-chart {
height: 230px;
margin-top: 30px;
}
}
.dataTables_wrapper {
margin: 80px -40px;
@media (max-width: $maxSmall) {
margin: 80px -20px;
}
thead th {
border-top: 1px solid #D4DBE4;
border-bottom: 1px solid #dee3ea;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.79);
padding: 10px 18px 12px 20px;
text-shadow: 1px 1px #fff;
background: linear-gradient(#F7F8FC, #F8F9FC);
position: relative;
color: #444;
&:after {
content: '';
position: absolute;
width: 100%;
height: 1px;
left: 0;
bottom: -1px;
box-shadow: 0 1px 1px rgba(66, 85, 124, 0.14);
}
}
td {
padding: 11px 20px;
}
.dataTables_filter,
.dataTables_length,
.dataTables_paginate,
.dataTables_info {
display: none;
}
}
}

145
css/partials/pages/_reports_alt.scss
Unescape Escape View File

@ -0,0 +1,145 @@
#reports-alt {
.menubar {
.options {
a {
position: relative;
top: 2px;
margin-left: 20px;
color: #96AEC4;
text-decoration: none;
@include transition(all .2s linear);
@media (max-width: $maxSmall) {
margin-left: 10px;
}
&:hover {
color: #344D63;
}
i {
margin-right: 3px;
}
}
}
.date-range {
margin-right: 20px;
.input-group {
width: 200px;
position: relative;
top: -3px;
.input-group-addon {
background: #F0F4F8;
}
i {
font-size: 14px;
color: #577FC7;
position: relative;
top: 1px;
}
input[type="text"] {
height: 31px;
line-height: 18px;
font-size: 14px;
color: #777;
}
}
}
}
.daterangepicker_start_input,
.daterangepicker_end_input {
display: none;
}
.chart {
position: relative;
top: -24px;
padding-top: 30px;
margin: 0 -40px;
padding: 30px 30px 0px;
background: #fafafa;
border-bottom: 1px solid #ccc;
@media (max-width: $maxSmall) {
margin: 0 -20px;
}
.bar-chart-wrapper {
overflow: hidden;
#bar-chart {
height: 240px;
padding: 0px;
position: relative;
top: 26px;
}
}
label.yaxis {
text-align: center;
text-transform: uppercase;
color: #969696;
display: block;
margin-top: 12px;
position: absolute;
left: 0;
right: 0;
font-weight: 600;
font-size: 13px;
}
}
.filters {
margin-top: 40px;
.btn {
background: #FAFDFF;
color: #4C89B6;
.caret {
margin-left: 5px;
}
}
}
.data {
margin-top: 20px;
margin-bottom: 50px;
thead th {
border-top: 1px solid #dee3ea;
border-bottom: 1px solid #dee3ea;
padding: 10px 18px 15px 15px;
}
td {
padding: 11px 15px;
}
.dataTables_length {
display: none;
}
.dataTables_filter {
display: none;
}
.dataTables_info {
display: none;
}
.dataTables_paginate {
float: none;
text-align: center;
margin-top: 70px;
}
}
}

222
css/partials/pages/_search.scss
Unescape Escape View File

@ -0,0 +1,222 @@
#search {
#content {
padding: 0;
padding-top: 64px;
min-height: 100%;
}
.menubar {
.options {
@media(max-width: $maxSmall) {
display: none;
}
a {
margin-left: 25px;
color: #96AEC4;
text-decoration: none;
@include transition(all .2s linear);
&:hover {
color: #344D63;
}
i {
margin-right: 3px;
}
}
}
}
.content-wrapper {
margin-top: 0;
position: relative;
overflow: hidden;
@media(max-width: $maxSmall) {
overflow: auto;
}
.results {
position: relative;
float: left;
width: 77%;
height: 100%;
min-height: 800px;
padding: 30px;
padding-bottom: 80px;
@media(max-width: $maxSmall) {
width: 100%;
padding: 10px;
padding-bottom: 60px;
margin-top: 30px;
}
/* bulk actions */
.bulk-actions {
position: absolute;
left: 30px;
z-index: 99;
@media(max-width: $maxSmall) {
position: relative;
left: 0px;
}
.btn.disabled {
border-color: #E2E2E2;
color: #969696;
}
}
/* datatable styles */
thead th {
border-top: 1px solid #D4DBE4;
border-bottom: 1px solid #dee3ea;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.79);
padding: 10px 18px 12px 20px;
text-shadow: 1px 1px #fff;
background: linear-gradient(#F7F8FC, #F8F9FC);
position: relative;
color: #444;
&:after {
content: '';
position: absolute;
width: 100%;
height: 1px;
/* background: #000; */
left: 0;
bottom: -1px;
box-shadow: 0 1px 1px rgba(66, 85, 124, 0.14);
}
}
td {
padding: 11px 20px;
}
.dataTables_length,
.dataTables_info {
display: none;
}
.dataTables_filter {
float: right;
text-align: left;
margin-bottom: 20px;
@media(max-width: $maxSmall) {
float: left;
margin-top: 20px;
}
}
.dataTables_paginate {
float: none;
text-align: center;
margin-top: 70px;
}
input[type="checkbox"] {
cursor: pointer;
}
/* product list styles */
.product-img {
max-width: 100px;
}
}
/* filters */
.filters {
position: absolute;
top: 0;
bottom: 0;
right: 0;
width: 23%;
border-left: 1px solid #E8EBF0;
@media(max-width: $maxSmall) {
position: relative;
width: 100%;
margin-top: 20px;
}
h3 {
padding: 0 20px;
margin: 20px 0;
font-size: 17px;
margin-bottom: 25px;
text-align: center;
}
.filter {
border-bottom: 1px solid #eee;
margin-bottom: 9px;
label {
display: block;
color: #454545;
font-weight: 600;
padding: 0 20px 5px;
input {
margin-right: 3px;
position: relative;
top: -1px;
}
}
.filter-option {
display: none;
padding: 10px 20px 12px;
background: rgba(0,0,0,0.02);
position: relative;
box-shadow: inset 0 1px 0 rgba(0,0,0,0.04);
.field {
margin-top: 15px;
input[type="text"] {
display: inline-block;
margin-right: 10px;
width: 100px;
height: 29px;
&.small {
width: 60px;
}
&.datepicker {
color: #555;
}
}
.fa-calendar {
color: #B3B3B3;
margin-right: 5px;
}
}
}
}
input[type="submit"] {
margin-top: 15px;
margin-left: 20px;
}
}
}
}

Some files were not shown because too many files have changed in this diff Show More

Write Preview
Loading…
Cancel
Save