Download as
Browse Code »

Commit b91f2ae95d9f7c1a59bcd19a21d037b4197c56d4

Authored by Leonardo Merlin
1 parent 72003778
Exists in master and in 8 other branches css-list, feature-captcha, feature-proposal-vote, feature-respostas, production, rafael, staging, the_glorious_return_of_piwik

Add double search

Showing 2 changed files with 49 additions and 10 deletions   Show diff stats
src/app/pages/inicio/inicio.html
  Diff comments   View file @b91f2ae
... ... @@ -63,6 +63,23 @@
63 63 <div class="container">
64 64 <div id="lista-de-programas" class="row">
65 65 <div class="col-sm-4 col-md-3">
  66 + <div class="row visible-xs">
  67 + <div class="col-xs-12">
  68 + <div class="input-group input-group-lg input-group-search">
  69 + <label for="articleQueryFilter" class="control-label sr-only">Buscar programas:</label>
  70 + <input id="articleQueryFilter" type="search" class="form-control input-search" ng-model="pageInicio.query" placeholder="Buscar programas" aria-label="Buscar programas" >
  71 + <span class="input-group-btn">
  72 + <button type="button" class="btn btn-default" ng-click="pageInicio.search()">
  73 + <span class="icon-circle icon-small color-theme-common-bg">
  74 + <span class="glyphicon glyphicon-search"></span>
  75 + </span>
  76 + <span class="sr-only">Buscar</span>
  77 + </button>
  78 + </span>
  79 + </div>
  80 + <br/>
  81 + </div>
  82 + </div>
66 83 <div ng-if="pageInicio.themes">
67 84 <category-list categories="pageInicio.themes" selected-category="pageInicio.selectedTheme"></category-list>
68 85 </div>
... ... @@ -78,22 +95,32 @@
78 95 </div>
79 96 </div>
80 97 <div class="col-sm-8 col-md-9">
  98 + <div class="row hidden-xs">
  99 + <div class="col-xs-12">
  100 + <div class="input-group input-group-lg input-group-search">
  101 + <label for="articleQueryFilter" class="control-label sr-only">Buscar programas:</label>
  102 + <input id="articleQueryFilter" type="search" class="form-control input-search" ng-model="pageInicio.query" placeholder="Buscar programas" aria-label="Buscar programas" >
  103 + <span class="input-group-btn">
  104 + <button type="button" class="btn btn-default" ng-click="pageInicio.search()">
  105 + <span class="icon-circle icon-small color-theme-common-bg">
  106 + <span class="glyphicon glyphicon-search"></span>
  107 + </span>
  108 + <span class="sr-only">Buscar</span>
  109 + </button>
  110 + </span>
  111 + </div>
  112 + </div>
  113 + </div>
81 114 <div class="row">
82 115 <div class="col-sm-12">
83 116 <header class="header">
84   - <h2>Conheça os programas <span class="small">({{pageInicio.filtredPrograms.length}}/{{::pageInicio.programs.length}})</span></h2>
  117 + <h2>Programas</h2>
85 118 <button type="button" class="btn btn-link" ng-click="pageInicio.showAll($event)">
86 119 <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> Ver todos os {{::pageInicio.programs.length}} programas
87 120 </button>
88 121 </header>
89 122 </div>
90 123 </div>
91   - <div class="row">
92   - <div class="col-xs-12">
93   - <label for="articleQueryFilter" class="control-label sr-only">Buscar programas:</label>
94   - <input id="articleQueryFilter" type="search" class="form-control" ng-model="pageInicio.query" placeholder="Buscar programas" aria-label="Buscar programas" >
95   - </div>
96   - </div>
97 124  
98 125 <div class="row">
99 126 <div class="col-sm-12" ng-if="pageInicio.programs">
... ...
src/app/pages/inicio/inicio.scss
  Diff comments   View file @b91f2ae
1 1 .page--inicio {
2   -
  2 +
3 3 .section-video {
4 4 padding: 20px 0;
5 5 // background-color: #919191;
... ... @@ -9,8 +9,6 @@
9 9  
10 10 .header {
11 11 position: relative;
12   - height: 40px;
13   - margin-bottom: 10px;
14 12  
15 13 button {
16 14 position: absolute;
... ... @@ -26,6 +24,20 @@
26 24 }
27 25 }
28 26 }
  27 +
  28 + .input-group-search {
  29 + .icon-circle {
  30 + color: #fff;
  31 + padding: 5px;
  32 + margin-top: -5px;
  33 + }
  34 + button {
  35 + border-left: none;
  36 + }
  37 + }
  38 + .input-group-btn {
  39 + background-color: #fff;
  40 + }
29 41 }
30 42  
31 43 .section-gray {
... ...