diff --git a/.csscomb.json b/.csscomb.json new file mode 100644 index 0000000..13cb49c --- /dev/null +++ b/.csscomb.json @@ -0,0 +1,18 @@ +{ + "always-semicolon": true, + "block-indent": 4, + "color-case": "lower", + "color-shorthand": false, + "element-case": "lower", + "eof-newline": true, + "exclude": ["node_modules/**", "bower_components/**"], + "leading-zero": false, + "space-after-combinator": 1, + "space-between-declarations": "\n", + "space-after-opening-brace": "\n", + "space-after-selector-delimiter": "\n", + "space-before-closing-brace": "\n", + "space-before-colon": "", + "space-before-combinator": 1, + "space-before-opening-brace": 1 +} diff --git a/.editorconfig b/.editorconfig index e717f5e..85ee892 100644 --- a/.editorconfig +++ b/.editorconfig @@ -11,3 +11,6 @@ insert_final_newline = true [*.md] trim_trailing_whitespace = false + +[*.{sass,scss}] +indent_size = 4 diff --git a/src/app/components/programa/programa.directive.js b/src/app/components/programa/programa.directive.js index c3bf44b..e8790b1 100644 --- a/src/app/components/programa/programa.directive.js +++ b/src/app/components/programa/programa.directive.js @@ -29,9 +29,11 @@ }; ProgramaController.prototype.getCategoryName = function () { - var vm = this; + return this.getCategory().name; + }; - return vm.getCategory().name; + ProgramaController.prototype.getCategorySlug = function () { + return this.getCategory().slug; }; ProgramaController.prototype.getImageUrl = function () { diff --git a/src/app/components/programa/programa.html b/src/app/components/programa/programa.html index 96997ef..8e3e71d 100644 --- a/src/app/components/programa/programa.html +++ b/src/app/components/programa/programa.html @@ -1,8 +1,8 @@ -
-
{{::vm.getCategoryName()}}
+
+

{{::vm.getCategoryName()}}

- {{::vm.getImageAlt()}} + {{::vm.getImageAlt()}}
-
{{::vm.program.title}}
+

{{::vm.program.title}}

-
+ diff --git a/src/app/components/programa/programa.scss b/src/app/components/programa/programa.scss index 262365c..e0889d4 100644 --- a/src/app/components/programa/programa.scss +++ b/src/app/components/programa/programa.scss @@ -1,37 +1,39 @@ // Variables $scale: 1.1; -$time: 0.3s; +$time: .3s; // sandbox .program-box { - cursor: pointer; + cursor: pointer; + .category-name { + font-size: 14px; + font-weight: bold; + line-height: 30px; + display: block; + height: 30px; + margin-bottom: 0; + color: #ffffff; + background-color: #000000; + } + .image-wrapper { + position: relative; + // width: 100%; + // width: 370px; + // height: 170px; - .category { - display: block; - height: 30px; - line-height: 30px; - } - - .image-wrapper { - position: relative; - // width: 100%; - // width: 370px; - // height: 170px; - overflow: hidden; - text-align: center; - } - - .img-responsive { - -webkit-transition: all $time ease-in-out; - -moz-transition: all $time ease-in-out; - -o-transition: all $time ease-in-out; - transition: all $time ease-in-out; - } - - &:hover .img-responsive { - -webkit-transform: scale($scale); /* prefixo para browsers webkit */ - -moz-transform: scale($scale); /* prefixo para browsers gecko */ - -o-transform: scale($scale); /* prefixo para opera */ - transform: scale($scale); - } + overflow: hidden; + text-align: center; + } + .img-responsive { + -webkit-transition: all $time ease-in-out; + -moz-transition: all $time ease-in-out; + -o-transition: all $time ease-in-out; + transition: all $time ease-in-out; + } + &:hover .img-responsive { + -webkit-transform: scale($scale); /* prefixo para browsers webkit */ + -moz-transform: scale($scale); /* prefixo para browsers gecko */ + -o-transform: scale($scale); /* prefixo para opera */ + transform: scale($scale); + } } diff --git a/src/app/components/programas/programas.directive.js b/src/app/components/programas/programas.directive.js index a16636c..8c54430 100644 --- a/src/app/components/programas/programas.directive.js +++ b/src/app/components/programas/programas.directive.js @@ -37,18 +37,19 @@ vm.categories = vm.article.categories; vm.programs = vm.article.children; vm.filtredProgramList = []; - - vm.search = vm.$location.search(); - vm.query = vm.search ? vm.search.filtro : null; - vm.limitTo = vm.search ? vm.search.limite : 4; - vm.categoryFilter = vm.search ? vm.filterByCategorySlug(vm.search.tema) : null; - vm.categoryOptions = null; vm.orderCriteries = [ { label: 'Título', name: 'title' }, - { label: 'Tema', name: 'category' }, - { label: 'Mais participações', name: 'more_participants' } + { label: 'Tema', name: 'category' } + // , { label: 'Mais participações', name: 'more_participants' } ]; + vm.search = vm.$location.search(); + + // Add initial values for the filter + vm.query = (vm.search && vm.search.filtro) ? vm.search.filtro : null; + vm.limitTo = (vm.search && vm.search.limite) ? parseInt(vm.search.limite, 10) : 4; + vm.categoryFilter = (vm.search && vm.search.tema) ? vm.filterByCategorySlug(vm.search.tema) : null; + // update window location params vm.$scope.$watch('vm.query', function(newValue, oldValue){ vm.search.filtro = newValue; @@ -67,6 +68,14 @@ }; + ProgramaListController.prototype.resetFilterValues = function () { + var vm = this; + + vm.query = null; + vm.limitTo = 4; + vm.categoryFilter = null; + }; + ProgramaListController.prototype.getIconClasses = function (category) { var vm = this; @@ -86,10 +95,13 @@ return result; } - ProgramaListController.prototype.filterByCategory = function (category) { + ProgramaListController.prototype.filterByCategory = function (category, $event) { var vm = this; + $event.stopPropagation(); + if(category !== vm.categoryFilter){ + // selected new filter vm.categoryFilter = category; }else{ @@ -98,12 +110,12 @@ } }; - ProgramaListController.prototype.showAll = function () { + ProgramaListController.prototype.showAll = function ($event) { var vm = this; - vm.query = null; - vm.categoryFilter = null; - vm.$log.debug('[TODO] showAll, no filter? ', vm.categoryFilter); + $event.stopPropagation(); + + vm.resetFilterValues(); }; // function ProgramaListLinker (scope, element, attrs) { diff --git a/src/app/components/programas/programas.html b/src/app/components/programas/programas.html index 175b2b2..5a202aa 100644 --- a/src/app/components/programas/programas.html +++ b/src/app/components/programas/programas.html @@ -1,13 +1,13 @@
- +
-
-
+
+

Programas

- -
+
-
+
+
@@ -63,6 +63,6 @@ Nenhum programa encontrado.
-
+
diff --git a/src/app/index.scss b/src/app/index.scss index 77b716e..293ace4 100644 --- a/src/app/index.scss +++ b/src/app/index.scss @@ -20,6 +20,42 @@ $gray: #f1f1f1; // ------------- + +// ------------- +// Paleta de Cores +// ------------- +$cinza1: #f1f1f1; +$cinza2: #eaeaea; +$cinza3: #dadada; +$cinza4: #989898; +$cinza5: #606060; +$cinza6: #484848; + + +// ------------- +// Tipografia +// ------------- +// $open-sans-regular: +// $open-sans-bold: +$titulo1-size: 32pt; +$titulo1-line-height: 36pt; + +$titulo2-size: 26pt; +$titulo2-line-height: 30pt; + +$titulo3-size: 22pt; +$titulo3-line-height: 26pt; + +$titulo4-size: 18pt; +$titulo4-line-height: 22pt; + +$titulo5-size: 14pt; +$titulo5-line-height: 18pt; + +$paragraph-size: 12pt; +$paragraph-line-height: 16pt; + +// ------------- .skip-links a:focus { background-color: #fff !important; opacity: 1; -- libgit2 0.21.2