Commit 1ee9cee7bf0f395a68bef48006605349bbcbac51
1 parent
8d1ca228
Exists in
master
and in
8 other branches
default
Showing
16 changed files
with
193 additions
and
198 deletions
Show diff stats
src/app/components/cadastro-proposta/cadastro-proposta.html
... | ... | @@ -20,21 +20,21 @@ |
20 | 20 | <div class="row linha-proposta"> |
21 | 21 | <div class="col-sm-8"> |
22 | 22 | <span>Descrição da proposta*</span> |
23 | - <a tabindex="0" class="btn btn-link link-popover" role="button" data-toggle="popover" data-trigger="focus">?</a> | |
23 | + <div class="teste"><a tabindex="0" class="btn btn-link link-popover" role="button" data-toggle="popover" data-trigger="focus">?</a></div> | |
24 | 24 | <textarea id="proposta" name="proposta" class="texto-proposta form-control" |
25 | - ng-class="{ 'has-error' : testeForm.proposta.$invalid && testeForm.proposta.$touched }" | |
26 | - ng-model="proposta" | |
27 | - required ng-maxlength="200" ></textarea> | |
28 | - <form-messages field="testeForm.proposta" maxlength="'Ops, esse campo não pode ser maior que 200 caracteres.'"/> | |
25 | + ng-class="{ 'has-error' : testeForm.proposta.$invalid && testeForm.proposta.$touched }" | |
26 | + ng-model="proposta" | |
27 | + required ng-maxlength="200" ></textarea> | |
28 | + <validation-messages field="testeForm.proposta" maxlength="'Ops, esse campo não pode ser maior que 200 caracteres.'"/> | |
29 | 29 | <span class="pull-left">*Dados obrigatórios</span> |
30 | 30 | <span class="pull-right">Máx. 200 caracteres</span> |
31 | 31 | </div> |
32 | 32 | </div> |
33 | 33 | </div> |
34 | 34 | <div class="form-group"> |
35 | - <div class="col-sm-4"> | |
36 | - <button class="btn btn-lg btn-block btn-submit" type="submit">Enviar Proposta</button> | |
37 | - </div> | |
35 | + <div class="col-sm-4"> | |
36 | + <button class="btn btn-lg btn-block btn-submit" type="submit">Enviar Proposta</button> | |
38 | 37 | </div> |
39 | - </form> | |
38 | + </div> | |
39 | +</form> | |
40 | 40 | </div> | ... | ... |
src/app/components/cadastro-proposta/cadastro-proposta.scss
1 | 1 | .envio-proposta { |
2 | + | |
2 | 3 | .titulo-envio-proposta{ |
3 | 4 | color: #2D7B66; |
4 | 5 | } |
... | ... | @@ -37,15 +38,18 @@ |
37 | 38 | display: none; |
38 | 39 | } |
39 | 40 | |
40 | - .btn-question { | |
41 | - color: #484848; | |
42 | - background-color: #fff; | |
43 | - display: inline-block; | |
44 | - text-align: center; | |
45 | - width: 22px; | |
46 | - height: 22px; | |
47 | - margin-left: 10px; | |
48 | - padding: 0; | |
49 | - border-radius: 10px; | |
50 | - } | |
41 | + .teste { | |
42 | + border-radius: 10px; | |
43 | + width: 20px; | |
44 | + height: 20px; | |
45 | + display: inline-block; | |
46 | + background-color: lightyellow; | |
47 | + } | |
48 | + | |
49 | + .link-popover { | |
50 | + font-size: 15px; | |
51 | + color: gray; | |
52 | + padding: 0px 7px; | |
53 | + border-style: none; | |
54 | + } | |
51 | 55 | } | ... | ... |
src/app/components/form-messages/form-messages.directive.js
... | ... | @@ -1,52 +0,0 @@ |
1 | -(function() { | |
2 | - 'use strict'; | |
3 | - | |
4 | - angular | |
5 | - .module('dialoga') | |
6 | - .directive('formMessages', formMessages); | |
7 | - | |
8 | - /** @ngInject */ | |
9 | - function formMessages() { | |
10 | - | |
11 | - /** @ngInject */ | |
12 | - function FormMessagesController($log) { | |
13 | - $log.debug('FormMessagesController'); | |
14 | - | |
15 | - var vm = this; | |
16 | - vm.$log = $log; | |
17 | - | |
18 | - vm.init(); | |
19 | - | |
20 | - } | |
21 | - | |
22 | - FormMessagesController.prototype.init = function () { | |
23 | - // async values | |
24 | - var vm = this; | |
25 | - | |
26 | - if (!vm.required) {vm.required = "Ops, o campo é obrigatório."}; | |
27 | - if (!vm.minlength) {vm.minlength = "O campo deve ser maior."}; | |
28 | - if (!vm.maxlength) {vm.maxlength = "O campo deve ser menor"}; | |
29 | - if (!vm.email) {vm.email = "O endereço de e-mail deve ser válido"}; | |
30 | - | |
31 | - }; | |
32 | - | |
33 | - var directive = { | |
34 | - restrict: 'E', | |
35 | - templateUrl: 'app/components/form-messages/form-messages.html', | |
36 | - scope: { | |
37 | - field: '=', | |
38 | - required: '=', | |
39 | - minlength: '=', | |
40 | - maxlength: '=', | |
41 | - email: '=' | |
42 | - }, | |
43 | - controller: FormMessagesController, | |
44 | - controllerAs: 'vm', | |
45 | - bindToController: true | |
46 | - }; | |
47 | - | |
48 | - return directive; | |
49 | - } | |
50 | - | |
51 | -})(); | |
52 | - |
src/app/components/form-messages/form-messages.html
... | ... | @@ -1,10 +0,0 @@ |
1 | -<div ng-show="vm.field.$touched"> | |
2 | - <div ng-messages="vm.field.$error"> | |
3 | - <div class="error-message"> | |
4 | - <div ng-message="required">{{vm.required}}</div> | |
5 | - <div ng-message="minlength">{{vm.minlength}}</div> | |
6 | - <div ng-message="maxlength">{{vm.maxlength}}</div> | |
7 | - <div ng-message="email">{{vm.email}}</div> | |
8 | - </div> | |
9 | - </div> | |
10 | -</div> |
src/app/components/form-messages/form-messages.scss
src/app/components/show-message/message.html
... | ... | @@ -1,17 +0,0 @@ |
1 | -<div id="message" class="show-message"> | |
2 | - <div class="row"> | |
3 | - <div class="div-center"> | |
4 | - <div class="col-sm-2 col-sm-offset-2 message-border {{ ::vm.type }}"> | |
5 | - <span class="glyphicon glyphicon-ok icon-white" aria-hidden="true"></span> | |
6 | - </div> | |
7 | - </div> | |
8 | - <div class="col-sm-7 div-mensagem"> | |
9 | - <div class="row"> | |
10 | - <h3>{{ ::vm.title }}</h3> | |
11 | - </div> | |
12 | - <div class="row"> | |
13 | - <h5>{{ ::vm.message }}</h5> | |
14 | - </div> | |
15 | - </div> | |
16 | - </div> | |
17 | -</div> |
src/app/components/show-message/show-message.directive.js
... | ... | @@ -0,0 +1,17 @@ |
1 | +<div id="message" class="show-message"> | |
2 | + <div class="row"> | |
3 | + <div class="div-center"> | |
4 | + <div class="col-sm-2 col-sm-offset-2 message-border {{ ::vm.type }}"> | |
5 | + <span class="glyphicon glyphicon-ok icon-white" aria-hidden="true"></span> | |
6 | + </div> | |
7 | + </div> | |
8 | + <div class="col-sm-7 div-mensagem"> | |
9 | + <div class="row"> | |
10 | + <h3>{{ ::vm.title }}</h3> | |
11 | + </div> | |
12 | + <div class="row"> | |
13 | + <h5>{{ ::vm.message }}</h5> | |
14 | + </div> | |
15 | + </div> | |
16 | + </div> | |
17 | +</div> | ... | ... |
src/app/components/validation-messages/validation-messages.directive.js
0 → 100644
... | ... | @@ -0,0 +1,52 @@ |
1 | +(function() { | |
2 | + 'use strict'; | |
3 | + | |
4 | + angular | |
5 | + .module('dialoga') | |
6 | + .directive('validationMessages', validationMessages); | |
7 | + | |
8 | + /** @ngInject */ | |
9 | + function validationMessages() { | |
10 | + | |
11 | + /** @ngInject */ | |
12 | + function validationMessagesController($log) { | |
13 | + $log.debug('validationMessagesController'); | |
14 | + | |
15 | + var vm = this; | |
16 | + vm.$log = $log; | |
17 | + | |
18 | + vm.init(); | |
19 | + | |
20 | + } | |
21 | + | |
22 | + validationMessagesController.prototype.init = function () { | |
23 | + // async values | |
24 | + var vm = this; | |
25 | + | |
26 | + if (!vm.required) {vm.required = "Ops, o campo é obrigatório."}; | |
27 | + if (!vm.minlength) {vm.minlength = "O campo deve ser maior."}; | |
28 | + if (!vm.maxlength) {vm.maxlength = "O campo deve ser menor"}; | |
29 | + if (!vm.email) {vm.email = "O endereço de e-mail deve ser válido"}; | |
30 | + | |
31 | + }; | |
32 | + | |
33 | + var directive = { | |
34 | + restrict: 'E', | |
35 | + templateUrl: 'app/components/validation-messages/validation-messages.html', | |
36 | + scope: { | |
37 | + field: '=', | |
38 | + required: '=', | |
39 | + minlength: '=', | |
40 | + maxlength: '=', | |
41 | + email: '=' | |
42 | + }, | |
43 | + controller: validationMessagesController, | |
44 | + controllerAs: 'vm', | |
45 | + bindToController: true | |
46 | + }; | |
47 | + | |
48 | + return directive; | |
49 | + } | |
50 | + | |
51 | +})(); | |
52 | + | ... | ... |
src/app/components/validation-messages/validation-messages.html
0 → 100644
... | ... | @@ -0,0 +1,10 @@ |
1 | +<div ng-show="vm.field.$touched"> | |
2 | + <div ng-messages="vm.field.$error"> | |
3 | + <div class="error-message"> | |
4 | + <div ng-message="required">{{vm.required}}</div> | |
5 | + <div ng-message="minlength">{{vm.minlength}}</div> | |
6 | + <div ng-message="maxlength">{{vm.maxlength}}</div> | |
7 | + <div ng-message="email">{{vm.email}}</div> | |
8 | + </div> | |
9 | + </div> | |
10 | +</div> | ... | ... |
src/app/components/validation-messages/validation-messages.scss
0 → 100644
src/app/layout.scss
... | ... | @@ -120,10 +120,7 @@ |
120 | 120 | border-width: 1px; |
121 | 121 | } |
122 | 122 | |
123 | -.error-message { | |
124 | - color: #ff4431 | |
125 | -} | |
126 | - | |
123 | +// Está com o nome do termos de uso. Deixas genérico ou apenas aqui? Ver como vão ficar esses modais | |
127 | 124 | .modal-termos-uso{ |
128 | 125 | &-header{ |
129 | 126 | border-bottom: none; |
... | ... | @@ -180,4 +177,4 @@ |
180 | 177 | // border-radius: 10px; |
181 | 178 | // -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); |
182 | 179 | // background-color: black; |
183 | -// } | |
184 | 180 | \ No newline at end of file |
181 | +// } | ... | ... |
src/app/pages/auth/auth.scss
... | ... | @@ -7,31 +7,33 @@ |
7 | 7 | } |
8 | 8 | |
9 | 9 | .btn-social { |
10 | - color: #fff; | |
11 | - font-weight: bold; | |
12 | - padding: 15px 16px; | |
13 | - font-size: 16px; | |
14 | - white-space: normal; | |
10 | + color: #fff; | |
11 | + font-weight: bold; | |
12 | + padding: 15px 16px; | |
13 | + font-size: 16px; | |
14 | + white-space: normal; | |
15 | 15 | |
16 | - &:hover, | |
17 | - &:focus {color: #fff;} | |
16 | + &:hover, | |
17 | + &:focus {color: #fff;} | |
18 | 18 | |
19 | - &.btn-facebook { | |
20 | - background-color: #496AA0; | |
19 | + &.btn-facebook { | |
20 | + background-color: #496AA0; | |
21 | 21 | |
22 | - &:hover, | |
23 | - &:focus {background-color: #304373; } | |
24 | - &:active {background-color: #33477a; } | |
25 | - } | |
26 | - &.btn-google-plus { | |
27 | - background-color: #b92d25; | |
28 | - &:hover, | |
29 | - &:focus {background-color: #b12b23; } | |
30 | - &:active {background-color: #b92d25; } | |
31 | - } | |
32 | - @media (max-width: 991px) { | |
33 | - margin-bottom: 20px; | |
34 | - } | |
22 | + &:hover, | |
23 | + &:focus {background-color: #304373; } | |
24 | + &:active {background-color: #33477a; } | |
25 | + } | |
26 | + | |
27 | + &.btn-google-plus { | |
28 | + background-color: #b92d25; | |
29 | + &:hover, | |
30 | + &:focus {background-color: #b12b23; } | |
31 | + &:active {background-color: #b92d25; } | |
32 | + } | |
33 | + | |
34 | + @media (max-width: 991px) { | |
35 | + margin-bottom: 20px; | |
36 | + } | |
35 | 37 | } |
36 | 38 | |
37 | 39 | .btn { |
... | ... | @@ -39,6 +41,7 @@ |
39 | 41 | color: #fff; |
40 | 42 | } |
41 | 43 | } |
44 | + | |
42 | 45 | .btn-primary { |
43 | 46 | .contraste & { |
44 | 47 | background-color: #262626; |
... | ... | @@ -47,66 +50,66 @@ |
47 | 50 | } |
48 | 51 | |
49 | 52 | .glyphicon { |
50 | - &.icon-white { | |
51 | - fill: white; | |
52 | - } | |
53 | + &.icon-white { | |
54 | + fill: white; | |
55 | + } | |
53 | 56 | } |
54 | 57 | |
55 | 58 | .border-social-icon { |
56 | - border-radius: 25px; | |
57 | - padding: 7px 9px; | |
58 | - width: 40px; | |
59 | - height: 40px; | |
60 | - display: inline-block; | |
61 | - | |
62 | - &.border-social-facebook { | |
63 | - background: #547BBC; | |
64 | - } | |
65 | - | |
66 | - &.border-social-googlePlus { | |
67 | - background: #D44105; | |
68 | - } | |
59 | + border-radius: 25px; | |
60 | + padding: 7px 9px; | |
61 | + width: 40px; | |
62 | + height: 40px; | |
63 | + display: inline-block; | |
64 | + | |
65 | + &.border-social-facebook { | |
66 | + background: #547BBC; | |
67 | + } | |
68 | + | |
69 | + &.border-social-googlePlus { | |
70 | + background: #D44105; | |
71 | + } | |
69 | 72 | } |
70 | 73 | |
71 | 74 | .separator { |
72 | - border-top: 2px solid #d8d8d8; | |
73 | - text-align: center; | |
74 | - font-weight: bold; | |
75 | - margin-top: 20px; | |
76 | - margin-bottom: 35px; | |
77 | - | |
78 | - &:after { | |
79 | - position: absolute; | |
80 | - top: 4px; | |
81 | - margin-left: -26px; | |
82 | - font-size: 20px; | |
83 | - line-height: 30px; | |
84 | - padding: 0 0.25em; | |
85 | - background: $gray; | |
75 | + border-top: 2px solid #d8d8d8; | |
76 | + text-align: center; | |
77 | + font-weight: bold; | |
78 | + margin-top: 20px; | |
79 | + margin-bottom: 35px; | |
80 | + | |
81 | + &:after { | |
82 | + position: absolute; | |
83 | + top: -15px; | |
84 | + margin-left: -26px; | |
85 | + font-size: 20px; | |
86 | + line-height: 30px; | |
87 | + padding: 0 0.25em; | |
88 | + background: $gray; | |
86 | 89 | |
87 | 90 | .contraste & { |
88 | - background: #000; | |
91 | + background: #000; | |
89 | 92 | } |
90 | - } | |
93 | + } | |
91 | 94 | |
92 | - &.separator-or:after { | |
93 | - content: "ou"; | |
94 | - left: 51%; | |
95 | - } | |
95 | + &.separator-or:after { | |
96 | + content: "ou"; | |
97 | + left: 50%; | |
98 | + margin-left: -17px; | |
96 | 99 | |
97 | - &.separator-cadastro:after { | |
98 | - content: "ou preencha o formulario"; | |
99 | - left: 31%; | |
100 | - } | |
100 | + @media (min-width: 992px) { | |
101 | + top: 4px; | |
102 | + } | |
103 | + } | |
101 | 104 | |
102 | - } | |
105 | + &.separator-cadastro:after { | |
106 | + content: "ou preencha o formulario"; | |
107 | + left: 50%; | |
108 | + margin-left: -133px; | |
103 | 109 | |
104 | - input[type="checkbox"] { | |
105 | - display:inline-block; | |
106 | - width:18px; | |
107 | - height:18px; | |
108 | - margin:-1px 4px 0 0; | |
109 | - vertical-align:middle; | |
110 | - cursor:pointer; | |
110 | + @media (min-width: 768px) { | |
111 | + top: 4px; | |
112 | + } | |
113 | + } | |
111 | 114 | } |
112 | 115 | } | ... | ... |
src/app/pages/auth/message.html
src/app/pages/auth/signin.html
... | ... | @@ -28,12 +28,13 @@ |
28 | 28 | <div class="form-group"> |
29 | 29 | <label for="inputLoginUsername">E-mail*</label> |
30 | 30 | <input type="email" id="inputLoginUsername" name="inputLoginUsername" class="form-control input-lg" ng-class="{ 'has-error' : loginForm.inputLoginUsername.$invalid && loginForm.inputLoginUsername.$touched }" ng-model="pageSignin.credentials.username" required/> |
31 | - <form-messages field="loginForm.inputLoginUsername"></show-message> | |
31 | + <!-- Diretiva validation-messages --> | |
32 | + <validation-messages field="loginForm.inputLoginUsername"/> | |
32 | 33 | </div> |
33 | 34 | <div class="form-group"> |
34 | 35 | <label for="inputLoginPassword">Senha*</label> |
35 | 36 | <input type="password" id="inputLoginPassword" name="inputLoginPassword" class="form-control input-lg" ng-class="{ 'has-error' : loginForm.inputLoginPassword.$invalid && loginForm.inputLoginPassword.$touched }" ng-model="pageSignin.credentials.password" required> |
36 | - <form-messages field="loginForm.inputLoginPassword" ></show-message> | |
37 | + <validation-messages field="loginForm.inputLoginPassword"/> | |
37 | 38 | </div> |
38 | 39 | <div class="form-group"> |
39 | 40 | <button class="btn btn-lg btn-block btn-submit" type="submit">Entrar</button> |
... | ... | @@ -123,37 +124,26 @@ |
123 | 124 | <label for="inputNome">Nome:</label> |
124 | 125 | <span class="pull-right">*Dados obrigatórios</span> |
125 | 126 | <input type="text" id="inputNome" name="inputNome" class="form-control input-lg" ng-class="{ 'has-error' : cadastroForm.inputNome.$invalid && cadastroForm.inputNome.$touched }" ng-model="nome" ng-minlength="" ng-maxlength="" required> |
126 | - <form-messages field="cadastroForm.inputNome" ></show-message> | |
127 | - </div> | |
128 | - <div class="form-group"> | |
129 | - <p>Descrição da proposta*</p> | |
130 | - <textarea id="proposta" name="proposta" class="texto-proposta form-control" ng-class="{ 'has-error' : cadastroForm.proposta.$invalid && cadastroForm.proposta.$touched }" ng-model="vm.proposta" required ng-maxlength="200" ></textarea> | |
131 | - <div ng-show="cadastroForm.proposta.$touched"> | |
132 | - <div ng-messages="cadastroForm.proposta.$error"> | |
133 | - <form-messages field="cadastroForm.proposta" ></show-message> | |
134 | - </div> | |
135 | - </div> | |
136 | - <span class="pull-left">*Dados obrigatórios</span> | |
137 | - <span class="pull-right">Máx. 200 caracteres</span> | |
127 | + <validation-messages field="cadastroForm.inputNome"/> | |
138 | 128 | </div> |
139 | 129 | <div class="form-group"> |
140 | 130 | <label for="inputEmail">E-mail*</label> |
141 | 131 | <input type="email" id="inputEmail" name="inputEmail" class="form-control input-lg" ng-class="{ 'has-error' : cadastroForm.inputEmail.$invalid && cadastroForm.inputEmail.$touched }" ng-model="email" ng-minlength="" ng-maxlength="" required> |
142 | - <form-messages field="cadastroForm.inputEmail" ></show-message> | |
132 | + <validation-messages field="cadastroForm.inputEmail"/> | |
143 | 133 | </div> |
144 | 134 | <div class="row"> |
145 | 135 | <div class="col-sm-6"> |
146 | 136 | <div class="form-group"> |
147 | 137 | <label for="inputPassword">Senha:</label> |
148 | 138 | <input type="password" id="inputPassword" name="inputPassword" class="form-control input-lg" ng-class="{ 'has-error' : cadastroForm.inputPassword.$invalid && cadastroForm.inputPassword.$touched }" ng-model="senha" ng-minlength="" ng-maxlength="" required> |
149 | - <form-messages field="cadastroForm.inputPassword" ></show-message> | |
139 | + <validation-messages field="cadastroForm.inputPassword"/> | |
150 | 140 | </div> |
151 | 141 | </div> |
152 | 142 | <div class="col-sm-6"> |
153 | 143 | <div class="form-group"> |
154 | 144 | <label for="inputRepeatPassword">Confirmar Senha:</label> |
155 | 145 | <input type="password" id="inputRepeatPassword" name="inputRepeatPassword" class="form-control input-lg" ng-class="{ 'has-error' : cadastroForm.inputRepeatPassword.$invalid && cadastroForm.inputRepeatPassword.$touched }" ng-model="senhaRepetida" ng-minlength="" ng-maxlength="" required> |
156 | - <form-messages field="cadastroForm.inputRepeatPassword" ></show-message> | |
146 | + <validation-messages field="cadastroForm.inputRepeatPassword"/> | |
157 | 147 | </div> |
158 | 148 | </div> |
159 | 149 | </div> |
... | ... | @@ -170,7 +160,7 @@ |
170 | 160 | <a href="">Termos de Uso</a> |
171 | 161 | e concordo com os mesmos* |
172 | 162 | </input> |
173 | - <form-messages field="cadastroForm.termosDeUso" ></show-message> | |
163 | + <validation-messages field="cadastroForm.termosDeUso"/> | |
174 | 164 | </div> |
175 | 165 | <div class="form-group"> |
176 | 166 | <span>Digite o texto da imagem</span> | ... | ... |
src/app/pages/propostas/cadastro-proposta.html
1 | +<!-- APENAS PARA TESTE DO ENVIAR PROPOSTA --> | |
1 | 2 | <div class="container"> |
2 | 3 | <div class="row"> |
3 | 4 | <div class="col-sm-12"> |
4 | - <!-- <div ncy-breadcrumb></div> --> | |
5 | 5 | </div> |
6 | 6 | </div> |
7 | 7 | </div> |
8 | 8 | |
9 | -<!-- <div class="container page--propostas"> | |
10 | - <h1>TODO: Home > Proposta</h1> | |
11 | -</div> --> | |
12 | 9 | <section class="section-gray auth-content ng-scope"> |
13 | 10 | <div class="container"> |
14 | 11 | <cadastro-proposta></cadastro-proposta> |
15 | 12 | </div> |
16 | -</section> | |
17 | 13 | \ No newline at end of file |
14 | +</section> | ... | ... |