remove pattern bg, change position controls-form on survey and remove css unecessary

Valessio Soares de Brito
1 parent 4b999287
Showing 3 changed files with 30 additions and 84 deletions Show diff stats
src/web/static/css/style.css
src/web/static/css/survey.css
src/web/templates/survey.html
@@ -51,7 +51,14 @@ blockquote:before, blockquote:after, q:before, q:after { content: &quot;&quot;; }
  */
 body{
-background: #b0c9e5 url('../images/pattern.gif');
+background: #f2f6f8; /* Old browsers */
+background: -moz-linear-gradient(top, #f2f6f8 0%, #d8e1e7 50%, #b5c6d0 51%, #e0eff9 100%); /* FF3.6+ */
+background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f6f8), color-stop(50%,#d8e1e7), color-stop(51%,#b5c6d0), color-stop(100%,#e0eff9)); /* Chrome,Safari4+ */
+background: -webkit-linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%); /* Chrome10+,Safari5.1+ */
+background: -o-linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%); /* Opera11.10+ */
+background: -ms-linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%); /* IE10+ */
+filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f6f8', endColorstr='#e0eff9',GradientType=0 ); /* IE6-9 */
+background: linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%); /* W3C */
 font-family: Arial, Verdana, sans-serif;
 font-size: 0.9em;
 line-height: 1.1;
@@ -450,17 +457,6 @@ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=&#39;#dfdfdf&#39;, end
 background: linear-gradient(top, #dfdfdf 51%,#ffffff 100%); /* W3C */
 }
-.glass_blue {
-background: #f2f6f8; /* Old browsers */
-background: -moz-linear-gradient(top, #f2f6f8 0%, #d8e1e7 50%, #b5c6d0 51%, #e0eff9 100%); /* FF3.6+ */
-background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f6f8), color-stop(50%,#d8e1e7), color-stop(51%,#b5c6d0), color-stop(100%,#e0eff9)); /* Chrome,Safari4+ */
-background: -webkit-linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%); /* Chrome10+,Safari5.1+ */
-background: -o-linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%); /* Opera11.10+ */
-background: -ms-linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%); /* IE10+ */
-filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f6f8', endColorstr='#e0eff9',GradientType=0 ); /* IE6-9 */
-background: linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%); /* W3C */
-}
-
 .glass {
 background: #e2e2e2; /* Old browsers */
 background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); /* FF3.6+ */
@@ -26,7 +26,7 @@ width: 420px;
 display: none;
 position: absolute;
 top: 15px;
-width: 250px;
+width: 300px;
 right: 0px;
 font-size: 11px;
 font-weight: normal;
@@ -35,7 +35,10 @@ color: #000000;
 a:hover #tip-bar,
 a:hover #tip-finish,
-#tip-strategy:hover .tip { display: block; background-color: white; }
+#tip-strategy:hover .tip { 
+display: block; 
+z-index: 3;
+}
 .innertube {
@@ -46,8 +49,8 @@ margin: 30px;
 background: none;
 }
-.coda-slider-wrapper {
-clear: none;
+#wrap {
+max-width: 780px;
 }
 body.survey #wrap {
@@ -56,6 +59,7 @@ min-height: 450px;
 }
 /* Display None itens Survey */
+#footer,
 #coda-nav-left-1,
 body.survey #header,
 #recommender-box #upfile,
@@ -74,8 +78,8 @@ margin: 5px;
 .content-pkg {
 overflow: auto;
 display: block;
-height: 250px;
-min-height: 250px;
+height: 400px;
+min-height: 400px;
 }
 .content-pkg ul { 
@@ -127,59 +131,5 @@ font-weight: normal;
 font-size: 0.8em;
 }
-#debtags_box { 
-display: block;
-float: right;
-width: 150px;
-font-size: 0.8em;
-}
-
-#debtags_box h2 {
-font-weight: bold;
-}
-
-#debtags_pkg ul { 
-padding: 3px;
-}
-
-#debtags_pkg li { 
-font-weight: bold;
-cursor: pointer;
-}
-
-#debtags_pkg li ul li { 
-font-weight: normal;
-margin-left: 5px;
-border-left: 1px solid white;
-border-bottom: 1px solid white;
-cursor: pointer;
-}
-
-#debresources_box { 
-float: left;
-margin-top: 20px;
-}
-
-#debresources_box li {
-margin-bottom: 4px;
-}
-
-/* Details BOX */
-
-#details_box {
-margin-top: 50px;
-padding: 20px;
-font-size: 0.8;
-color: #545454;
-}
-
-#details_box h2 {
-margin: -5px 0 15px 0px;
-color: #000;
-}
-
-#details_box li {
-margin-bottom: 10px;
-}
@@ -26,6 +26,18 @@ $var jsfiles: static/coda-slider-2.0/javascripts/jquery-1.3.2.min.js static/coda
 <form action="/thanks" method="post" enctype="multipart/form-data" name="surveyform">
+<div id="controls-form" style="display: none;"><!-- display show in the end form -->
+<a id="finish-button" class="glass">Finish 
+  <div class="tip important" id="tip-bar"><p>Tem certeza que não gostaria de avaliar uma nova estratégia? </p></div>
+</a>
+
+<a id="bar-button" class="glass">New Recommends 
+  <div class="tip note" id="tip-finish"><p>Fazer uma nova recomendação com uma nova lista de pacotes.</p></div>
+</a>
+
+<label for="strategy_button" id="tip-strategy"><div class="tip tip"><p> Gerar um novo resultado com uma estratégia diferente para esta mesma lista de pacotes. </p></div><input id="strategy-button" name="strategy_button" type="submit" value="New Strategy" class="glass" /></label>
+</div><!-- id="controls-form" -->
+
 <div class="coda-slider-wrapper">
 	<div class="coda-slider preload" id="coda-slider-1">
 $for pkg in pkg_details:
@@ -66,18 +78,6 @@ $for pkg in pkg_details:
 </div><!-- .coda-slider -->
 </div><!-- .coda-slider-wrapper -->
-<div id="controls-form" style="display: none;"><!-- display show in the end form -->
-<a id="finish-button" class="glass">Finish 
-  <div class="tip important" id="tip-bar"><p>Tem certeza que não gostaria de avaliar uma nova estratégia? </p></div>
-</a>
-
-<a id="bar-button" class="glass">New Recommends 
-  <div class="tip note" id="tip-finish"><p>Fazer uma nova recomendação com uma nova lista de pacotes.</p></div>
-</a>
-
-<label for="strategy_button" id="tip-strategy"><div class="tip tip"><p> Gerar um novo resultado com uma estratégia diferente para esta mesma lista de pacotes. </p></div><input id="strategy-button" name="strategy_button" type="submit" value="New Strategy" class="glass" /></label>
-</div><!-- id="controls-form" -->
-
 </form>
	@@ -26,7 +26,7 @@ width: 420px;		@@ -26,7 +26,7 @@ width: 420px;
26	display: none;	26	display: none;
27	position: absolute;	27	position: absolute;
28	top: 15px;	28	top: 15px;
29	-width: 250px;	29	+width: 300px;
30	right: 0px;	30	right: 0px;
31	font-size: 11px;	31	font-size: 11px;
32	font-weight: normal;	32	font-weight: normal;
	@@ -35,7 +35,10 @@ color: #000000;		@@ -35,7 +35,10 @@ color: #000000;
35		35
36	a:hover #tip-bar,	36	a:hover #tip-bar,
37	a:hover #tip-finish,	37	a:hover #tip-finish,
38	-#tip-strategy:hover .tip { display: block; background-color: white; }	38	+#tip-strategy:hover .tip {
		39	+display: block;
		40	+z-index: 3;
		41	+}
39		42
40		43
41	.innertube {	44	.innertube {
	@@ -46,8 +49,8 @@ margin: 30px;		@@ -46,8 +49,8 @@ margin: 30px;
46	background: none;	49	background: none;
47	}	50	}
48		51
49	-.coda-slider-wrapper {
50	-clear: none;	52	+#wrap {
		53	+max-width: 780px;
51	}	54	}
52		55
53	body.survey #wrap {	56	body.survey #wrap {
	@@ -56,6 +59,7 @@ min-height: 450px;		@@ -56,6 +59,7 @@ min-height: 450px;
56	}	59	}
57		60
58	/* Display None itens Survey */	61	/* Display None itens Survey */
		62	+#footer,
59	#coda-nav-left-1,	63	#coda-nav-left-1,
60	body.survey #header,	64	body.survey #header,
61	#recommender-box #upfile,	65	#recommender-box #upfile,
	@@ -74,8 +78,8 @@ margin: 5px;		@@ -74,8 +78,8 @@ margin: 5px;
74	.content-pkg {	78	.content-pkg {
75	overflow: auto;	79	overflow: auto;
76	display: block;	80	display: block;
77	-height: 250px;
78	-min-height: 250px;	81	+height: 400px;
		82	+min-height: 400px;
79	}	83	}
80		84
81	.content-pkg ul {	85	.content-pkg ul {
	@@ -127,59 +131,5 @@ font-weight: normal;		@@ -127,59 +131,5 @@ font-weight: normal;
127	font-size: 0.8em;	131	font-size: 0.8em;
128	}	132	}
129		133
130	-#debtags_box {
131	-display: block;
132	-float: right;
133	-width: 150px;
134	-font-size: 0.8em;
135	-}
136	-
137	-#debtags_box h2 {
138	-font-weight: bold;
139	-}
140	-
141	-#debtags_pkg ul {
142	-padding: 3px;
143	-}
144	-
145	-#debtags_pkg li {
146	-font-weight: bold;
147	-cursor: pointer;
148	-}
149	-
150	-#debtags_pkg li ul li {
151	-font-weight: normal;
152	-margin-left: 5px;
153	-border-left: 1px solid white;
154	-border-bottom: 1px solid white;
155	-cursor: pointer;
156	-}
157	-
158	-#debresources_box {
159	-float: left;
160	-margin-top: 20px;
161	-}
162	-
163	-#debresources_box li {
164	-margin-bottom: 4px;
165	-}
166	-
167	-/* Details BOX */
168	-
169	-#details_box {
170	-margin-top: 50px;
171	-padding: 20px;
172	-font-size: 0.8;
173	-color: #545454;
174	-}
175	-
176	-#details_box h2 {
177	-margin: -5px 0 15px 0px;
178	-color: #000;
179	-}
180	-
181	-#details_box li {
182	-margin-bottom: 10px;
183	-}
184		134
185		135