Commit c51bc7bec68c591af77f24af511cb3110293f450
Exists in
master
and in
8 other branches
Merge branch 'view-program'
Showing
18 changed files
with
343 additions
and
68 deletions
Show diff stats
bower.json
src/app/components/programa/programa.directive.js
... | ... | @@ -9,17 +9,23 @@ |
9 | 9 | function programaBox(api) { |
10 | 10 | |
11 | 11 | /** @ngInject */ |
12 | - function ProgramaController($log) { | |
12 | + function ProgramaController($state, Slug, $log) { | |
13 | 13 | $log.debug('ProgramaController'); |
14 | 14 | |
15 | 15 | var vm = this; |
16 | + vm.$state = $state; | |
17 | + vm.Slug = Slug; | |
16 | 18 | vm.$log = $log; |
17 | 19 | |
18 | 20 | vm.init(); |
19 | 21 | } |
20 | 22 | |
21 | 23 | ProgramaController.prototype.init = function () { |
24 | + var vm = this; | |
22 | 25 | |
26 | + if(!vm.program.slug){ | |
27 | + vm.program.slug = vm.Slug.slugify(vm.program.title); | |
28 | + } | |
23 | 29 | }; |
24 | 30 | |
25 | 31 | ProgramaController.prototype.getCategory = function () { |
... | ... | @@ -49,17 +55,40 @@ |
49 | 55 | return 'TODO: create image alt on server-side.'; |
50 | 56 | }; |
51 | 57 | |
58 | + ProgramaController.prototype.isDisplay = function (display) { | |
59 | + return this.display === display; | |
60 | + }; | |
61 | + | |
62 | + ProgramaController.prototype.isDisplayBox = function () { | |
63 | + return this.isDisplay('box'); | |
64 | + }; | |
65 | + | |
66 | + ProgramaController.prototype.isDisplayPreview = function () { | |
67 | + return this.isDisplay('preview'); | |
68 | + }; | |
69 | + | |
70 | + ProgramaController.prototype.isDisplayContent = function () { | |
71 | + return this.isDisplay('content'); | |
72 | + }; | |
73 | + | |
52 | 74 | ProgramaController.prototype.showContent = function () { |
53 | 75 | var vm = this; |
54 | 76 | |
55 | - vm.$log.debug('TODO: showContent()', vm.program); | |
77 | + vm.$log.info('showContent'); | |
78 | + vm.$state.go('programa', { | |
79 | + slug: vm.program.slug, | |
80 | + program: vm.program | |
81 | + }, { | |
82 | + location: true | |
83 | + }); | |
56 | 84 | }; |
57 | 85 | |
58 | 86 | var directive = { |
59 | 87 | restrict: 'E', |
60 | 88 | templateUrl: 'app/components/programa/programa.html', |
61 | 89 | scope: { |
62 | - program: '=' | |
90 | + program: '=', | |
91 | + display: '=' | |
63 | 92 | }, |
64 | 93 | controller: ProgramaController, |
65 | 94 | controllerAs: 'vm', | ... | ... |
src/app/components/programa/programa.html
1 | -<article class="program-box {{::vm.getCategorySlug()}}" ng-if="vm.program" ng-click="vm.showContent()"> | |
2 | - <h2 class="category-name">{{::vm.getCategoryName()}}</h2> | |
3 | - <div class="image-wrapper"> | |
4 | - <img class="img-responsive" ng-src="{{::vm.getImageUrl()}}" alt="{{::vm.getImageAlt()}}" /> | |
5 | - </div> | |
6 | - <h1 class="program-title">{{::vm.program.title}}</h1> | |
7 | - <div class="program-abstract" ng-bind-html="vm.program.abstract"></div> | |
8 | -</article> | |
1 | +<div ng-if="vm.program"> | |
2 | + <article ng-if="vm.isDisplayBox()" ng-click="vm.showContent()"> | |
3 | + <div class="program-box {{::vm.getCategorySlug()}}"> | |
4 | + <h2 class="program-box--category">{{::vm.getCategoryName()}}</h2> | |
5 | + <div class="program-box--image-wrapper"> | |
6 | + <img class="program-box--image img-responsive" ng-src="{{::vm.getImageUrl()}}" alt="{{::vm.getImageAlt()}}" /> | |
7 | + </div> | |
8 | + <h1 class="program-box--title">{{::vm.program.title}}</h1> | |
9 | + <div class="program-box--abstract" ng-bind-html="vm.program.abstract"></div> | |
10 | + <div class="program-box--button"> | |
11 | + <button class="btn btn-block"> | |
12 | + Participe | |
13 | + </button> | |
14 | + </div> | |
15 | + </div> | |
16 | + </article> | |
17 | + | |
18 | + <article ng-if="vm.isDisplayPreview()"> | |
19 | + <header class="program-banner"> | |
20 | + <img class="program-banner--image" ng-src="{{vm.getImageUrl()}}" alt="{{::vm.getImageAlt()}}"> | |
21 | + <div class="program-banner--strip"> | |
22 | + <h1 class="program-banner--title">{{::vm.program.title}}</h1> | |
23 | + <p class="program-banner--abstract" ng-bind-html="vm.program.abstract"></p> | |
24 | + </div> | |
25 | + </header> | |
26 | + </article> | |
27 | +</div> | ... | ... |
src/app/components/programa/programa.scss
1 | 1 | // Variables |
2 | +$program-box-space: 20px; | |
2 | 3 | $scale: 1.1; |
3 | 4 | $time: .3s; |
4 | 5 | |
5 | 6 | // sandbox |
6 | 7 | .program-box { |
7 | 8 | cursor: pointer; |
8 | - .category-name { | |
9 | + background-color: #fff; | |
10 | + margin-bottom: $program-box-space; | |
11 | + | |
12 | + .contraste & { | |
13 | + color: #fff; | |
14 | + background-color: #262626; | |
15 | + } | |
16 | + | |
17 | + &--category { | |
9 | 18 | font-size: 14px; |
10 | 19 | font-weight: bold; |
11 | - line-height: 30px; | |
20 | + text-transform: uppercase; | |
21 | + line-height: 22px; | |
12 | 22 | display: block; |
13 | 23 | height: 30px; |
14 | - margin-bottom: 0; | |
24 | + margin: 0; | |
25 | + padding: 5px $program-box-space; | |
15 | 26 | color: #ffffff; |
16 | - background-color: #000000; | |
27 | + | |
28 | + @each $category, $color in $categories { | |
29 | + .#{$category} & { | |
30 | + background-color: $color; | |
31 | + } | |
32 | + } | |
33 | + | |
34 | + .contraste & { | |
35 | + background-color: #262626; | |
36 | + } | |
17 | 37 | } |
18 | - .image-wrapper { | |
38 | + | |
39 | + &--title { | |
40 | + font-size: 18px; | |
41 | + font-weight: bold; | |
42 | + padding: 0 $program-box-space; | |
43 | + margin: 0 0 10px 0; | |
44 | + } | |
45 | + | |
46 | + &--abstract { | |
47 | + padding: 0 $program-box-space; | |
48 | + } | |
49 | + | |
50 | + &--button { | |
51 | + padding: $program-box-space; | |
52 | + .btn { | |
53 | + color: #fff; | |
54 | + font-weight: bold; | |
55 | + | |
56 | + @each $category, $color in $categories { | |
57 | + .#{$category} & { | |
58 | + background-color: $color; | |
59 | + } | |
60 | + } | |
61 | + | |
62 | + .contraste & { | |
63 | + color: #262626; | |
64 | + background-color: #fff; | |
65 | + } | |
66 | + } | |
67 | + } | |
68 | + | |
69 | + &--image-wrapper { | |
19 | 70 | position: relative; |
20 | 71 | // width: 100%; |
21 | 72 | // width: 370px; |
... | ... | @@ -23,14 +74,17 @@ $time: .3s; |
23 | 74 | |
24 | 75 | overflow: hidden; |
25 | 76 | text-align: center; |
77 | + min-height: 170px; | |
26 | 78 | } |
27 | - .img-responsive { | |
79 | + | |
80 | + &--image { | |
28 | 81 | -webkit-transition: all $time ease-in-out; |
29 | 82 | -moz-transition: all $time ease-in-out; |
30 | 83 | -o-transition: all $time ease-in-out; |
31 | 84 | transition: all $time ease-in-out; |
32 | 85 | } |
33 | - &:hover .img-responsive { | |
86 | + | |
87 | + &:hover .program-box--image { | |
34 | 88 | -webkit-transform: scale($scale); /* prefixo para browsers webkit */ |
35 | 89 | -moz-transform: scale($scale); /* prefixo para browsers gecko */ |
36 | 90 | -o-transform: scale($scale); /* prefixo para opera */ | ... | ... |
src/app/components/programas/programas.directive.js
src/app/components/programas/programas.html
... | ... | @@ -34,11 +34,13 @@ |
34 | 34 | <label for="programListFilter" class="control-label sr-only">Filtrar programas:</label> |
35 | 35 | <input id="programListFilter" type="search" class="form-control" ng-model="vm.query" placeholder="Filtrar programas" aria-label="Filtrar programas" > |
36 | 36 | |
37 | - <select class="form-control" ng-model="vm.categoryFilter" ng-options="category.name for category in vm.categories track by category.slug"> | |
37 | + <!-- <label for="selectCategoryFilter" class="control-label sr-only">Filtrar por tema:</label> | |
38 | + <select id="selectCategoryFilter" name="selectCategoryFilter" class="form-control" ng-model="vm.categoryFilter" ng-options="category.name for category in vm.categories track by category.slug"> | |
38 | 39 | <option value="">-- Filtrar por tema --</option> |
39 | - </select> | |
40 | + </select> --> | |
40 | 41 | |
41 | - <select class="form-control" ng-model="vm.orderCriteria" ng-options="orderCriteria.label for orderCriteria in vm.orderCriteries"> | |
42 | + <label for="selectOrderBy" class="control-label sr-only">Ordernar por:</label> | |
43 | + <select id="selectOrderBy" name="selectOrderBy" class="form-control" ng-model="vm.orderCriteria" ng-options="orderCriteria.label for orderCriteria in vm.orderCriteries"> | |
42 | 44 | <option value="">-- Ordernar por: --</option> |
43 | 45 | </select> |
44 | 46 | |
... | ... | @@ -56,7 +58,7 @@ |
56 | 58 | </aside> |
57 | 59 | </div> |
58 | 60 | <div ng-repeat="program in vm.programs | filterByCategory:vm.categoryFilter | filterByCriteria:vm.orderCriteria:orderReverse | filter:vm.query | limitTo:vm.limitTo as results"> |
59 | - <programa-box program="program" class="col-sm-12 col-md-6"></programa-box> | |
61 | + <programa-box program="program" display="'box'" class="col-xs-12 col-sm-6"></programa-box> | |
60 | 62 | <div ng-if="$odd" class="clearfix"></div> |
61 | 63 | </div> |
62 | 64 | <div class="animate-repeat" ng-if="results.length == 0"> | ... | ... |
src/app/index.constants.js
... | ... | @@ -6,7 +6,8 @@ |
6 | 6 | .module('dialoga') |
7 | 7 | .constant('api', { |
8 | 8 | token: null, |
9 | - host: 'http://hom.login.dialoga.gov.br', | |
9 | + hostHom: 'http://hom.dialoga.gov.br', | |
10 | + hostProd: 'http://login.dialoga.gov.br', | |
10 | 11 | // host: 'http://www.participa.br', |
11 | 12 | articleId: { |
12 | 13 | home: 103358 | ... | ... |
src/app/index.module.js
src/app/index.route.js
... | ... | @@ -56,6 +56,18 @@ |
56 | 56 | 'footer': { templateUrl: 'app/partials/footer/footer.html' } |
57 | 57 | } |
58 | 58 | }) |
59 | + .state('programa', { | |
60 | + url: '/programa/:slug', | |
61 | + views: { | |
62 | + 'header': { templateUrl: 'app/partials/header/header.html' }, | |
63 | + 'main': { | |
64 | + templateUrl: 'app/partials/programas/programa.html', | |
65 | + controller: 'ProgramaController', | |
66 | + controllerAs: 'programa' | |
67 | + }, | |
68 | + 'footer': { templateUrl: 'app/partials/footer/footer.html' } | |
69 | + } | |
70 | + }) | |
59 | 71 | .state('sobre', { |
60 | 72 | url: '/sobre', |
61 | 73 | views: { | ... | ... |
src/app/index.run.js
... | ... | @@ -6,6 +6,7 @@ |
6 | 6 | .module('dialoga') |
7 | 7 | .run(runAuth) |
8 | 8 | .run(runAccessibility) |
9 | + .run(runPath) | |
9 | 10 | .run(runBlock); |
10 | 11 | |
11 | 12 | /** @ngInject */ |
... | ... | @@ -73,6 +74,14 @@ |
73 | 74 | } |
74 | 75 | |
75 | 76 | /** @ngInject */ |
77 | + function runPath($rootScope, api, $log) { | |
78 | + var isProduction = (/^http:\/\/dialoga\.gov\.br\//.test(window.location.href)); | |
79 | + $rootScope.basePath = isProduction ? api.hostProd : api.hostHom; | |
80 | + | |
81 | + $log.debug('runPath end.'); | |
82 | + } | |
83 | + | |
84 | + /** @ngInject */ | |
76 | 85 | function runBlock($log) { |
77 | 86 | $log.debug('runBlock end.'); |
78 | 87 | } | ... | ... |
src/app/index.scss
... | ... | @@ -20,42 +20,17 @@ $gray: #f1f1f1; |
20 | 20 | |
21 | 21 | // ------------- |
22 | 22 | |
23 | +// 1.4 - dicionarios | |
24 | +$categories: (saude: #3449b7, seguranca-publica: #e34748, educacao: #f39720, reducao-da-pobreza: #3ebb8f, cultura: #a63738); | |
25 | +$categories-descriptions: (saude: "Saúde é direito de todos e dever do Estado. O Sistema Único de Saúde (SUS) é universal, integral e de responsabilidade do Governo Federal, estados e municípios. Atende a todos os brasileiros.", seguranca-publica: "A segurança pública é um direito fundamental dos cidadãos. A proteção da vida, a disseminação da cultura da paz e a integração dos órgãos e instituições municipais, estaduais e federais são os maiores compromissos dessa política pública.", educacao: "Uma pátria educadora se faz com oportunidades para todos. Nos últimos anos, o Brasil criou esse caminho de oportunidades. Ampliamos o acesso à educação em todos os níveis de ensino – da creche à pós-graduação – e para todos os brasileiros, independentemente de sua classe social. E ainda há muito a fazer. O Plano Nacional de Educação (PNE) estabelece novas metas para que o governo federal trabalhe em parceria com a sociedade, com os estados e os municípios na construção de um futuro melhor. Queremos agora um salto na qualidade do ensino.", reducao-da-pobreza: "Com o esforço do Brasil para reduzir a pobreza e a desigualdade, 36 milhões de pessoas superaram a miséria na última década e o país saiu do Mapa da Fome das Nações Unidas.", cultura: "O que nos singulariza no conjunto das nações é, em última instância, nossa cultura. É por ela que nos identificamos como brasileiros de norte a sul deste país. Uma grande nação precisa ter um desenvolvimento cultural à altura de sua grandeza, contemplando as dimensões simbólica, econômica e cidadã da cultura, que são parte central do projeto de um país democrático e plural. A pluralidade é nossa singularidade."); | |
23 | 26 | |
24 | 27 | // ------------- |
25 | -// Paleta de Cores | |
26 | -// ------------- | |
27 | -$cinza1: #f1f1f1; | |
28 | -$cinza2: #eaeaea; | |
29 | -$cinza3: #dadada; | |
30 | -$cinza4: #989898; | |
31 | -$cinza5: #606060; | |
32 | -$cinza6: #484848; | |
33 | - | |
34 | - | |
35 | -// ------------- | |
36 | -// Tipografia | |
37 | -// ------------- | |
38 | -// $open-sans-regular: | |
39 | -// $open-sans-bold: | |
40 | -$titulo1-size: 32pt; | |
41 | -$titulo1-line-height: 36pt; | |
42 | 28 | |
43 | -$titulo2-size: 26pt; | |
44 | -$titulo2-line-height: 30pt; | |
45 | - | |
46 | -$titulo3-size: 22pt; | |
47 | -$titulo3-line-height: 26pt; | |
48 | - | |
49 | -$titulo4-size: 18pt; | |
50 | -$titulo4-line-height: 22pt; | |
51 | - | |
52 | -$titulo5-size: 14pt; | |
53 | -$titulo5-line-height: 18pt; | |
29 | +body { | |
30 | + // font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; | |
31 | +} | |
54 | 32 | |
55 | -$paragraph-size: 12pt; | |
56 | -$paragraph-line-height: 16pt; | |
57 | 33 | |
58 | -// ------------- | |
59 | 34 | .skip-links a:focus { |
60 | 35 | background-color: #fff !important; |
61 | 36 | opacity: 1; | ... | ... |
src/app/partials/article/article.service.js
... | ... | @@ -6,33 +6,53 @@ |
6 | 6 | .factory('ArticleService', ArticleService); |
7 | 7 | |
8 | 8 | /** @ngInject */ |
9 | - function ArticleService($http, $q, api, UtilService, $log) { | |
9 | + function ArticleService($http, $q, $rootScope, UtilService, Slug, $log) { | |
10 | 10 | $log.debug('ArticleService'); |
11 | 11 | |
12 | 12 | var idArticleHome = '103358'; |
13 | 13 | var _savedAbstract = null; |
14 | 14 | |
15 | 15 | var service = { |
16 | - apiArticles: api.host + '/api/v1/articles/', | |
16 | + apiArticles: $rootScope.basePath + '/api/v1/articles/', | |
17 | 17 | getHome: getHome, |
18 | + getArticleBySlug: getArticleBySlug, | |
18 | 19 | setHomeAbstract: setHomeAbstract, |
19 | 20 | getHomeAbstract: getHomeAbstract |
20 | 21 | }; |
21 | 22 | |
23 | + var CACHE = {}; // cache by article id | |
24 | + | |
22 | 25 | return service; |
23 | 26 | |
24 | - function getHome () { | |
25 | - return getArticleById(idArticleHome); | |
26 | - } | |
27 | + function loadArticleById (articleId, cbSuccess, cbError) { | |
27 | 28 | |
28 | - function getArticleById (articleId) { | |
29 | 29 | var url = service.apiArticles + articleId; |
30 | 30 | var params = { |
31 | 31 | fields: 'id,children,categories,abstract,title,image,url,setting,position', |
32 | 32 | private_token: 'null' |
33 | 33 | }; |
34 | 34 | |
35 | - return UtilService.get(url, {params: params}); | |
35 | + UtilService.get(url, {params: params}).then(function(data){ | |
36 | + CACHE[articleId] = data; | |
37 | + cbSuccess(data); | |
38 | + }, function(error){ | |
39 | + cbError(error); | |
40 | + }); | |
41 | + | |
42 | + } | |
43 | + | |
44 | + function getArticleById (articleId, cbSuccess, cbError) { | |
45 | + var cachedArticle = CACHE[articleId]; | |
46 | + | |
47 | + if(cachedArticle){ | |
48 | + cbSuccess(cachedArticle); | |
49 | + }else{ | |
50 | + loadArticleById(articleId, cbSuccess, cbError); | |
51 | + } | |
52 | + } | |
53 | + | |
54 | + function getHome (cbSuccess, cbError) { | |
55 | + return getArticleById(idArticleHome, cbSuccess, cbError); | |
36 | 56 | } |
37 | 57 | |
38 | 58 | function setHomeAbstract (newAbstract) { |
... | ... | @@ -42,5 +62,34 @@ |
42 | 62 | function getHomeAbstract () { |
43 | 63 | return _savedAbstract; |
44 | 64 | } |
65 | + | |
66 | + function getArticleBySlug (slug, cbSuccess, cbError) { | |
67 | + var vm = this; | |
68 | + | |
69 | + vm.getHome(function (data) { | |
70 | + var mainArticle = data.article; | |
71 | + var programList = mainArticle.children; | |
72 | + var result = null; | |
73 | + | |
74 | + for (var i = programList.length - 1; i >= 0; i--) { | |
75 | + var program = programList[i]; | |
76 | + | |
77 | + if(!program.slug){ | |
78 | + program.slug = Slug.slugify(program.title); | |
79 | + } | |
80 | + | |
81 | + if(program.slug === slug){ | |
82 | + result = program; | |
83 | + break; | |
84 | + } | |
85 | + } | |
86 | + | |
87 | + if(result){ | |
88 | + cbSuccess(result); | |
89 | + }else{ | |
90 | + cbError('None program with slug "' + slug + '"" was found.'); | |
91 | + } | |
92 | + }, cbError); | |
93 | + } | |
45 | 94 | } |
46 | 95 | })(); | ... | ... |
src/app/partials/header/header.html
... | ... | @@ -16,4 +16,11 @@ |
16 | 16 | <div class="row"> |
17 | 17 | <app-navbar></app-navbar> |
18 | 18 | </div> |
19 | + | |
20 | + <!-- TODO: breadcrumb --> | |
21 | + <!-- <ol class="breadcrumb"> | |
22 | + <li><a href="#">Home</a></li> | |
23 | + <li><a href="#">Library</a></li> | |
24 | + <li class="active">Data</li> | |
25 | + </ol> --> | |
19 | 26 | </header> | ... | ... |
src/app/partials/inicio/inicio.controller.js
... | ... | @@ -32,8 +32,8 @@ |
32 | 32 | hideBackground(2000); |
33 | 33 | } |
34 | 34 | |
35 | - vm.ArticleService.getHome().then(function(result) { | |
36 | - vm.article = result.article; | |
35 | + vm.ArticleService.getHome(function(data) { | |
36 | + vm.article = data.article; | |
37 | 37 | }, function(error) { |
38 | 38 | vm.$log.error('Error on getHome article.', error); |
39 | 39 | }); | ... | ... |
... | ... | @@ -0,0 +1,65 @@ |
1 | +(function() { | |
2 | + 'use strict'; | |
3 | + | |
4 | + angular | |
5 | + .module('dialoga') | |
6 | + .controller('ProgramaController', ProgramaController); | |
7 | + | |
8 | + /** @ngInject */ | |
9 | + function ProgramaController(ArticleService, $state, $rootScope, $log) { | |
10 | + $log.debug('ProgramaController'); | |
11 | + | |
12 | + var vm = this; | |
13 | + | |
14 | + vm.ArticleService = ArticleService; | |
15 | + vm.$state = $state; | |
16 | + vm.$log = $log; | |
17 | + | |
18 | + vm.init(); | |
19 | + } | |
20 | + | |
21 | + ProgramaController.prototype.init = function () { | |
22 | + var vm = this; | |
23 | + | |
24 | + var params = vm.$state.params; | |
25 | + var slug = params.slug; | |
26 | + | |
27 | + vm.program = null; | |
28 | + | |
29 | + vm.ArticleService.getArticleBySlug(slug, function(program){ | |
30 | + vm.program = program; | |
31 | + | |
32 | + // load proposals | |
33 | + // vm.ArticleService.getRandomProposals(program.id).then(function(proposal){ | |
34 | + // vm.program.proposal = proposal; | |
35 | + // }, function (error){ | |
36 | + // vm.$log.error(error); | |
37 | + // }); | |
38 | + | |
39 | + // load events | |
40 | + // vm.ArticleService.getEvents(program.id).then(function(proposal){ | |
41 | + // vm.program.proposal = proposal; | |
42 | + // }, function (error){ | |
43 | + // vm.$log.error(error); | |
44 | + // }); | |
45 | + | |
46 | + // load body content | |
47 | + // vm.ArticleService.getBodyContent(program.id).then(function(proposal){ | |
48 | + // vm.program.proposal = proposal; | |
49 | + // }, function (error){ | |
50 | + // vm.$log.error(error); | |
51 | + // }); | |
52 | + | |
53 | + }, function (error) { | |
54 | + vm.$log.error(error); | |
55 | + vm.$log.info('Rollback to home page.'); | |
56 | + vm.$state.go('inicio', {}, {location: true}); | |
57 | + }); | |
58 | + }; | |
59 | + | |
60 | + ProgramaController.prototype.goBack = function () { | |
61 | + var vm = this; | |
62 | + | |
63 | + vm.$log.warn('Not implemented yet!'); | |
64 | + }; | |
65 | +})(); | ... | ... |
... | ... | @@ -0,0 +1,35 @@ |
1 | +<div class="container"> | |
2 | + | |
3 | + <div class="article-bar" ng-class="programa.program.categories[0].slug"> | |
4 | + <div class="navbar"> | |
5 | + <div class="navbar-header"> | |
6 | + <button class="btn btn-link" ng-click="programa.goBack()"> | |
7 | + <!-- <span class="glyphicon glyphicon-share-alt" aria-hidden="true"></span> --> | |
8 | + <span class="glyphicon glyphicon-arrow-left" aria-hidden="true"></span> | |
9 | + Voltar | |
10 | + </button> | |
11 | + </div> | |
12 | + <div class="navbar-left"> | |
13 | + <button class="btn btn-link"> | |
14 | + <span class="glyphicon glyphicon-refresh"></span> | |
15 | + <span class="category-name">{{::programa.program.categories[0].name}}</span> | |
16 | + </button> | |
17 | + </div> | |
18 | + <div class="navbar-right"> | |
19 | + <select name="selectCategory" id="selectCategory-{{::programa.program.categories[0].id}}" class="form-control"> | |
20 | + <option value="">-- Selectione um Tema --</option> | |
21 | + </select> | |
22 | + </div> | |
23 | + </div> | |
24 | + </div> | |
25 | + | |
26 | + <div ng-if="!programa.program"> | |
27 | + <div class="alert alert-info" role="alert">Carregando informações sobre o progama</div> | |
28 | + </div> | |
29 | + | |
30 | + <div ng-if="programa.program"> | |
31 | + <programa-box program="programa.program" display="'preview'"></programa-box> | |
32 | + </div> | |
33 | + <div id="content" ng-bind-html="programa.program.body"></div> | |
34 | +</div> | |
35 | + | ... | ... |
... | ... | @@ -0,0 +1,19 @@ |
1 | +.article-bar { | |
2 | + | |
3 | + .btn { | |
4 | + color: #fff; | |
5 | + font-weight: bold; | |
6 | + } | |
7 | + | |
8 | + @each $category, $color in $categories { | |
9 | + &.#{$category} { | |
10 | + background-color: $color; | |
11 | + } | |
12 | + } | |
13 | + | |
14 | + .contraste & { | |
15 | + background-color: #262626; | |
16 | + } | |
17 | +} | |
18 | + | |
19 | + | ... | ... |
src/index.html
1 | 1 | <!doctype html> |
2 | -<!--[if lt IE 7]> <html lang="pt-br" ng-app="dialoga" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> | |
3 | -<!--[if IE 7]> <html lang="pt-br" ng-app="dialoga" class="no-js lt-ie9 lt-ie8"> <![endif]--> | |
4 | 2 | <!--[if IE 8]> <html lang="pt-br" ng-app="dialoga" class="no-js lt-ie9"> <![endif]--> |
5 | 3 | <!--[if gt IE 8]><!--> <html class="no-js" lang="pt-br" ng-app="dialoga"> <!--<![endif]--> |
6 | 4 | <head> | ... | ... |