jinql
/
blur-admin
mirror of https://github.com/akveo/blur-admin
1
0
Fork 0
Code Issues Releases Wiki Activity

refactor(timeline): enable & relocate to pages, change icons

pull/3/head
alex 2016-01-12 16:49:09 +03:00
parent a302433b13
commit a05d0bdb0a
8 changed files with 132 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
src/app/pages/dashboard/timeline/timeline.html
View File

@ -1,43 +0,0 @@
<!-- todo: remove whole block -->
<section id="cd-timeline" class="cd-container cssanimations" ng-controller="timelineCtrl">
<div class="cd-timeline-block">
<div class="cd-timeline-img cd-picture">
<img src="img/cd-icon-picture.svg" alt="Picture">
</div>
<div class="cd-timeline-content cd-timeline-content-green">
<h5>Title of section 1</h5>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto, optio, dolorum provident rerum aut hic quasi
placeat iure tempora laudantium ipsa ad debitis unde? Iste voluptatibus minus veritatis qui ut.</p>
<span class="cd-date">Jan 14</span>
</div>
</div>
<div class="cd-timeline-block">
<div class="cd-timeline-img cd-movie">
<img src="img/cd-icon-movie.svg" alt="Movie">
</div>
<div class="cd-timeline-content cd-timeline-content-red">
<h5>Title of section 2</h5>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto, optio, dolorum provident rerum aut hic quasi
placeat iure tempora laudantium ipsa ad debitis unde?</p>
<span class="cd-date">Jan 18</span>
</div>
</div>
<div class="cd-timeline-block">
<div class="cd-timeline-img cd-location">
<img src="img/cd-icon-location.svg" alt="Location">
</div>
<div class="cd-timeline-content cd-timeline-content-blue">
<h5>Title of section 3</h5>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto, optio, dolorum provident rerum.</p>
<span class="cd-date">Feb 18</span>
</div>
</div>
</section>

3
src/app/pages/pages.module.js
View File

@ -26,7 +26,8 @@
'BlurAdmin.pages.tables',
'BlurAdmin.pages.tree',
'BlurAdmin.pages.tabs',
'BlurAdmin.pages.typography'
'BlurAdmin.pages.typography',
'BlurAdmin.pages.timeline'
])
.config(routeConfig);

4
src/app/pages/dashboard/timeline/TimelineCtrl.js → src/app/pages/timeline/TimelineCtrl.js
View File

@ -5,8 +5,8 @@
(function () {
'use strict';
angular.module('BlurAdmin.pages.dashboard')
.service('TimelineCtrl', TimelineCtrl);
angular.module('BlurAdmin.pages.timeline')
.controller('TimelineCtrl', TimelineCtrl);
/** @ngInject */
function TimelineCtrl() {

101
src/app/pages/timeline/timeline.html Normal file
View File

@ -0,0 +1,101 @@
<!-- todo: remove whole block -->
<div ba-panel>
<section id="cd-timeline" class="cd-container cssanimations" ng-controller="TimelineCtrl">
<div class="cd-timeline-block">
<div class="cd-timeline-img">
<div class="kameleon-icon with-round-bg success"><img ng-src="{{::( 'Euro-Coin' | kameleonImg )}}"></div>
</div>
<div class="cd-timeline-content cd-timeline-content-green">
<h5>Title of section 1</h5>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Iusto, optio, dolorum provident rerum aut hic quasi
placeat iure tempora laudantium ipsa ad debitis unde? Iste voluptatibus minus veritatis qui ut.</p>
<span class="cd-date">Jan 14</span>
</div>
</div>
<div class="cd-timeline-block">
<div class="cd-timeline-img">
<div class="kameleon-icon with-round-bg danger"><img ng-src="{{::( 'Laptop-Signal' | kameleonImg )}}"></div>
</div>
<div class="cd-timeline-content cd-timeline-content-red">
<h5>Title of section 2</h5>
<p>Donec dapibus at leo eget volutpat. Praesent dolor tellus, ultricies venenatis molestie eu, luctus eget nibh.
Curabitur ullamcorper eleifend nisl.</p>
<span class="cd-date">Jan 18</span>
</div>
</div>
<div class="cd-timeline-block">
<div class="cd-timeline-img">
<div class="kameleon-icon with-round-bg primary"><img ng-src="{{::( 'Checklist' | kameleonImg )}}"></div>
</div>
<div class="cd-timeline-content cd-timeline-content-blue">
<h5>Title of section 3</h5>
<p>Phasellus auctor tellus eget lacinia condimentum. Cum sociis natoque penatibus et magnis dis parturient
montes.</p>
<span class="cd-date">Feb 18</span>
</div>
</div>
<div class="cd-timeline-block">
<div class="cd-timeline-img">
<div class="kameleon-icon with-round-bg success"><img ng-src="{{::( 'Boss-3' | kameleonImg )}}"></div>
</div>
<div class="cd-timeline-content cd-timeline-content-green">
<h5>Title of section 4</h5>
<p>Morbi fringilla in massa ac posuere. Fusce non sagittis massa, id accumsan odio. Nullam eget tempor est.
Etiam eu felis eu purus aliquam tristique id quis nisl. Nam eros nibh, consequat sed pulvinar eu, ultrices
ornare ligula. Aenean interdum sed nunc sed hendrerit.</p>
<span class="cd-date">Feb 20</span>
</div>
</div>
<div class="cd-timeline-block">
<div class="cd-timeline-img">
<div class="kameleon-icon with-round-bg danger"><img ng-src="{{::( 'Online-Shopping' | kameleonImg )}}"></div>
</div>
<div class="cd-timeline-content cd-timeline-content-red">
<h5>Title of section 5</h5>
<p> Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur eget mattis
metus. Nullam egestas eros metus, quis fringilla urna accumsan sed. Aliquam ultrices at arcu vitae
tincidunt.</p>
<span class="cd-date">Feb 21</span>
</div>
</div>
<div class="cd-timeline-block">
<div class="cd-timeline-img">
<div class="kameleon-icon with-round-bg primary"><img ng-src="{{::( 'Money-Increase' | kameleonImg )}}"></div>
</div>
<div class="cd-timeline-content cd-timeline-content-blue">
<h5>Title of section 6</h5>
<p>Praesent bibendum ante mattis augue consectetur, ut commodo turpis consequat. Donec ligula eros, porta in
iaculis vel, semper ac sem. Integer at mauris lorem.</p>
<span class="cd-date">Feb 23</span>
</div>
</div>
<div class="cd-timeline-block">
<div class="cd-timeline-img">
<div class="kameleon-icon with-round-bg success"><img ng-src="{{::( 'Vector' | kameleonImg )}}"></div>
</div>
<div class="cd-timeline-content cd-timeline-content-green">
<h5>Title of section 7</h5>
<p>Vivamus ut laoreet erat, vitae eleifend eros. Sed varius id tellus non lobortis. Sed dolor ante, cursus non
scelerisque sed, euismod id eros.</p>
<span class="cd-date">Feb 24</span>
</div>
</div>
</section>
</div>

19
src/app/pages/timeline/timeline.module.js Normal file
View File

@ -0,0 +1,19 @@
/**
* @author a.demeshko
* created on 1/12/16
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.timeline', [])
.config(routeConfig);
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('timeline', {
url: '/timeline',
templateUrl: 'app/pages/timeline/timeline.html'
});
}
})();

4
src/app/theme/components/contentTop/contentTop.directive.js
View File

@ -44,7 +44,9 @@
'/maps/leaflet': 'Leaflet Map',
'/maps/line': 'Line Map',
'/maps/bubble': 'Bubble Map',
'/panels': 'Panels'
'/panels': 'Panels',
'/timeline': 'Timeline',
};
$scope.$watch(function () {

5
src/app/theme/components/sidebar/SidebarCtrl.js
View File

@ -151,6 +151,11 @@
}
]
},
{
title: 'Timeline',
icon: 'ion-ios-pulse',
root: '#/timeline'
},
{
title: 'User Profile',
icon: 'ion-person',

23
src/sass/theme/dashboard/_timeline.scss
View File

@ -38,29 +38,6 @@
width: 40px;
height: 40px;
border-radius: 50%;
img {
display: block;
width: 24px;
height: 24px;
position: relative;
left: 50%;
top: 50%;
margin-left: -12px;
margin-top: -12px;
}
&.cd-picture {
background: $success;
}
&.cd-movie {
background: $danger;
}
&.cd-location {
background: $primary;
}
}
@media only screen and (min-width: $resXL) {