Correção no posicionamento dos elementos em dispositivos xm

Edmar Moretti
1 parent 1ff85b32
Showing 3 changed files with 34 additions and 28 deletions Show diff stats
mapas/index.php
permlinks/index.js
permlinks/index.php
@@ -96,8 +96,7 @@ include &quot;../init/head.php&quot;;
 <div class="row">
 	<div class="col-xs-12 col-sm-3 hidden-xs row-action-primary">
 		<div class="btn-group-sm pull-right" style="height: 60px;">
-
-<a class="hidden-sm btn btn-primary btn-fab" href="{{{link}}}">
+				<a class="hidden-sm btn btn-primary btn-fab" href="{{{link}}}">
 				<i class="material-icons">launch</i>
 			</a>
 			<button onclick="i3GEO.util.copyToClipboard('{{{link}}}');alerta('{{copiado}}');" class="btn btn-primary btn-fab" >
@@ -140,7 +139,7 @@ include &quot;../init/head.php&quot;;
 		<h4 class="list-group-item-heading">
 			<a href="{{{link}}}" target="_blank">{{{nome}}}</a>
 		</h4>
-		<p class="list-group-item-text hidden-xs">
+		<p class="list-group-item-text hidden-xs hidden-sm">
 			<a href="{{{link}}}" target="_blank">{{{link}}}</a>
 		</p>
 	</div>
@@ -419,4 +419,13 @@ function i3geo_gl_inicia(objeto_i3geo_gl_configura)
 	$i3geo_gl.combointerfaces();
 	//pega a lista de menus e as
 	i3GEO.arvoreDeTemas.comboMenus($i3geo_gl.loc_i3geo,"$i3geo_gl.combogrupos",$i3geo_gl.menu,"","530","1","");
+}
+function alerta(texto,d){
+	if(!d){
+		d = 500;
+	}
+	var a = $(".alert");
+	a.html(texto);
+	a.slideDown(d);
+	a.delay(d).slideUp(d);
 }
 \ No newline at end of file
@@ -22,7 +22,7 @@ error_reporting ( 0 );
 include "../init/head.php";
  
 ?>
-<script src="../pacotes/ol3/ol-debug.js"></script>
+<script src="../pacotes/ol3/ol.js"></script>
 <style>
 .checkbox, .radio {
 	margin-bottom: 5px;
@@ -63,22 +63,20 @@ include &quot;../init/head.php&quot;;
 				</button>
 				<a class="navbar-brand" href="../init/index.php"><?php echo $mensagemInicia;?> <i
 					class="fa fa-home fa-1x"></i></a>
+
 			</div>
+
+			<p class="navbar-text">
+				<button onclick="i3GEO.util.copyToClipboard($('#link').html());alerta('Copiado');"
+					class="btn btn-primary btn-fab btn-fab-mini">
+					<i class="fa fa-files-o" aria-hidden="true"></i>
+				</button>
+				&nbsp; <a class="navbar-link" href="" id="link" target="_blank">http://</a>
+			</p>
 		</div>
 	</nav>
-	<nav style="padding-top: 10px;" class="navbar-fixed-top">
-		<div class="container">
-			<div class="well well-sm">
-				<div class="bs-component btn-group-sm pull-left" style="top: -2px; position: relative">
-					<button onclick="i3GEO.util.copyToClipboard($('#link').html());"
-						class="btn btn-primary btn-fab btn-fab-mini">
-						<i class="fa fa-files-o" aria-hidden="true"></i>
-					</button>
-				</div>
-				&nbsp; <a href="" id="link" target="_blank">http://</a>
-			</div>
-		</div>
-	</nav>
+	<!--para as mensagens de alerta-->
+	<div class="navbar-fixed-top alert alert-success text-center" style="padding: 0px;"></div>
 	<div class="container-fluid">
 		<div class="row">
 			<ol class="breadcrumb">
@@ -121,7 +119,7 @@ include &quot;../init/head.php&quot;;
 						</select> <span class="material-input"></span>
 					</div>
 					<div class="form-group">
-						<label for="temas">Temas</label> <select style="font-size: 15px;" multiple
+						<label for="temas">Temas</label> <select style="font-size: 15px;"
 							onchange="$i3geo_gl.preseltema('','',this.value)" class="form-control" id="temas">
 						</select> <span class="help-block">Na lista abaixo voc&ecirc; pode remover temas j&aacute;
 							escolhidos. Clique em v&aacute;rios temas para escolher mais de um</span> <span
@@ -188,10 +186,12 @@ include &quot;../init/head.php&quot;;
 							<label> Utilize o navegador abaixo para definir as coordenadas geogr&aacute;ficas do
 								seu mapa. Ap&oacute;s escolher a regi&atilde;o, clique no botão de captura.</label>
 							<div class="row">
-								<div class="col-sm-6 text-center">
-									<div id="i3geo_gl_mapa1" style="width: 256px; height: 256px; border: 1px solid gray;"></div>
+								<div class="col-sm-12 text-center">
+									<div id="i3geo_gl_mapa1" style="width: 100%; height: 256px; border: 1px solid gray;"></div>
 								</div>
-								<div class="col-sm-6 text-center">
+							</div>
+							<div class="row">
+								<div class="col-sm-12 text-center">
 									<button onclick="$i3geo_gl.OL.capturageo();return false;" class="btn btn-primary">Capturar</button>
 								</div>
 							</div>
@@ -201,12 +201,12 @@ include &quot;../init/head.php&quot;;
 								os valores ou capture as coordenadas</label>
  
 							<div class="coord form-group label-floating">
-								<label class="control-label" >X mínimo (longitude oeste -)</label> <input
+								<label class="control-label">X mínimo (longitude oeste -)</label> <input
 									class="form-control" id="i3geo_gl_xmin" type="text" onchange="$i3geo_gl.crialink()" />
 							</div>
 							<div class="coord form-group label-floating">
-								<label class="control-label" for="i3geo_gl_xmax">X m&aacute;ximo (longitude leste +)</label> <input
-									class="form-control" id="i3geo_gl_xmax" type="text" onchange="$i3geo_gl.crialink()" />
+								<label class="control-label" for="i3geo_gl_xmax">X m&aacute;ximo (longitude leste +)</label>
+								<input class="form-control" id="i3geo_gl_xmax" type="text" onchange="$i3geo_gl.crialink()" />
 							</div>
 							<div class="coord form-group label-floating">
 								<label class="control-label" for="i3geo_gl_ymin">Y m&iacute;nimo (latitude sul -)</label> <input
@@ -214,8 +214,8 @@ include &quot;../init/head.php&quot;;
 							</div>
  
 							<div class="coord form-group label-floating">
-								<label class="control-label" for="i3geo_gl_ymax">Y m&aacute;ximo (latitude norte +)</label> <input
-									class="form-control" id="i3geo_gl_ymax" type="text" onchange="$i3geo_gl.crialink()" />
+								<label class="control-label" for="i3geo_gl_ymax">Y m&aacute;ximo (latitude norte +)</label>
+								<input class="form-control" id="i3geo_gl_ymax" type="text" onchange="$i3geo_gl.crialink()" />
 							</div>
 						</div>
 					</div>
@@ -229,7 +229,6 @@ include &quot;../init/head.php&quot;;
 	<script src='dicionario.js'></script>
 	<script src='index.js'></script>
 	<script>
-		//$(document).ready(function(){
 		i3GEO.configura = {
 			"locaplic" : window.location.href.split("/permlinks")[0],
 			"sid" : ""
@@ -242,7 +241,6 @@ include &quot;../init/head.php&quot;;
 		i3geo_gl_inicia(i3geo_gl_configura);
 		$i3geo_gl.buscageo_init();
 		$.material.init();
-		//});
 	</script>
 </body>
 </html>
...	...	@@ -96,8 +96,7 @@ include "../init/head.php";
96	96	<div class="row">
97	97	<div class="col-xs-12 col-sm-3 hidden-xs row-action-primary">
98	98	<div class="btn-group-sm pull-right" style="height: 60px;">
99		-
100		-<a class="hidden-sm btn btn-primary btn-fab" href="{{{link}}}">
	99	+ <a class="hidden-sm btn btn-primary btn-fab" href="{{{link}}}">
101	100	<i class="material-icons">launch</i>
102	101	</a>
103	102	<button onclick="i3GEO.util.copyToClipboard('{{{link}}}');alerta('{{copiado}}');" class="btn btn-primary btn-fab" >
...	...	@@ -140,7 +139,7 @@ include "../init/head.php";
140	139	<h4 class="list-group-item-heading">
141	140	<a href="{{{link}}}" target="_blank">{{{nome}}}</a>
142	141	</h4>
143		- <p class="list-group-item-text hidden-xs">
	142	+ <p class="list-group-item-text hidden-xs hidden-sm">
144	143	<a href="{{{link}}}" target="_blank">{{{link}}}</a>
145	144	</p>
146	145	</div>
...	...
...	...	@@ -419,4 +419,13 @@ function i3geo_gl_inicia(objeto_i3geo_gl_configura)
419	419	$i3geo_gl.combointerfaces();
420	420	//pega a lista de menus e as
421	421	i3GEO.arvoreDeTemas.comboMenus($i3geo_gl.loc_i3geo,"$i3geo_gl.combogrupos",$i3geo_gl.menu,"","530","1","");
	422	+}
	423	+function alerta(texto,d){
	424	+ if(!d){
	425	+ d = 500;
	426	+ }
	427	+ var a = $(".alert");
	428	+ a.html(texto);
	429	+ a.slideDown(d);
	430	+ a.delay(d).slideUp(d);
422	431	}
423	432	\ No newline at end of file
...	...
...	...	@@ -22,7 +22,7 @@ error_reporting ( 0 );
22	22	include "../init/head.php";
23	23
24	24	?>
25		-<script src="../pacotes/ol3/ol-debug.js"></script>
	25	+<script src="../pacotes/ol3/ol.js"></script>
26	26	<style>
27	27	.checkbox, .radio {
28	28	margin-bottom: 5px;
...	...	@@ -63,22 +63,20 @@ include "../init/head.php";
63	63	</button>
64	64	<a class="navbar-brand" href="../init/index.php"><?php echo $mensagemInicia;?> <i
65	65	class="fa fa-home fa-1x"></i></a>
	66	+
66	67	</div>
	68	+
	69	+ <p class="navbar-text">
	70	+ <button onclick="i3GEO.util.copyToClipboard($('#link').html());alerta('Copiado');"
	71	+ class="btn btn-primary btn-fab btn-fab-mini">
	72	+ <i class="fa fa-files-o" aria-hidden="true"></i>
	73	+ </button>
	74	+   <a class="navbar-link" href="" id="link" target="_blank">http://</a>
	75	+ </p>
67	76	</div>
68	77	</nav>
69		- <nav style="padding-top: 10px;" class="navbar-fixed-top">
70		- <div class="container">
71		- <div class="well well-sm">
72		- <div class="bs-component btn-group-sm pull-left" style="top: -2px; position: relative">
73		- <button onclick="i3GEO.util.copyToClipboard($('#link').html());"
74		- class="btn btn-primary btn-fab btn-fab-mini">
75		- <i class="fa fa-files-o" aria-hidden="true"></i>
76		- </button>
77		- </div>
78		-   <a href="" id="link" target="_blank">http://</a>
79		- </div>
80		- </div>
81		- </nav>
	78	+ <!--para as mensagens de alerta-->
	79	+ <div class="navbar-fixed-top alert alert-success text-center" style="padding: 0px;"></div>
82	80	<div class="container-fluid">
83	81	<div class="row">
84	82	<ol class="breadcrumb">
...	...	@@ -121,7 +119,7 @@ include "../init/head.php";
121	119	</select> <span class="material-input"></span>
122	120	</div>
123	121	<div class="form-group">
124		- <label for="temas">Temas</label> <select style="font-size: 15px;" multiple
	122	+ <label for="temas">Temas</label> <select style="font-size: 15px;"
125	123	onchange="$i3geo_gl.preseltema('','',this.value)" class="form-control" id="temas">
126	124	</select> <span class="help-block">Na lista abaixo você pode remover temas já
127	125	escolhidos. Clique em vários temas para escolher mais de um</span> <span
...	...	@@ -188,10 +186,12 @@ include "../init/head.php";
188	186	<label> Utilize o navegador abaixo para definir as coordenadas geográficas do
189	187	seu mapa. Após escolher a região, clique no botão de captura.</label>
190	188	<div class="row">
191		- <div class="col-sm-6 text-center">
192		- <div id="i3geo_gl_mapa1" style="width: 256px; height: 256px; border: 1px solid gray;"></div>
	189	+ <div class="col-sm-12 text-center">
	190	+ <div id="i3geo_gl_mapa1" style="width: 100%; height: 256px; border: 1px solid gray;"></div>
193	191	</div>
194		- <div class="col-sm-6 text-center">
	192	+ </div>
	193	+ <div class="row">
	194	+ <div class="col-sm-12 text-center">
195	195	<button onclick="$i3geo_gl.OL.capturageo();return false;" class="btn btn-primary">Capturar</button>
196	196	</div>
197	197	</div>
...	...	@@ -201,12 +201,12 @@ include "../init/head.php";
201	201	os valores ou capture as coordenadas</label>
202	202
203	203	<div class="coord form-group label-floating">
204		- <label class="control-label" >X mínimo (longitude oeste -)</label> <input
	204	+ <label class="control-label">X mínimo (longitude oeste -)</label> <input
205	205	class="form-control" id="i3geo_gl_xmin" type="text" onchange="$i3geo_gl.crialink()" />
206	206	</div>
207	207	<div class="coord form-group label-floating">
208		- <label class="control-label" for="i3geo_gl_xmax">X máximo (longitude leste +)</label> <input
209		- class="form-control" id="i3geo_gl_xmax" type="text" onchange="$i3geo_gl.crialink()" />
	208	+ <label class="control-label" for="i3geo_gl_xmax">X máximo (longitude leste +)</label>
	209	+ <input class="form-control" id="i3geo_gl_xmax" type="text" onchange="$i3geo_gl.crialink()" />
210	210	</div>
211	211	<div class="coord form-group label-floating">
212	212	<label class="control-label" for="i3geo_gl_ymin">Y mínimo (latitude sul -)</label> <input
...	...	@@ -214,8 +214,8 @@ include "../init/head.php";
214	214	</div>
215	215
216	216	<div class="coord form-group label-floating">
217		- <label class="control-label" for="i3geo_gl_ymax">Y máximo (latitude norte +)</label> <input
218		- class="form-control" id="i3geo_gl_ymax" type="text" onchange="$i3geo_gl.crialink()" />
	217	+ <label class="control-label" for="i3geo_gl_ymax">Y máximo (latitude norte +)</label>
	218	+ <input class="form-control" id="i3geo_gl_ymax" type="text" onchange="$i3geo_gl.crialink()" />
219	219	</div>
220	220	</div>
221	221	</div>
...	...	@@ -229,7 +229,6 @@ include "../init/head.php";
229	229	<script src='dicionario.js'></script>
230	230	<script src='index.js'></script>
231	231	<script>
232		- //$(document).ready(function(){
233	232	i3GEO.configura = {
234	233	"locaplic" : window.location.href.split("/permlinks")[0],
235	234	"sid" : ""
...	...	@@ -242,7 +241,6 @@ include "../init/head.php";
242	241	i3geo_gl_inicia(i3geo_gl_configura);
243	242	$i3geo_gl.buscageo_init();
244	243	$.material.init();
245		- //});
246	244	</script>
247	245	</body>
248	246	</html>
...	...