Merge branch 'lugovsky-feature' into v2

pull/3/head
Vladimir Lugovsky 2016-01-06 16:22:35 +03:00
commit 7826b4c679
52 changed files with 796 additions and 405 deletions

View File

@ -1,8 +1,10 @@
<div class="widgets"> <div class="widgets">
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6"
<blur-panel title="Basic" class-container="with-scroll"> ba-panel
ba-panel-title="Basic"
ba-panel-class="with-scroll">
<div> <div>
<div class="alert bg-success"> <div class="alert bg-success">
<strong>Well done!</strong> You successfully read this important alert message. <strong>Well done!</strong> You successfully read this important alert message.
@ -17,11 +19,12 @@
<strong>Oh snap!</strong> Change a few things up and try submitting again. <strong>Oh snap!</strong> Change a few things up and try submitting again.
</div> </div>
</div> </div>
</blur-panel>
</div> </div>
<div class="col-md-6"> <div class="col-md-6"
<blur-panel title="Dismissible alerts" class-container="with-scroll"> ba-panel
ba-panel-title="Dismissible alerts"
ba-panel-class="with-scroll">
<div> <div>
<div class="alert bg-success closeable" role="alert"><button type="button" class="close" aria-label="Close"><span aria-hidden="true">&times;</span></button> <div class="alert bg-success closeable" role="alert"><button type="button" class="close" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<strong>Well done!</strong> You successfully read this important alert message. <strong>Well done!</strong> You successfully read this important alert message.
@ -36,15 +39,16 @@
<strong>Oh snap!</strong> Change a few things up and try submitting again. <strong>Oh snap!</strong> Change a few things up and try submitting again.
</div> </div>
</div> </div>
</blur-panel>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6"
<blur-panel title="Links in alerts" class-container="with-scroll"> ba-panel
ba-panel-title="Links in alerts"
ba-panel-class="with-scroll">
<div> <div>
<div class="alert bg-success"> <div class="alert bg-success">
<strong>Well done!</strong> You successfully read <a href class="alert-link">this important alert message</a>. <strong>Well done!</strong> You successfully read <a href class="alert-link">this important alert message</a>.
@ -59,11 +63,12 @@
<strong>Oh snap!</strong> <a href class="alert-link">Change a few things up</a> and try submitting again. <strong>Oh snap!</strong> <a href class="alert-link">Change a few things up</a> and try submitting again.
</div> </div>
</div> </div>
</blur-panel>
</div> </div>
<div class="col-md-6"> <div class="col-md-6"
<blur-panel title="Composite alerts" class-container="with-scroll"> ba-panel
ba-panel-title="Composite alerts"
ba-panel-class="with-scroll">
<div> <div>
<div class="alert bg-danger"> <div class="alert bg-danger">
<h5>Unhandled error!</h5> <h5>Unhandled error!</h5>
@ -74,7 +79,6 @@
</div> </div>
</div> </div>
</div> </div>
</blur-panel>
</div> </div>
</div> </div>

View File

@ -1,36 +1,49 @@
<div class="widgets"> <div class="widgets">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12"
<blur-panel class-container="with-scroll" > ba-panel
ba-panel-class="with-scroll">
<div ng-include="'app/pages/buttons/widgets/buttons.html'"></div> <div ng-include="'app/pages/buttons/widgets/buttons.html'"></div>
</blur-panel>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="Icon Buttons" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Icon Buttons"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/buttons/widgets/iconButtons.html'"></div> <div ng-include="'app/pages/buttons/widgets/iconButtons.html'"></div>
</blur-panel> </div>
<blur-panel title="Large Buttons" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Large Buttons"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/buttons/widgets/largeButtons.html'"></div> <div ng-include="'app/pages/buttons/widgets/largeButtons.html'"></div>
</blur-panel> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="Button Dropdowns" class-container="with-scroll" > <div
ba-panel
ba-panel-title="Button Dropdowns"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/buttons/widgets/dropdowns.html'"></div> <div ng-include="'app/pages/buttons/widgets/dropdowns.html'"></div>
</blur-panel> </div>
<blur-panel title="Button Groups" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Button Groups"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/buttons/widgets/buttonGroups.html'"></div> <div ng-include="'app/pages/buttons/widgets/buttonGroups.html'"></div>
</blur-panel> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12"
<blur-panel title="Progress Buttons" class-container="with-scroll"> ba-panel
ba-panel-title="Progress Buttons"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/buttons/widgets/progressButtons.html'"></div> <div ng-include="'app/pages/buttons/widgets/progressButtons.html'"></div>
</blur-panel>
</div> </div>
</div> </div>

View File

@ -1,4 +1,4 @@
<div class="progress-buttons-container text-center" ng-controller="buttonsPageCtrl"> <div class="progress-buttons-container text-center">
<div class="row"> <div class="row">
<section class="col-md-6 col-lg-3"> <section class="col-md-6 col-lg-3">
<span class="button-title">fill horizontal</span> <span class="button-title">fill horizontal</span>

View File

@ -1,46 +1,52 @@
<div class="widgets"> <div class="widgets">
<div class="row"> <div class="row">
<div class="col-lg-4 col-md-6"> <div class="col-lg-4 col-md-6"
<blur-panel title="Bar Chart" class-container="with-scroll"> ba-panel
ba-panel-title="Bar Chart"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/charts/amCharts/barChart/barChart.html'"></div> <div ng-include="'app/pages/charts/amCharts/barChart/barChart.html'"></div>
</blur-panel>
</div> </div>
<div class="col-lg-4 col-md-6"> <div class="col-lg-4 col-md-6"
<blur-panel title="Area Chart" class-container="with-scroll" > ba-panel
ba-panel-title="Area Chart"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/charts/amCharts/areaChart/areaChart.html'"></div> <div ng-include="'app/pages/charts/amCharts/areaChart/areaChart.html'"></div>
</blur-panel>
</div> </div>
<div class="col-lg-4 col-md-12"> <div class="col-lg-4 col-md-12"
<blur-panel title="Line Chart" class-container="with-scroll"> ba-panel
ba-panel-title="Line Chart"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/charts/amCharts/lineChart/lineChart.html'"></div> <div ng-include="'app/pages/charts/amCharts/lineChart/lineChart.html'"></div>
</blur-panel>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6"
<blur-panel title="Pie Chart" class-container="with-scroll"> ba-panel
ba-panel-title="Pie Chart"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/charts/amCharts/pieChart/pieChart.html'"></div> <div ng-include="'app/pages/charts/amCharts/pieChart/pieChart.html'"></div>
</blur-panel>
</div> </div>
<div class="col-md-6"> <div class="col-md-6"
<blur-panel title="Funnel Chart" class-container="with-scroll"> ba-panel
ba-panel-title="Funnel Chart"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/charts/amCharts/funnelChart/funnelChart.html'"></div> <div ng-include="'app/pages/charts/amCharts/funnelChart/funnelChart.html'"></div>
</blur-panel>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12"
<blur-panel title="Combined bullet/column and line graphs with multiple value axes" class-container="with-scroll"> ba-panel
ba-panel-title="Combined bullet/column and line graphs with multiple value axes"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/charts/amCharts/combinedChart/combinedChart.html'"></div> <div ng-include="'app/pages/charts/amCharts/combinedChart/combinedChart.html'"></div>
</blur-panel>
</div> </div>
<!--<div class="col-md-6">--> <!--<div class="col-md-6">-->
<!--<blur-panel title="Gantt chart" class-container="with-scroll">--> <!--<div ba-panel ba-panel-title="Gantt chart" ba-panel-class="with-scroll">-->
<!--<div ng-include="'app/pages/charts/amCharts/ganttChart/ganttChart.html'"></div>--> <!--<div ng-include="'app/pages/charts/amCharts/ganttChart/ganttChart.html'"></div>-->
<!--</blur-panel>--> <!--</div>-->
<!--</div>--> <!--</div>-->
</div> </div>

View File

@ -1,64 +1,64 @@
<div class="row"> <div class="row">
<div class="col-md-4" ng-controller="chartJs1DCtrl"> <div class="col-md-4" ng-controller="chartJs1DCtrl">
<blur-panel title="Pie" class-container="with-scroll "> <div ba-panel ba-panel-title="Pie" ba-panel-class="with-scroll ">
<canvas id="pie" class="chart chart-pie" <canvas id="pie" class="chart chart-pie"
chart-legend="true" chart-data="data" chart-labels="labels" chart-click="changeData"> chart-legend="true" chart-data="data" chart-labels="labels" chart-click="changeData">
</canvas> </canvas>
</blur-panel> </div>
</div> </div>
<div class="col-md-4" ng-controller="chartJs1DCtrl"> <div class="col-md-4" ng-controller="chartJs1DCtrl">
<blur-panel title="Doughnut" class-container="with-scroll "> <div ba-panel ba-panel-title="Doughnut" ba-panel-class="with-scroll ">
<canvas id="doughnut" chart-options="options" class="chart chart-doughnut" <canvas id="doughnut" chart-options="options" class="chart chart-doughnut"
chart-legend="true" chart-data="data" chart-labels="labels" chart-click="changeData"> chart-legend="true" chart-data="data" chart-labels="labels" chart-click="changeData">
</canvas> </canvas>
</blur-panel> </div>
</div> </div>
<div class="col-md-4" ng-controller="chartJs1DCtrl"> <div class="col-md-4" ng-controller="chartJs1DCtrl">
<blur-panel title="Polar" class-container="with-scroll "> <div ba-panel ba-panel-title="Polar" ba-panel-class="with-scroll ">
<canvas id="polar-area" class="chart chart-polar-area" <canvas id="polar-area" class="chart chart-polar-area"
chart-data="data" chart-labels="labels" chart-legend="true" chart-click="changeData"> chart-data="data" chart-labels="labels" chart-legend="true" chart-click="changeData">
</canvas> </canvas>
</blur-panel> </div>
</div> </div>
</div> </div>
<div class="row "> <div class="row ">
<div class="col-md-6" ng-controller="chartJsWaveCtrl"> <div class="col-md-6" ng-controller="chartJsWaveCtrl">
<blur-panel title="Animated Radar" class-container="with-scroll col-eq-height"> <div ba-panel ba-panel-title="Animated Radar" ba-panel-class="with-scroll col-eq-height">
<canvas id="waveLine" class="chart chart-radar" chart-data="data" chart-labels="labels" <canvas id="waveLine" class="chart chart-radar" chart-data="data" chart-labels="labels"
chart-legend="false"></canvas> chart-legend="false"></canvas>
</blur-panel> </div>
</div> </div>
<div class="col-md-6" ng-controller="chartJsWaveCtrl"> <div class="col-md-6" ng-controller="chartJsWaveCtrl">
<blur-panel title="Animated Bars" class-container="with-scroll col-eq-height"> <div ba-panel ba-panel-title="Animated Bars" ba-panel-class="with-scroll col-eq-height">
<canvas id="waveBars" class="chart chart-bar" chart-data="data" chart-labels="labels" <canvas id="waveBars" class="chart chart-bar" chart-data="data" chart-labels="labels"
chart-legend="false"></canvas> chart-legend="false"></canvas>
</blur-panel> </div>
</div> </div>
</div> </div>
<div class="row "> <div class="row ">
<div class="col-lg-4 col-md-6" ng-controller="chartJs2DCtrl"> <div class="col-lg-4 col-md-6" ng-controller="chartJs2DCtrl">
<blur-panel title="Radar" class-container="with-scroll "> <div ba-panel ba-panel-title="Radar" ba-panel-class="with-scroll ">
<canvas id="radar" class="chart chart-radar" <canvas id="radar" class="chart chart-radar"
chart-legend="false" chart-series="series" chart-data="data" chart-labels="labels" chart-legend="false" chart-series="series" chart-data="data" chart-labels="labels"
chart-click="changeData"> chart-click="changeData">
</canvas> </canvas>
</blur-panel> </div>
</div> </div>
<div class="col-lg-4 col-md-6" ng-controller="chartJs2DCtrl"> <div class="col-lg-4 col-md-6" ng-controller="chartJs2DCtrl">
<blur-panel title="Line" class-container="with-scroll "> <div ba-panel ba-panel-title="Line" ba-panel-class="with-scroll ">
<canvas id="line" class="chart chart-line" chart-data="data" chart-labels="labels" <canvas id="line" class="chart chart-line" chart-data="data" chart-labels="labels"
chart-legend="false" chart-series="series" chart-click="changeData"></canvas> chart-legend="false" chart-series="series" chart-click="changeData"></canvas>
</blur-panel> </div>
</div> </div>
<div class="col-lg-4 col-md-12" ng-controller="chartJs2DCtrl"> <div class="col-lg-4 col-md-12" ng-controller="chartJs2DCtrl">
<blur-panel title="Bars" class-container="with-scroll "> <div ba-panel ba-panel-title="Bars" ba-panel-class="with-scroll ">
<canvas id="bar" class="chart chart-bar" <canvas id="bar" class="chart chart-bar"
chart-data="data" chart-labels="labels" chart-series="series" chart-click="changeData"> chart-data="data" chart-labels="labels" chart-series="series" chart-click="changeData">
</canvas> </canvas>
</blur-panel> </div>
</div> </div>
</div> </div>

View File

@ -1,7 +1,7 @@
<section ng-controller="chartistCtrl"> <section ng-controller="chartistCtrl">
<div class="row"> <div class="row">
<div class="col-md-6 "> <div class="col-md-6 ">
<blur-panel title="Lines" class-container="with-scroll "> <div ba-panel ba-panel-title="Lines" ba-panel-class="with-scroll ">
<h5>Simple line chart</h5> <h5>Simple line chart</h5>
<chartist class="ct-chart" chartist-data="simpleLineData" chartist-chart-type="Line" <chartist class="ct-chart" chartist-data="simpleLineData" chartist-chart-type="Line"
chartist-chart-options="simpleLineOptions"></chartist> chartist-chart-options="simpleLineOptions"></chartist>
@ -11,11 +11,11 @@
<h5>Bi-polar line chart with area only</h5> <h5>Bi-polar line chart with area only</h5>
<chartist class="ct-chart" chartist-data="biLineData" chartist-chart-type="Line" <chartist class="ct-chart" chartist-data="biLineData" chartist-chart-type="Line"
chartist-chart-options="biLineOptions"></chartist> chartist-chart-options="biLineOptions"></chartist>
</blur-panel> </div>
</div> </div>
<div class="col-md-6 "> <div class="col-md-6 ">
<blur-panel title="Bars" class-container="with-scroll "> <div ba-panel ba-panel-title="Bars" ba-panel-class="with-scroll ">
<h5>Simple bar chart</h5> <h5>Simple bar chart</h5>
<chartist class="ct-chart" chartist-data="simpleBarData" chartist-chart-type="Bar" <chartist class="ct-chart" chartist-data="simpleBarData" chartist-chart-type="Bar"
chartist-chart-options="simpleBarOptions"></chartist> chartist-chart-options="simpleBarOptions"></chartist>
@ -25,13 +25,13 @@
<h5>Stacked bar chart</h5> <h5>Stacked bar chart</h5>
<chartist class="ct-chart stacked-bar" chartist-data="stackedBarData" chartist-chart-type="Bar" <chartist class="ct-chart stacked-bar" chartist-data="stackedBarData" chartist-chart-type="Bar"
chartist-chart-options="stackedBarOptions"></chartist> chartist-chart-options="stackedBarOptions"></chartist>
</blur-panel> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<blur-panel title="Pies & Donuts" class-container="with-scroll "> <div ba-panel ba-panel-title="Pies & Donuts" ba-panel-class="with-scroll ">
<div class="row"> <div class="row">
<div class="col-md-12 col-lg-4"><h5>Simple Pie</h5> <div class="col-md-12 col-lg-4"><h5>Simple Pie</h5>
<chartist class="ct-chart" chartist-data="simplePieData" chartist-chart-type="Pie" <chartist class="ct-chart" chartist-data="simplePieData" chartist-chart-type="Pie"
@ -46,7 +46,7 @@
chartist-chart-options="simpleDonutOptions" chartist-responsive-options="donutResponsive"></chartist> chartist-chart-options="simpleDonutOptions" chartist-responsive-options="donutResponsive"></chartist>
</div> </div>
</div> </div>
</blur-panel> </div>
</div> </div>
</div> </div>
</section> </section>

View File

@ -1,7 +1,7 @@
<section ng-controller="morrisCtrl"> <section ng-controller="morrisCtrl">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<blur-panel title="Line Chart" class-container="with-scroll"> <div ba-panel ba-panel-title="Line Chart" ba-panel-class="with-scroll">
<div <div
line-chart line-chart
line-data='lineData' line-data='lineData'
@ -10,22 +10,22 @@
line-labels='["Serie A", "Serie B"]' line-labels='["Serie A", "Serie B"]'
line-colors='colors'> line-colors='colors'>
</div> </div>
</blur-panel> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-4"> <div class="col-md-4">
<blur-panel title="Donut" class-container="with-scroll"> <div ba-panel ba-panel-title="Donut" ba-panel-class="with-scroll">
<div <div
donut-chart donut-chart
donut-data='donutData' donut-data='donutData'
donut-colors='colors' donut-colors='colors'
donut-formatter='"currency"'> donut-formatter='"currency"'>
</div> </div>
</blur-panel> </div>
</div> </div>
<div class="col-md-8"> <div class="col-md-8">
<blur-panel title="Bar Chart" class-container="with-scroll "> <div ba-panel ba-panel-title="Bar Chart" ba-panel-class="with-scroll ">
<div <div
bar-chart bar-chart
bar-data='barData' bar-data='barData'
@ -34,12 +34,12 @@
bar-labels='["Series A", "Series B"]' bar-labels='["Series A", "Series B"]'
bar-colors='colors'> bar-colors='colors'>
</div> </div>
</blur-panel> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<blur-panel title="Area Chart" class-container="with-scroll"> <div ba-panel ba-panel-title="Area Chart" ba-panel-class="with-scroll">
<div <div
area-chart area-chart
area-data='areaData' area-data='areaData'
@ -48,7 +48,7 @@
area-labels='["Serie A", "Serie B"]' area-labels='["Serie A", "Serie B"]'
line-colors='colors'> line-colors='colors'>
</div> </div>
</blur-panel> </div>
</div> </div>
</div> </div>
</section> </section>

View File

@ -0,0 +1,15 @@
/**
* @author v.lugovksy
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.dashboard')
.service('dashboardCalendar', dashboardCalendar);
/** @ngInject */
function dashboardCalendar() {
}
})();

View File

@ -1,57 +1,63 @@
<dashboard-pie-chart></dashboard-pie-chart> <dashboard-pie-chart></dashboard-pie-chart>
<div class="row"> <div class="row">
<div class="col-md-7 col-sm-12"> <div class="col-md-7 col-sm-12"
<blur-panel title="Acquisition Channels" class-container="medium-panel"> ba-panel
ba-panel-title="Acquisition Channels"
ba-panel-class="medium-panel">
<traffic-chart></traffic-chart> <traffic-chart></traffic-chart>
</blur-panel>
</div> </div>
<div class="col-md-5 col-sm-12"> <div class="col-md-5 col-sm-12"
<blur-panel title="Users by Country" class-container="medium-panel"> ba-panel
ba-panel-title="Users by Country"
ba-panel-class="medium-panel">
<dashboard-map></dashboard-map> <dashboard-map></dashboard-map>
</blur-panel>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-lg-8 col-md-7 col-sm-12 col-xs-12"> <div class="col-lg-8 col-md-7 col-sm-12 col-xs-12">
<div class="row"> <div class="row">
<div class="col-lg-7 col-md-12 col-sm-7 col-xs-12"> <div class="col-lg-7 col-md-12 col-sm-7 col-xs-12"
<blur-panel title="Revenue" class-container="medium-panel"> ba-panel
ba-panel-title="Revenue"
ba-panel-class="medium-panel">
<dashboard-line-chart></dashboard-line-chart> <dashboard-line-chart></dashboard-line-chart>
</blur-panel>
</div> </div>
<div class="col-lg-5 col-md-12 col-sm-5 col-xs-12"> <div class="col-lg-5 col-md-12 col-sm-5 col-xs-12"
<blur-panel class-container="popular-app medium-panel"> ba-panel
ba-panel-class="popular-app medium-panel">
<popular-app></popular-app> <popular-app></popular-app>
</blur-panel>
</div> </div>
</div> </div>
</div> </div>
<div class="col-lg-4 col-md-5 col-sm-12 col-xs-12"> <div class="col-lg-4 col-md-5 col-sm-12 col-xs-12"
<blur-panel title="Feed" class-container="large-panel with-scroll feed-panel"> ba-panel
ba-panel-title="Feed"
ba-panel-class="large-panel with-scroll feed-panel">
<blur-feed></blur-feed> <blur-feed></blur-feed>
</blur-panel>
</div> </div>
</div> </div>
<div class="row shift-up"> <div class="row shift-up">
<div class="col-lg-3 col-md-6 col-xs-12"> <div class="col-lg-3 col-md-6 col-xs-12"
<blur-panel title="To Do List" class-container="xmedium-panel feed-comply-panel with-scroll"> ba-panel
ba-panel-title="To Do List"
ba-panel-class="xmedium-panel feed-comply-panel with-scroll">
<dashboard-todo></dashboard-todo> <dashboard-todo></dashboard-todo>
</blur-panel>
</div> </div>
<div class="col-lg-5 col-md-6 col-xs-12"> <div class="col-lg-5 col-md-6 col-xs-12"
<blur-panel title="Calendar" class-container="xmedium-panel feed-comply-panel with-scroll"> ba-panel
ba-panel-title="Calendar"
ba-panel-class="xmedium-panel feed-comply-panel with-scroll">
<dashboard-calendar></dashboard-calendar> <dashboard-calendar></dashboard-calendar>
</blur-panel>
</div> </div>
</div> </div>
<!--<div class="row"> <!--<div class="row">
<div class="col-lg-4 col-sm-6 col-xs-12"> <div class="col-lg-4 col-sm-6 col-xs-12">
<blur-panel title="Weather" class-container="medium-panel with-scroll"> <div ba-panel ba-panel-title="Weather" ba-panel-class="medium-panel with-scroll">
<blur-weather forecast="5"></blur-weather> <blur-weather forecast="5"></blur-weather>
</blur-panel> </div>
</div> </div>
</div>--> </div>-->

View File

@ -1,6 +1,6 @@
<div class="row pie-charts"> <div class="row pie-charts">
<div class="pie-chart-item-container" ng-repeat="chart in charts"> <div class="pie-chart-item-container" ng-repeat="chart in charts">
<blur-panel> <div ba-panel>
<div class="pie-chart-item"> <div class="pie-chart-item">
<div class="chart" rel="{{ ::chart.color }}" data-percent="60"> <span class="percent"></span> </div> <div class="chart" rel="{{ ::chart.color }}" data-percent="60"> <span class="percent"></span> </div>
<div class="description"> <div class="description">
@ -9,6 +9,6 @@
</div> </div>
<i class="chart-icon i-{{ ::chart.icon }}"></i> <i class="chart-icon i-{{ ::chart.icon }}"></i>
</div> </div>
</blur-panel> </div>
</div> </div>
</div> </div>

View File

@ -0,0 +1,15 @@
/**
* @author v.lugovksy
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.dashboard')
.service('dashboardPieChart', dashboardPieChart);
/** @ngInject */
function dashboardPieChart() {
}
})();

View File

@ -0,0 +1,15 @@
/**
* @author v.lugovksy
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.dashboard')
.service('popularApp1', popularApp1);
/** @ngInject */
function popularApp1() {
}
})();

View File

@ -0,0 +1,15 @@
/**
* @author v.lugovksy
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.dashboard')
.service('dashboardTodo', dashboardTodo);
/** @ngInject */
function dashboardTodo() {
}
})();

View File

@ -2,29 +2,47 @@
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="Standard Fields" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Standard Fields"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/inputs/widgets/standardFields.html'"></div> <div ng-include="'app/pages/form/inputs/widgets/standardFields.html'"></div>
</blur-panel> </div>
<blur-panel title="Tags Input" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Tags Input"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/inputs/widgets/tagsInput/tagsInput.html'"></div> <div ng-include="'app/pages/form/inputs/widgets/tagsInput/tagsInput.html'"></div>
</blur-panel> </div>
<blur-panel title="Input Groups" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Input Groups"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/inputs/widgets/inputGroups.html'"></div> <div ng-include="'app/pages/form/inputs/widgets/inputGroups.html'"></div>
</blur-panel> </div>
<blur-panel title="Checkboxes & Radios" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Checkboxes & Radios"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/inputs/widgets/checkboxesRadios.html'"></div> <div ng-include="'app/pages/form/inputs/widgets/checkboxesRadios.html'"></div>
</blur-panel> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="Validation States" class-container="with-scroll" > <div
ba-panel
ba-panel-title="Validation States"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/inputs/widgets/validationStates.html'"></div> <div ng-include="'app/pages/form/inputs/widgets/validationStates.html'"></div>
</blur-panel> </div>
<blur-panel title="Selects" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Selects"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/inputs/widgets/select/select.html'"></div> <div ng-include="'app/pages/form/inputs/widgets/select/select.html'"></div>
</blur-panel> </div>
<blur-panel title="On/Off Switches" class-container="with-scroll" > <div ba-panel ba-panel-title="On/Off Switches" ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/inputs/widgets/switch/switch.html'"></div> <div ng-include="'app/pages/form/inputs/widgets/switch/switch.html'"></div>
</blur-panel> </div>
</div> </div>
</div> </div>

View File

@ -1,29 +1,42 @@
<div class="widgets"> <div class="widgets">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12"
<blur-panel title="Inline Form" class-container="with-scroll"> ba-panel
ba-panel-title="Inline Form"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/layouts/widgets/inlineForm.html'"></div> <div ng-include="'app/pages/form/layouts/widgets/inlineForm.html'"></div>
</blur-panel>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="Basic Form" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Basic Form"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/layouts/widgets/basicForm.html'"></div> <div ng-include="'app/pages/form/layouts/widgets/basicForm.html'"></div>
</blur-panel> </div>
<blur-panel title="Block Form" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Block Form"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/layouts/widgets/blockForm.html'"></div> <div ng-include="'app/pages/form/layouts/widgets/blockForm.html'"></div>
</blur-panel> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="Horizontal Form" class-container="with-scroll" > <div
ba-panel
ba-panel-title="Horizontal Form"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/layouts/widgets/horizontalForm.html'"></div> <div ng-include="'app/pages/form/layouts/widgets/horizontalForm.html'"></div>
</blur-panel> </div>
<blur-panel title="Form Without Labels" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Form Without Labels"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/form/layouts/widgets/formWithoutLabels.html'"></div> <div ng-include="'app/pages/form/layouts/widgets/formWithoutLabels.html'"></div>
</blur-panel> </div>
</div> </div>
</div> </div>

View File

@ -2,7 +2,7 @@
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<blur-panel title="Form Wizard" class-container="with-scroll"> <div ba-panel ba-panel-title="Form Wizard" ba-panel-class="with-scroll">
<ba-wizard> <ba-wizard>
<ba-wizard-tab title="Personal info" form="vm.personalInfoForm"> <ba-wizard-tab title="Personal info" form="vm.personalInfoForm">
<form name="vm.personalInfoForm" novalidate> <form name="vm.personalInfoForm" novalidate>
@ -99,7 +99,7 @@
</form> </form>
</ba-wizard-tab> </ba-wizard-tab>
</ba-wizard> </ba-wizard>
</blur-panel> </div>
</div> </div>
</div> </div>

View File

@ -1,10 +1,11 @@
<div class="widgets"> <div class="widgets">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12"
<blur-panel title="Inline Form" class-container="with-scroll"> ba-panel
ba-panel-title="Inline Form"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/grid/baseGrid.html'"></div> <div ng-include="'app/pages/grid/baseGrid.html'"></div>
</blur-panel>
</div> </div>
</div> </div>

View File

@ -2,23 +2,38 @@
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="Kameleon SVG Icons" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Kameleon SVG Icons"
ba-panel-class="with-scroll">
<div include-with-scope="app/pages/icons/widgets/kameleon.html"></div> <div include-with-scope="app/pages/icons/widgets/kameleon.html"></div>
</blur-panel> </div>
<blur-panel title="Socicon" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Socicon"
ba-panel-class="with-scroll">
<div include-with-scope="app/pages/icons/widgets/socicon.html"></div> <div include-with-scope="app/pages/icons/widgets/socicon.html"></div>
</blur-panel> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="Icons With Rounded Background" class-container="with-scroll" > <div
ba-panel
ba-panel-title="Icons With Rounded Background"
ba-panel-class="with-scroll">
<div include-with-scope="app/pages/icons/widgets/kameleonRounded.html"></div> <div include-with-scope="app/pages/icons/widgets/kameleonRounded.html"></div>
</blur-panel> </div>
<blur-panel title="ionicons" class-container="with-scroll"> <div
ba-panel
ba-panel-title="ionicons"
ba-panel-class="with-scroll">
<div include-with-scope="app/pages/icons/widgets/ionicons.html"></div> <div include-with-scope="app/pages/icons/widgets/ionicons.html"></div>
</blur-panel> </div>
<blur-panel title="Font Awesome Icons" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Font Awesome Icons"
ba-panel-class="with-scroll">
<div include-with-scope="app/pages/icons/widgets/fontAwesomeIcons.html"></div> <div include-with-scope="app/pages/icons/widgets/fontAwesomeIcons.html"></div>
</blur-panel> </div>
</div> </div>
</div> </div>

View File

@ -1,6 +1,6 @@
<div class="row mail-row"> <div class="row mail-row">
<div class="col-md-12 col-sm-12"> <div class="col-md-12 col-sm-12">
<blur-panel class-container="xmedium-panel mail-panel"> <div ba-panel ba-panel-class="xmedium-panel mail-panel">
<div class="mail-container"> <div class="mail-container">
<div class="row letter-layout"> <div class="row letter-layout">
<div class="mail-navigation-container"> <div class="mail-navigation-container">
@ -39,6 +39,6 @@
<ui-view></ui-view> <ui-view></ui-view>
</div> </div>
</div> </div>
</blur-panel> </div>
</div> </div>
</div> </div>

View File

@ -1,3 +1,3 @@
<blur-panel title="Google Maps" class="viewport100"> <div ba-panel ba-panel-title="Google Maps" class="viewport100">
<div id="google-maps"></div> <div id="google-maps"></div>
</blur-panel> </div>

View File

@ -1,3 +1,3 @@
<blur-panel title="Leaflet" class="viewport100"> <div ba-panel ba-panel-title="Leaflet" class="viewport100">
<div id="leaflet-map"></div> <div id="leaflet-map"></div>
</blur-panel> </div>

View File

@ -1,3 +1,3 @@
<blur-panel title="Map with Bubbles" class="viewport100"> <div ba-panel ba-panel-title="Map with Bubbles" class="viewport100">
<div id="map-bubbles"></div> <div id="map-bubbles"></div>
</blur-panel> </div>

View File

@ -1,5 +1,5 @@
<blur-panel title="Map with Bubbles" class="viewport100"> <div ba-panel ba-panel-title="Map with Bubbles" class="viewport100">
<div id="map-lines"></div> <div id="map-lines"></div>
</blur-panel> </div>

View File

@ -1,30 +1,32 @@
<div class="widgets"> <div class="widgets">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12"
<blur-panel title="Modals" class-container="with-scroll"> ba-panel
ba-panel-title="Modals"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/modals/modalsPanel.html'"></div> <div ng-include="'app/pages/modals/modalsPanel.html'"></div>
</blur-panel>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6"
<blur-panel title="Message Modals" class-container="with-scroll"> ba-panel
ba-panel-title="Message Modals"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/modals/message-modals.html'"></div> <div ng-include="'app/pages/modals/message-modals.html'"></div>
</blur-panel>
</div> </div>
<div class="col-md-6"> <div class="col-md-6"
<blur-panel title="Notifications" class-container="with-scroll" > ba-panel
ba-panel-title="Notifications"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/modals/notifications/notifications.html'"></div> <div ng-include="'app/pages/modals/notifications/notifications.html'"></div>
</blur-panel>
</div> </div>
</div> </div>
</div> </div>
<!-- Modal --> <!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
@ -92,7 +94,8 @@
</div> </div>
<!-- Success modal --> <!-- Success modal -->
<div class="modal fade message-modal success-modal" id="successModal" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"> <div class="modal fade message-modal success-modal" id="successModal" tabindex="-1" role="dialog"
aria-labelledby="mySmallModalLabel">
<div class="modal-dialog modal-sm"> <div class="modal-dialog modal-sm">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
@ -108,7 +111,8 @@
</div> </div>
<!-- Info modal --> <!-- Info modal -->
<div class="modal fade message-modal info-modal" id="infoModal" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"> <div class="modal fade message-modal info-modal" id="infoModal" tabindex="-1" role="dialog"
aria-labelledby="mySmallModalLabel">
<div class="modal-dialog modal-sm"> <div class="modal-dialog modal-sm">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
@ -124,7 +128,8 @@
</div> </div>
<!-- Warning modal --> <!-- Warning modal -->
<div class="modal fade message-modal warning-modal" id="warningModal" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"> <div class="modal fade message-modal warning-modal" id="warningModal" tabindex="-1" role="dialog"
aria-labelledby="mySmallModalLabel">
<div class="modal-dialog modal-sm"> <div class="modal-dialog modal-sm">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
@ -140,7 +145,8 @@
</div> </div>
<!-- Danger modal --> <!-- Danger modal -->
<div class="modal fade message-modal danger-modal" id="dangerModal" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"> <div class="modal fade message-modal danger-modal" id="dangerModal" tabindex="-1" role="dialog"
aria-labelledby="mySmallModalLabel">
<div class="modal-dialog modal-sm"> <div class="modal-dialog modal-sm">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">

View File

@ -1,4 +1,4 @@
<blur-panel class-container="with-scroll"> <div ba-panel ba-panel-class="with-scroll">
<div class="row"> <div class="row">
<div class="col-md-3 col-sm-4"> <div class="col-md-3 col-sm-4">
<div class="control"> <div class="control">
@ -149,4 +149,4 @@
</div> </div>
</div> </div>
</blur-panel> </div>

View File

@ -19,6 +19,7 @@
'BlurAdmin.pages.maps', 'BlurAdmin.pages.maps',
'BlurAdmin.pages.modals', 'BlurAdmin.pages.modals',
'BlurAdmin.pages.notifications', 'BlurAdmin.pages.notifications',
'BlurAdmin.pages.panels',
'BlurAdmin.pages.profile', 'BlurAdmin.pages.profile',
'BlurAdmin.pages.progressBars', 'BlurAdmin.pages.progressBars',
'BlurAdmin.pages.slider', 'BlurAdmin.pages.slider',

View File

@ -0,0 +1,83 @@
<div>
<div class="panel panel-default">
<div class="panel-body">
<p>A panel in bootstrap is a bordered box with some padding around its content.</p>
<p>Panels are created with the <code>.panel</code> class, and content inside the panel has a
<code>.panel-body</code> class. The <code>.panel-default</code> class is used to style the color of the
panel. See the last example on this page for more contextual classes.</p>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">Panel Heading</div>
<div class="panel-body">
<p>The <code>.panel-heading</code> class adds a heading to the panel.</p>
</div>
</div>
<div class="panel panel-default">
<div class="panel-body">
<p>The <code>.panel-footer</code> class adds a footer to the panel.</p>
</div>
<div class="panel-footer">Panel Footer</div>
</div>
<hr>
<h2>Panel Group</h2>
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-heading">Panel group 1</div>
<div class="panel-body">
<p>To group many panels together, wrap a <code>&lt;div&gt;</code> with class <code>
.panel-group</code> around them.</p>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">Panel group 2</div>
<div class="panel-body">
<p>The <code>.panel-group</code> class clears the bottom-margin of each panel.</p>
</div>
</div>
</div>
<hr>
<h2>Panels with Contextual Classes</h2>
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-heading">Panel with panel-default class</div>
<div class="panel-body">To color the panel, use contextual classes. This is sample <code>.panel-default</code> panel</div>
</div>
<div class="panel panel-primary">
<div class="panel-heading">Panel with panel-primary class</div>
<div class="panel-body">Sample <code>.panel-primary</code> panel</div>
</div>
<div class="panel panel-success">
<div class="panel-heading">Panel with panel-success class</div>
<div class="panel-body">Sample <code>.panel-success</code> panel</div>
</div>
<div class="panel panel-info">
<div class="panel-heading">Panel with panel-info class</div>
<div class="panel-body">Sample <code>.panel-info</code> panel</div>
</div>
<div class="panel panel-warning">
<div class="panel-heading">Panel with panel-warning class</div>
<div class="panel-body">Sample <code>.panel-warning</code> panel</div>
</div>
<div class="panel panel-danger">
<div class="panel-heading">Panel with panel-danger class</div>
<div class="panel-body">Sample <code>.panel-danger</code> panel</div>
</div>
</div>
</div>

View File

@ -0,0 +1,21 @@
/**
* @author v.lugovsky
* created on 23.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.panels', [])
.config(routeConfig);
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('panels', {
url: '/panels',
templateUrl: 'app/pages/panels/panels.html',
controller: 'NotificationsPageCtrl'
});
}
})();

View File

@ -2,28 +2,41 @@
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="Basic" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Basic"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/progressBars/widgets/basic.html'"></div> <div ng-include="'app/pages/progressBars/widgets/basic.html'"></div>
</blur-panel> </div>
<blur-panel title="Striped" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Striped"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/progressBars/widgets/striped.html'"></div> <div ng-include="'app/pages/progressBars/widgets/striped.html'"></div>
</blur-panel> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="With label" class-container="with-scroll" > <div
ba-panel
ba-panel-title="With label"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/progressBars/widgets/label.html'"></div> <div ng-include="'app/pages/progressBars/widgets/label.html'"></div>
</blur-panel> </div>
<blur-panel title="Animated" class-container="with-scroll" > <div
ba-panel
ba-panel-title="Animated"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/progressBars/widgets/animated.html'"></div> <div ng-include="'app/pages/progressBars/widgets/animated.html'"></div>
</blur-panel> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12"
<blur-panel title="Stacked" class-container="with-scroll"> ba-panel
ba-panel-title="Stacked"
ba-panel-class="with-scroll">
<div ng-include="'app/pages/progressBars/widgets/stacked.html'"></div> <div ng-include="'app/pages/progressBars/widgets/stacked.html'"></div>
</blur-panel>
</div> </div>
</div> </div>

View File

@ -1,6 +1,6 @@
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<blur-panel title="Ion Range Slider" class-container="with-scroll"> <div ba-panel ba-panel-title="Ion Range Slider" ba-panel-class="with-scroll">
<div> <div>
<h5>Basic</h5> <h5>Basic</h5>
<ion-slider type="single" <ion-slider type="single"
@ -91,6 +91,6 @@
disable="true"> disable="true">
</ion-slider> </ion-slider>
</div> </div>
</blur-panel> </div>
</div> </div>
</div> </div>

View File

@ -1,32 +1,44 @@
<div class="widgets"> <div class="widgets">
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12"
<blur-panel title="Smart Table" class-container="with-scroll"> ba-panel
ba-panel-title="Smart Table"
ba-panel-class="with-scroll">
<div include-with-scope="app/pages/tables/widgets/smartTable.html"></div> <div include-with-scope="app/pages/tables/widgets/smartTable.html"></div>
</blur-panel>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="Hover Tows and Fix Headers" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Hover Tows and Fix Headers"
ba-panel-class="with-scroll">
<div include-with-scope="app/pages/tables/widgets/hoverRows.html"></div> <div include-with-scope="app/pages/tables/widgets/hoverRows.html"></div>
</blur-panel> </div>
<blur-panel title="Condensed Table" class-container="with-scroll"> <div
ba-panel
ba-panel-title="Condensed Table"
ba-panel-class="with-scroll">
<div include-with-scope="app/pages/tables/widgets/condensedTable.html"></div> <div include-with-scope="app/pages/tables/widgets/condensedTable.html"></div>
</blur-panel> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<blur-panel title="Striped Rows" class-container="with-scroll" > <div
ba-panel
ba-panel-title="Striped Rows"
ba-panel-class="with-scroll">
<div include-with-scope="app/pages/tables/widgets/stripedRows.html"></div> <div include-with-scope="app/pages/tables/widgets/stripedRows.html"></div>
</blur-panel> </div>
<blur-panel title="Bordered Table" class-container="with-scroll" > <div
ba-panel
ba-panel-title="Bordered Table"
ba-panel-class="with-scroll">
<div include-with-scope="app/pages/tables/widgets/borderedTable.html"></div> <div include-with-scope="app/pages/tables/widgets/borderedTable.html"></div>
</blur-panel>
</div> </div>
</div> </div>
</div>
</div> </div>

View File

@ -19,7 +19,7 @@
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<blur-panel class-container="with-scroll tree-panel" title="Basic Action"> <div ba-panel ba-panel-title="Basic Action" ba-panel-class="with-scroll tree-panel">
<div class="row" ng-controller="treeCtrl"> <div class="row" ng-controller="treeCtrl">
<div class="col-sm-4"> <div class="col-sm-4">
<div class="control-side text-center"> <div class="control-side text-center">
@ -55,18 +55,18 @@
</div> </div>
</div> </div>
</div> </div>
</blur-panel> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<blur-panel class-container="with-scroll tree-panel" title="Drag & Drop"> <div ba-panel ba-panel-title="Drag & Drop" ba-panel-class="with-scroll tree-panel">
<div data-ui-tree="treeOptions" data-drag-enabled="true" id="tree-root-drag" ng-controller="treeCtrl"> <div data-ui-tree="treeOptions" data-drag-enabled="true" id="tree-root-drag" ng-controller="treeCtrl">
<ol data-ui-tree-nodes ng-model="dragData"> <ol data-ui-tree-nodes ng-model="dragData">
<li data-ng-repeat="node in dragData" data-ui-tree-node ng-include="'nodes_renderer.html'"></li> <li data-ng-repeat="node in dragData" data-ui-tree-node ng-include="'nodes_renderer.html'"></li>
</ol> </ol>
</div> </div>
</blur-panel>
</div> </div>
</div> </div>
</blur-panel> </div>
</div>
</div> </div>

View File

@ -1,6 +1,6 @@
<div class="typography-document-samples row-fluid"> <div class="typography-document-samples row-fluid">
<div class="col-xlg-3 col-lg-6 col-md-6 col-sm-6 col-xs-12 typography-widget"> <div class="col-xlg-3 col-lg-6 col-md-6 col-sm-6 col-xs-12 typography-widget">
<blur-panel class-container="with-scroll heading-widget"> <div ba-panel ba-panel-class="with-scroll heading-widget">
<div class="section-block"> <div class="section-block">
<h2 class="typography-widget-header">Text Size</h2> <h2 class="typography-widget-header">Text Size</h2>
</div> </div>
@ -32,11 +32,11 @@
<p>Lorem ipsum dolor sit amet, id mollis iaculis mi nisl pulvinar, lacinia scelerisque pharetra.</p> <p>Lorem ipsum dolor sit amet, id mollis iaculis mi nisl pulvinar, lacinia scelerisque pharetra.</p>
</div> </div>
</blur-panel> </div>
</div> </div>
<div class="col-xlg-3 col-lg-6 col-md-6 col-sm-6 col-xs-12 typography-widget"> <div class="col-xlg-3 col-lg-6 col-md-6 col-sm-6 col-xs-12 typography-widget">
<blur-panel class-container="with-scroll more-text-widget"> <div ba-panel ba-panel-class="with-scroll more-text-widget">
<div class="section-block"> <div class="section-block">
<h2 class="typography-widget-header">Some more text</h2> <h2 class="typography-widget-header">Some more text</h2>
</div> </div>
@ -76,11 +76,11 @@
<p> pellentesque, mi nam.</p> <p> pellentesque, mi nam.</p>
</div> </div>
</blur-panel> </div>
</div> </div>
<div class="col-xlg-3 col-lg-6 col-md-6 col-sm-6 col-xs-12 typography-widget"> <div class="col-xlg-3 col-lg-6 col-md-6 col-sm-6 col-xs-12 typography-widget">
<blur-panel class-container="with-scroll lists-widget"> <div ba-panel ba-panel-class="with-scroll lists-widget">
<div class="section-block"> <div class="section-block">
<h2 class="typography-widget-header">Lists</h2> <h2 class="typography-widget-header">Lists</h2>
</div> </div>
@ -122,11 +122,11 @@
lacinia scelerisque pharetra. lacinia scelerisque pharetra.
</div> </div>
</div> </div>
</blur-panel> </div>
</div> </div>
<div class="col-xlg-3 col-lg-6 col-md-6 col-sm-6 col-xs-12 typography-widget"> <div class="col-xlg-3 col-lg-6 col-md-6 col-sm-6 col-xs-12 typography-widget">
<blur-panel class-container="with-scroll color-widget"> <div ba-panel ba-panel-class="with-scroll color-widget">
<div class="section-block"> <div class="section-block">
<h2 class="typography-widget-header">Text Color</h2> <h2 class="typography-widget-header">Text Color</h2>
</div> </div>
@ -160,13 +160,13 @@
<p class="hovered"><a href>Hover link — #9d498c</a></p> <p class="hovered"><a href>Hover link — #9d498c</a></p>
</div> </div>
</blur-panel> </div>
</div> </div>
</div> </div>
<div class="row-fluid"> <div class="row-fluid">
<div class="col-lg-12 col-sm-12 col-xs-12"> <div class="col-lg-12 col-sm-12 col-xs-12">
<blur-panel class-container="banner-column-panel"> <div ba-panel ba-panel-class="banner-column-panel">
<div class="banner"> <div class="banner">
<div class="large-banner-wrapper"> <div class="large-banner-wrapper">
<img ng-src="{{::( 'app/typography/banner.png' | appImage )}}" alt=""/> <img ng-src="{{::( 'app/typography/banner.png' | appImage )}}" alt=""/>
@ -186,7 +186,8 @@
<div class="row"> <div class="row">
<div class="col-sm-6"> <div class="col-sm-6">
<div class="img-wrapper"><img ng-src="{{::( 'app/typography/typo03.png' | appImage )}}" alt="" title=""/></div> <div class="img-wrapper"><img ng-src="{{::( 'app/typography/typo03.png' | appImage )}}" alt="" title=""/>
</div>
<p>Vel elit, eros elementum, id lacinia, duis non ut ut tortor blandit. Mauris <a <p>Vel elit, eros elementum, id lacinia, duis non ut ut tortor blandit. Mauris <a
href>dapibus</a> magna rutrum. Ornare neque suspendisse <a href>dapibus</a> magna rutrum. Ornare neque suspendisse <a
href>phasellus wisi</a>, quam cras pede rutrum suspendisse, <a href>phasellus wisi</a>, quam cras pede rutrum suspendisse, <a
@ -196,7 +197,8 @@
arcu nulla.</p> arcu nulla.</p>
</div> </div>
<div class="col-sm-6"> <div class="col-sm-6">
<div class="img-wrapper"><img ng-src="{{::( 'app/typography/typo01.png' | appImage )}}" alt="" title=""/></div> <div class="img-wrapper"><img ng-src="{{::( 'app/typography/typo01.png' | appImage )}}" alt="" title=""/>
</div>
<p>Et suspendisse, adipiscing fringilla ornare sit ligula sed, vel nam. Interdum et justo nulla, <p>Et suspendisse, adipiscing fringilla ornare sit ligula sed, vel nam. Interdum et justo nulla,
fermentum fermentum
lobortis purus ut eu, duis nibh dolor massa tristique elementum, nibh iste potenti risus fusce lobortis purus ut eu, duis nibh dolor massa tristique elementum, nibh iste potenti risus fusce
@ -240,6 +242,6 @@
</div> </div>
<div class="separator"></div> <div class="separator"></div>
</div> </div>
</blur-panel> </div>
</div> </div>
</div> </div>

View File

@ -0,0 +1,26 @@
/**
* @author v.lugovsky
* created on 23.12.2015
*/
(function () {
'use strict';
/**
* Includes basic panel layout inside of current element.
*/
angular.module('BlurAdmin.theme')
.directive('baPanel', baPanel);
/** @ngInject */
function baPanel(baPanel) {
return angular.extend({}, baPanel, {
template: function(el, attrs) {
var res = '<div class="panel panel-white invisible ' + (attrs.baPanelClass || '') + '" zoom-in>';
res += baPanel.template(el, attrs);
res += '</div>';
return res;
}
});
}
})();

View File

@ -0,0 +1,30 @@
/**
* @author v.lugovsky
* created on 23.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.theme')
.factory('baPanel', baPanel);
/** @ngInject */
function baPanel() {
/** Base baPanel directive */
return {
restrict: 'A',
transclude: true,
template: function(elem, attrs) {
var res = '<div class="panel-body" ng-transclude></div>';
if (attrs.baPanelTitle) {
var titleTpl = '<div class="panel-heading clearfix"><h3 class="panel-title">' + attrs.baPanelTitle + '</h3></div>';
res = titleTpl + res; // title should be before
}
return res;
}
};
}
})();

View File

@ -0,0 +1,26 @@
/**
* @author v.lugovsky
* created on 23.12.2015
*/
(function () {
'use strict';
/**
* Represents current element as panel, adding all necessary classes.
*/
angular.module('BlurAdmin.theme')
.directive('baPanelSelf', baPanelSelf);
/** @ngInject */
function baPanelSelf(baPanel) {
return angular.extend({}, baPanel, {
link: function(scope, el, attrs) {
el.addClass('panel panel-white');
if (attrs.baPanelClass) {
el.addClass(attrs.baPanelClass);
}
}
});
}
})();

View File

@ -1,24 +0,0 @@
/**
* @author v.lugovksy
* created on 16.12.2015
*/
(function () {
'use strict';
angular.module('BlurAdmin.theme.components')
.directive('blurPanel', blurPanel);
/** @ngInject */
function blurPanel() {
return {
restrict: 'E',
transclude: true,
scope: {
title: '@',
classContainer: '@'
},
templateUrl: 'app/theme/components/blurPanel/blurPanel.html'
};
}
})();

View File

@ -1,8 +0,0 @@
<div class="panel panel-default invisible" ng-class="classContainer" zoom-in>
<div class="panel-heading clearfix" ng-if="title">
<h3 class="panel-title">{{ title }}</h3>
</div>
<div class="panel-body">
<div class="panel-content" ng-transclude></div>
</div>
</div>

View File

@ -43,7 +43,8 @@
'/maps/gmap': 'Google Map', '/maps/gmap': 'Google Map',
'/maps/leaflet': 'Leaflet Map', '/maps/leaflet': 'Leaflet Map',
'/maps/line': 'Line Map', '/maps/line': 'Line Map',
'/maps/bubble': 'Bubble Map' '/maps/bubble': 'Bubble Map',
'/panels': 'Panels'
}; };
$scope.$watch(function () { $scope.$watch(function () {

View File

@ -117,6 +117,10 @@
{ {
title: 'Sliders', title: 'Sliders',
root: '#/slider' root: '#/slider'
},
{
title: 'Panels',
root: '#/panels'
} }
] ]
}, },

View File

@ -1,9 +1,9 @@
<div class="widgets"> <div class="widgets">
<div ng-repeat="widgetBlock in ngModel" ng-class="{'row': widgetBlock.widgets.length > 1}"> <div ng-repeat="widgetBlock in ngModel" ng-class="{'row': widgetBlock.widgets.length > 1}">
<div ng-repeat="widgetCol in widgetBlock.widgets" ng-class="{'col-md-6': widgetBlock.widgets.length === 2}" ng-model="widgetCol" class="widgets-block"> <div ng-repeat="widgetCol in widgetBlock.widgets" ng-class="{'col-md-6': widgetBlock.widgets.length === 2}" ng-model="widgetCol" class="widgets-block">
<blur-panel title="{{::widget.title}}" ng-repeat="widget in widgetCol" class-container="with-scroll {{widget.panelClass}}"> <div ba-panel ba-panel-title="{{::widget.title}}" ng-repeat="widget in widgetCol" ba-panel-class="with-scroll {{widget.panelClass}}">
<div ng-include="widget.url"></div> <div ng-include="widget.url"></div>
</blur-panel> </div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Blur Admin</title> <title>Blur Admin</title>
<link href='http://fonts.googleapis.com/css?family=Lato:300,400' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Lato:100,200,300,400,500,600,700,800,900' rel='stylesheet' type='text/css'>
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="img/favicon-96x96.png"> <link rel="icon" type="image/png" sizes="96x96" href="img/favicon-96x96.png">

View File

@ -1,6 +1,5 @@
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
font-family: $font-family; font-family: $font-family;
color: $default-text;
width: 90%; width: 90%;
margin-top: 0; margin-top: 0;
} }
@ -13,41 +12,31 @@ a {
color: $primary; color: $primary;
text-decoration: none !important; text-decoration: none !important;
&:hover { &:hover {
color: $danger; color: shade($primary, 20);
} }
} }
h1 { h1 {
font-size: 32px; font-size: 32px;
line-height: 40px; font-weight: 400;
margin-bottom: 14px;
font-weight: 100;
} }
h2 { h2 {
font-size: 24px; font-size: 24px;
line-height: 40px; font-weight: 400;
margin-bottom: 10px;
font-weight: 200;
} }
h3 { h3 {
font-size: 20px; font-size: 20px;
line-height: 40px; font-weight: 400;
margin-bottom: 6px;
font-weight: 300;
} }
h4 { h4 {
font-size: 18px; font-size: 18px;
line-height: 38px;
margin-bottom: 5px;
} }
h5 { h5 {
font-size: 15px; font-size: 15px;
line-height: 35px;
margin-bottom: 3px;
} }
.typography-document-samples { .typography-document-samples {
@ -284,7 +273,6 @@ h5 {
p { p {
margin-bottom: 12px; margin-bottom: 12px;
color: $default-text;
font-family: $font-family; font-family: $font-family;
font-size: 14px; font-size: 14px;
} }

View File

@ -1,2 +1,2 @@
@import 'theme/conf/variables';
@import 'theme/conf/mixins'; @import 'theme/conf/mixins';
@import 'theme/conf/variables';

View File

@ -13,8 +13,8 @@ html, body {
} }
body { body {
font: 12px/16px $font-family; font: 14px/16px $font-family;
color: $default-text; color: white;
@include main-background(); @include main-background();
} }

View File

@ -0,0 +1,113 @@
$panel-title-height: 44px;
$panel-heading-font-size: 16px;
.panel {
border: none;
border-radius: 0;
background-color: $panel-bg;
color: $default-text;
position: relative;
transition: all 0.2s ease;
margin-bottom: 24px;
&:hover {
background: $panel-bg-hover;
}
&.animated {
animation-duration: 0.5s;
}
&.small-panel {
height: $small-panel-height;
}
&.medium-panel {
height: $medium-panel-height;
}
&.xmedium-panel {
height: $extra-medium-panel-height;
}
&.large-panel {
height: $large-panel-height;
}
&.viewport100 {
height: calc(100vh - 218px);
}
&.with-scroll {
.panel-body {
height: calc(100% - #{$panel-title-height});
overflow-y: auto;
}
}
}
.panel-body {
padding: 15px 22px;
height: 100%;
}
.panel-heading, .panel-footer {
height: $panel-title-height;
font-size: $panel-heading-font-size;
$vertical-padding: ($panel-title-height - $panel-heading-font-size) / 2;
padding: $vertical-padding 22px;
}
.panel-title {
font-weight: 400;
//text-transform: uppercase;
}
.panel-white {
> .panel-heading {
background-color: transparent;
border: none;
color: $default-text;
}
}
.panel-primary {
> .panel-heading {
color: $primary;
background-color: $primary-bg;
border-color: $primary-bg;
}
}
.panel-success {
> .panel-heading {
color: $success;
background-color: $success-bg;
border-color: $success-bg;
}
}
.panel-info {
> .panel-heading {
color: $info;
background-color: $info-bg;
border-color: $info-bg;
}
}
.panel-warning {
> .panel-heading {
color: $warning;
background-color: $warning-bg;
border-color: $warning-bg;
}
}
.panel-danger {
> .panel-heading {
color: $danger;
background-color: $danger-bg;
border-color: $danger-bg;
}
}
/*
.panel-group .panel {
border-radius: 0;
}*/

View File

@ -126,4 +126,5 @@
.tab-content { .tab-content {
padding: 15px; padding: 15px;
background: #ffffff; background: #ffffff;
color: $default-text;
} }

View File

@ -1,3 +1,4 @@
/*
.panel-group { .panel-group {
> .panel { > .panel {
> .panel-heading { > .panel-heading {
@ -24,4 +25,4 @@
.panel-body { .panel-body {
padding: 15px; padding: 15px;
} }
} }*/

View File

@ -1,61 +0,0 @@
$panel-title-height: 35px;
.panel {
border: none;
border-radius: 0px;
background-color: $panel-bg;
position: relative;
transition: all 0.2s ease;
margin-bottom: 24px;
&:hover {
background: $panel-bg-hover;
}
&.animated {
animation-duration: 0.5s;
}
&.small-panel {
height: $small-panel-height;
}
&.medium-panel {
height: $medium-panel-height;
}
&.xmedium-panel {
height: $extra-medium-panel-height;
}
&.large-panel {
height: $large-panel-height;
}
&.viewport100 {
height: calc(100vh - 218px);
}
&.with-scroll {
.panel-body {
height: calc(100% - #{$panel-title-height});
.panel-content {
overflow-y: auto;
}
}
}
}
.panel-heading, .panel-default > .panel-heading {
background-color: transparent;
border: none;
padding: 0 22px;
color: $default-text;
}
.panel-title {
height: $panel-title-height;
line-height: 20px;
padding-top: 15px;
}
.panel-body {
padding: 0;
}
.panel-content {
padding: 15px 22px;
height: 100%;
}

View File

@ -1,3 +1,21 @@
/// Slightly lighten a color
/// @access public
/// @param {Color} $color - color to tint
/// @param {Number} $percentage - percentage of `$color` in returned color
/// @return {Color}
@function tint($color, $percentage) {
@return mix(white, $color, $percentage);
}
/// Slightly darken a color
/// @access public
/// @param {Color} $color - color to shade
/// @param {Number} $percentage - percentage of `$color` in returned color
/// @return {Color}
@function shade($color, $percentage) {
@return mix(black, $color, $percentage);
}
@mixin scrollbars($size, $foreground-color, $background-color: mix($foreground-color, white, 50%)) { @mixin scrollbars($size, $foreground-color, $background-color: mix($foreground-color, white, 50%)) {
::-webkit-scrollbar { ::-webkit-scrollbar {
width: $size; width: $size;

View File

@ -7,17 +7,19 @@ $warning: #bbcb50!default;
$danger: #9d498c!default; $danger: #9d498c!default;
$default: #e9e9e9!default; $default: #e9e9e9!default;
$primary-dark: #1694bf; $primary-dark: shade($primary, 66%);
$success-dark: #1c4a42; $success-dark: shade($success, 66%);
$warning-dark: #8b992d; $warning-dark: shade($warning, 66%);
$danger-dark: #632e58; $danger-dark: shade($danger, 66%);
$primary-light: #5FBCBB; $primary-light: #5FBCBB;
$success-light: #85BA54; $success-light: #85BA54;
$primary-bg: #C5ECF9; $primary-bg: tint($primary, 70%);
$success-bg: #C1DBD7; $info-bg: tint($info, 70%);
$danger-bg: #E1C8DD; $success-bg: tint($success, 70%);
$warning-bg: tint($warning, 70%);
$danger-bg: tint($danger, 70%);
$facebook-color: #3b5998; $facebook-color: #3b5998;
$twitter-color: #55acee; $twitter-color: #55acee;

View File

@ -1,5 +1,5 @@
.popular-app { .popular-app {
.panel-content { .panel-body {
padding: 0; padding: 0;
} }