Download as
Browse Code »

Commit e0330cec8c810e85926de6b3a1a75de92d001da8

Authored by Rafael Diego
2 parents 3f4d9010 28c44862
Exists in master and in 4 other branches feature-captcha, production, staging, the_glorious_return_of_piwik

Merge branch 'banner'

Showing 6 changed files with 154 additions and 77 deletions   Show diff stats
src/app/pages/inicio/inicio.html
  Diff comments   View file @e0330ce
... ... @@ -24,7 +24,8 @@
24 24 </div>
25 25 </div>
26 26 </div>
27   - <div class="col-md-4" ng-if="pageInicio.featuredEvent">
  27 + <!-- Não faz sentido, mas poppi pediu para esconder por enquanto -->
  28 + <div class="col-md-4" ng-hide="pageInicio.featuredEvent" ng-show="pageInicio.featuredEvent">
28 29 <div class="row">
29 30 <div class="featured-event--box" ng-click="pageInicio.showEventVideo()">
30 31 <div class="box-top col-xs-12 col-sm-4 col-md-12">
... ... @@ -43,7 +44,8 @@
43 44 </div>
44 45 </div>
45 46 </div>
46   - <div class="col-md-4" ng-if="pageInicio.bannerRespostas">
  47 + <!-- Não faz sentido, mas poppi pediu para esconder por enquanto -->
  48 + <div class="col-md-4" ng-hide="pageInicio.bannerRespostas" ng-show="pageInicio.bannerRespostas">
47 49 <div class="banner-respostas">
48 50 <a ui-sref="respostas" class="banner-respostas--link-top">
49 51 <span class="banner-respostas--background-image" aria-hidden="true"></span>
... ... @@ -58,6 +60,22 @@
58 60 <a ui-sref="respostas" class="banner-respostas--link-bottom">Veja todas as respostas das propostas </a>
59 61 </div>
60 62 </div>
  63 + <div class="col-md-4" ng-show="pageInicio.bannerRespostas">
  64 + <div class="banner-respostas banner-respostas--background-pink">
  65 + <a ui-sref="respostas" class="banner-respostas--link-top">
  66 + <span class="img-banner">
  67 + <img class="banner-respostas--logo banner-respostas--logo-small" src="/assets/images/marca_banner2.png" alt="Logo Dialoga Brasil"/>
  68 + </span>
  69 + <br>
  70 + <span class="banner-respostas--text2 text-shadow">O GOVERNO FEDERAL SEGUE DIALOGANDO COM A SOCIEDADE</span>
  71 + <br>
  72 + <span class="banner-respostas--text3 text-bold">VOCÊ FEZ SUA PARTE PARTICIPANDO COM PROPOSTAS PARA MELHORAR O PAÍS E O GOVERNO RESPONDEU.</span>
  73 + </a>
  74 + <div class="teste vertical-align">
  75 + <a ui-sref="respostas" class="banner-respostas--banner2--link-bottom">CONFIRA AQUI O RESULTADO!</a>
  76 + </div>
  77 + </div>
  78 + </div>
61 79 </div>
62 80 </div>
63 81 </section>
... ... @@ -106,75 +124,75 @@
106 124 <label for="articleQueryFilter1" class="control-label sr-only">Buscar programas:</label>
107 125 <input id="articleQueryFilter1" type="search" class="form-control input-search" ng-model="pageInicio.query" placeholder="Buscar programas" aria-label="Buscar programas">
108 126 <span class="input-group-btn">
109   - <button type="button" class="btn btn-default" ng-click="pageInicio.submitSearch()">
110   - <span class="icon-circle icon-small color-theme-common-bg">
111   - <span class="glyphicon glyphicon-search"></span>
112   - </span>
113   - <span class="sr-only">Buscar</span>
114   - </button>
115   - </span>
116   - </div>
117   - <br/>
118   - </div>
119   - </div>
120   - <div ng-if="pageInicio.themes && !vm.loadingFilter">
121   - <category-list categories="pageInicio.themes" selected-category="pageInicio.selectedTheme"></category-list>
122   - </div>
123   - <div ng-if="!pageInicio.themes && pageInicio.loadingThemes">
124   - <div class="alert alert-info" role="alert">
125   - Carregando temas.
126   - </div>
127   - </div>
128   - <div ng-if="!pageInicio.themes && pageInicio.themesError">
129   - <div class="alert alert-danger" role="alert">
130   - Não foi possível carregar a lista de temas neste momento.
131   - </div>
132   - </div>
  127 + <button type="button" class="btn btn-default" ng-click="pageInicio.submitSearch()">
  128 + <span class="icon-circle icon-small color-theme-common-bg">
  129 + <span class="glyphicon glyphicon-search"></span>
  130 + </span>
  131 + <span class="sr-only">Buscar</span>
  132 + </button>
  133 + </span>
  134 + </div>
  135 + <br/>
  136 + </div>
  137 + </div>
  138 + <div ng-if="pageInicio.themes && !vm.loadingFilter">
  139 + <category-list categories="pageInicio.themes" selected-category="pageInicio.selectedTheme"></category-list>
  140 + </div>
  141 + <div ng-if="!pageInicio.themes && pageInicio.loadingThemes">
  142 + <div class="alert alert-info" role="alert">
  143 + Carregando temas.
133 144 </div>
134   - <div class="col-sm-8 col-md-9">
135   - <div class="row hidden-xs">
136   - <div class="col-xs-12">
137   - <div class="input-group input-group-lg input-group-search">
138   - <label for="articleQueryFilter2" class="control-label sr-only">Buscar programas:</label>
139   - <input id="articleQueryFilter2" type="search" class="form-control input-search" ng-model="pageInicio.query" placeholder="Buscar programas" aria-label="Buscar programas">
140   - <span class="input-group-btn">
141   - <button type="button" class="btn btn-default" ng-click="pageInicio.submitSearch()">
142   - <span class="icon-circle icon-small color-theme-common-bg">
143   - <span class="glyphicon glyphicon-search"></span>
144   - </span>
145   - <span class="sr-only">Buscar</span>
146   - </button>
147   - </span>
148   - </div>
149   - </div>
150   - </div>
151   - <div id="search-result" class="row">
152   - <div class="col-sm-12">
153   - <header class="header">
154   - <h2>Programas</h2>
155   - <button type="button" class="btn btn-link" ng-click="pageInicio.showAllPrograms($event)">
156   - <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> Ver todos os {{::pageInicio.programs.length}} programas
157   - </button>
158   - </header>
159   - </div>
160   - </div>
161   - <div class="row">
162   - <div class="col-sm-12" ng-if="pageInicio.filtredPrograms && !vm.loadingFilter">
163   - <article-grid articles="pageInicio.filtredPrograms"></article-grid>
164   - </div>
165   - <div ng-if="!pageInicio.programs && pageInicio.loadingPrograms">
166   - <div class="alert alert-info" role="alert">
167   - Carregando programas.
168   - </div>
169   - </div>
170   - <div ng-if="!pageInicio.programs && pageInicio.programsError">
171   - <div class="alert alert-danger" role="alert">
172   - Não foi possível carregar a lista de programas neste momento.
173   - </div>
174   - </div>
175   - </div>
  145 + </div>
  146 + <div ng-if="!pageInicio.themes && pageInicio.themesError">
  147 + <div class="alert alert-danger" role="alert">
  148 + Não foi possível carregar a lista de temas neste momento.
176 149 </div>
177 150 </div>
178 151 </div>
179   - </section>
  152 + <div class="col-sm-8 col-md-9">
  153 + <div class="row hidden-xs">
  154 + <div class="col-xs-12">
  155 + <div class="input-group input-group-lg input-group-search">
  156 + <label for="articleQueryFilter2" class="control-label sr-only">Buscar programas:</label>
  157 + <input id="articleQueryFilter2" type="search" class="form-control input-search" ng-model="pageInicio.query" placeholder="Buscar programas" aria-label="Buscar programas">
  158 + <span class="input-group-btn">
  159 + <button type="button" class="btn btn-default" ng-click="pageInicio.submitSearch()">
  160 + <span class="icon-circle icon-small color-theme-common-bg">
  161 + <span class="glyphicon glyphicon-search"></span>
  162 + </span>
  163 + <span class="sr-only">Buscar</span>
  164 + </button>
  165 + </span>
  166 + </div>
  167 + </div>
  168 + </div>
  169 + <div id="search-result" class="row">
  170 + <div class="col-sm-12">
  171 + <header class="header">
  172 + <h2>Programas</h2>
  173 + <button type="button" class="btn btn-link" ng-click="pageInicio.showAllPrograms($event)">
  174 + <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> Ver todos os {{::pageInicio.programs.length}} programas
  175 + </button>
  176 + </header>
  177 + </div>
  178 + </div>
  179 + <div class="row">
  180 + <div class="col-sm-12" ng-if="pageInicio.filtredPrograms && !vm.loadingFilter">
  181 + <article-grid articles="pageInicio.filtredPrograms"></article-grid>
  182 + </div>
  183 + <div ng-if="!pageInicio.programs && pageInicio.loadingPrograms">
  184 + <div class="alert alert-info" role="alert">
  185 + Carregando programas.
  186 + </div>
  187 + </div>
  188 + <div ng-if="!pageInicio.programs && pageInicio.programsError">
  189 + <div class="alert alert-danger" role="alert">
  190 + Não foi possível carregar a lista de programas neste momento.
  191 + </div>
  192 + </div>
  193 + </div>
  194 +</div>
  195 +</div>
  196 +</div>
  197 +</section>
180 198 </div>
... ...
src/app/pages/inicio/inicio.scss
  Diff comments   View file @e0330ce
... ... @@ -132,7 +132,33 @@
132 132 width: 100%;
133 133 $bannerHeight: 338px;
134 134 $bannerBottomHeight: 40px;
135   - text-align: center;
  135 +
  136 + .img-banner {
  137 + display: block;
  138 + text-align: center;
  139 + }
  140 +
  141 + .text-shadow {
  142 + text-shadow: 0px 1px 1px #A42B5A
  143 + }
  144 +
  145 + .text-bold {
  146 + font-weight: bold;
  147 + }
  148 +
  149 + .teste {
  150 + display: block;
  151 + height: 35px;
  152 + padding-top: 5px;
  153 + position: absolute;
  154 + right: 0;
  155 + bottom: 0;
  156 + background-position: right;
  157 + background-image: url('/assets/images/bottao_banner_1.png');
  158 + background-size: 100%;
  159 + background-repeat: no-repeat;
  160 + vertical-align: middle;
  161 + }
136 162  
137 163 &--link-top {
138 164 color: #fff;
... ... @@ -149,33 +175,66 @@
149 175 }
150 176 }
151 177  
152   - &--background-image {
  178 + &--background {
153 179 display: block;
154 180 position: absolute;
155 181 top: 0;
156 182 z-index: -1;
157 183 width: 100%;
158 184 height: 100%;
159   - background-image: url('/assets/images/banner--background-image.png');
160   - background-size: cover;
161   - background-position: center;
162   - background-color: #0E1333;
  185 +
  186 + &-image {
  187 + background-image: url('/assets/images/banner--background-image.png');
  188 + background-size: cover;
  189 + background-position: center;
  190 + background-color: #0E1333;
  191 + }
  192 +
  193 + &-pink {
  194 + background-color: #F84D71;
  195 + }
163 196 }
164 197  
165 198 &--logo {
166 199 margin: 10px;
  200 +
  201 + &-small {
  202 + width: 23%;
  203 + }
167 204 }
  205 +
168 206 &--text1 {
169 207 text-transform: uppercase;
170 208 font-size: 22px;
171 209 }
172 210 &--text2 {
  211 + display: block;
  212 + margin-left: 10px;
173 213 color: #dfa821;
174   - font-size: 22px;
  214 + // font-size: 22px;
  215 + font-size: 130%;
175 216 font-weight: bold;
176 217 text-transform: uppercase;
177 218 }
178   - &--text3 {}
  219 + &--text3 {
  220 + display: block;
  221 + margin-left: 10px;
  222 + font-size: 115%;
  223 + }
  224 +
  225 + &--banner2--link-bottom {
  226 + color: white;
  227 + font-size: 135%;
  228 + font-weight: bold;
  229 + padding-right: 25px;
  230 + margin-left: 5px;
  231 +
  232 + &:hover,
  233 + &:focus,
  234 + &:active {
  235 + color: #fff;
  236 + }
  237 + }
179 238  
180 239 &--link-bottom {
181 240 color: #fff;
... ...
src/assets/images/bottao_banner_1.png 0 → 100644
View file @e0330ce

18.4 KB
src/assets/images/bottao_banner_2.png 0 → 100644
View file @e0330ce

9.02 KB
src/assets/images/marca_banner1.png 0 → 100644
View file @e0330ce

7.74 KB
src/assets/images/marca_banner2.png 0 → 100644
View file @e0330ce

11.8 KB