Changeset 3689 for branches/2.2/mobile

Timestamp:

01/17/11 15:31:55 (13 years ago)

Author:

eduardoalex

Message:

Ticket #1405 - Corrigido o layout da tela de login do expresso mini

Location:

branches/2.2/mobile/templates

Files:

• css/mobile.css (modified) (10 diffs)
• default/login.tpl (modified) (3 diffs)

branches/2.2/mobile/templates/css/mobile.css

@@ -9 +9 @@
 td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;}
 
+button{height:22px; font-size:xx-small; line-height:22px; }
 checkbox {padding:0; margin:0}
+input[type="file"] {height:30px}
 
 /*INSERIDOS*/
@@ -18 +20 @@
 #busca table { width:100%;}
 .gd {width:90%; padding:2px 0;}
-.pq {width:10%; padding-left:5px; padding-right:5px;text-align:center;}
+.pq {width:10%; padding-left:5px; padding-right:5px; text-align:center;}
 .bt {width:10%; padding-left:10px; }
 
@@ -31 +33 @@
 
 
-/*-------------------------------------------------------------------NAVEGACAO-----------------------------------------------------------*/
-        
-        .navegacao { width: 260px; float: left; margin-top: 22px; width: 30% }
-        .navegacao a{color:#515151; text-decoration:none;}
-        .navegacao a:hover{text-decoration:underline;}
-        .mail-novo { background: #09C; color: #fff; display: block; height: 21px; font-size: 12px; padding-top: 4px }
-        .mail-novo a { display: inline; color: #fff; padding: 2px 6px; font-size: 10px; text-decoration: none; background:#2b83ae }
-        .mail-novo a:hover { text-decoration: none; background: #09F}
-        #meus-emails, #meus-compromissos, #minhas-pastas { font-size: 12px; color: #444 }
-                #emails-capacidade { font-size: 9px; color:#888 }
-                #emails-secoes { color: #444; font-size: 10px }         
-                .compromisso, .diretorios {}    
-                
-        #table-mail, #table-compromissos, #table-minhaspastas, #table-contatos, #mail-selecionados { font-size:12px; color: #222; line-height: 22px }
-                #mail_check { margin-left: 5px }
-                
-        
-.pagina { color: #fff; display: block; font-size: 12px; float: right; margin-top: 22px; width: 70% }
-        /*------------------------------------------------------------------/NAVEGACAO-----------------------------------------------------------*/
-        
-
-
 
 
@@ -60 +40 @@
 h1{ padding-top: 5px; height:20px; font-size:small; padding-left:5px; color:#FFFFFF; float:left;  }
 /*dt { padding:3px 3px 3px 10px; font-size:small; color:#3E3E3D; background-color:#CEE5EF; width:100%;}*/
-dt {font-size:small; color:#3E3E3D; background-color:#CEE5EF; width:100%;}
-.dt-azul, .dt-branco {background:#EEF7FA; clear:both; display:table;  width:100%; /*padding:10px 0*/}
+dt {font-size:small; color:#3E3E3D; background:#CEE5EF; width:100%;}
+.dt-azul, .dt-branco {background:#EEF7FA; clear:both; display:table;  width:100%;  }
 .dt-branco {background:#FFF;}
-p.seen, a.seen {font-weight:normal;width:100%;}
-p.important, a.important {color:#FF0000;}
+.fundo-branco-alinha{background:#FFF; margin-left:8px}
+.fundo-azul-alinha{background:#EEF7FA; margin-left:8px}
+
+.espacamento{padding:5px 0 5px 25px; margin:0 0 5px 0 }
+#palavra-procurada {background:#C0DCE9; height:22px; padding-top:4px; width:100%}
+#editando{font-size:120%; color:#666; margin-left:5px}
+div > p.dt-azul > strong{ margin-left:8px; float:left }
+
+dt.seen {font-weight:normal;width:100%;}
+dt.important, dt.important a {color:#FF0000;}
 dd{ padding-top:3px; /*padding-left:25px;*/ vertical-align:middle; font-size:small;}
 input{height: 15px;} /*o float left ta dando problema nos check boxs, por isso removi */
-textarea {width: 93%;}
-dt select, div.menu-contexto select {font-size:x-small; border:none; color:#ffffff; background-color:#2B84AF; margin:8px 0}
+textarea {width:94%; margin:0 0 0 5px}
+dt select, div.menu-contexto select {font-size:x-small; border:none; color:#ffffff; background-color:#2B84AF;}
 div.menu-contexto select{font-size:small; border:none; color:#ffffff; background-color:#2B84AF;}
 div.menu-contexto a {color:#FFFFFF; text-decoration:underline;}
-#operacao_lista {/*padding:5px; */min-height:40px; font-size:small; background-color:#C9C9C9; width:100%; padding-top:9px}
+#operacao_lista {font-size:small; background-color:#C9C9C9; width:100%; min-height:18px; padding:4px 0}
 #operacao_lista span {font-size:x-small;}
-#menu_rodape {background-color:#F2F2F2; }
-
-/*novo*/
-#menu_rodape ul { width:100%;  margin:0px 0 0 -10px; }
-#menu_rodape ul li { text-align:left; }
-#menu_rodape a {color:#2B84AF; font-size:x-small; }
+#menu_rodape {background-color:#F2F2F2; width:100%}
+#menu_rodape a {color:#2B84AF; font-size:small; }
+#menu_rodape_voltar{color:#666 !important; text-decoration:underline !important; font-size:small !important;}
+.busca-email-texto {margin-left:25px !important}
+
+
 
 
 
 /*ALTERADOS*/
-
-#corpo_mensagem {clear:both; /*padding-top:15px;*/ color:#666; width:100%; padding-left:10px; min-height:230px; padding-bottom:10px;font-size:small;}
-#corpo_mensagem #foto {padding:5px 0px 10px 10px;}
+/*#text_area{width:98%; margin-top:10px; margin:auto }*/
+#corpo_mensagem { display:table; color:#666; width:98%; margin:auto;font-size:small; padding:8px 0}
+.corpo_mensagem_detalhe, .corpo_mensagem_bg_branco {background:#EFF8FB; width:99.5% !important; padding-left:0.5% }
+.corpo_mensagem_bg_branco {background:#FFF}
+#corpo_mensagem #foto {padding:5px 0; text-align:center}
 #corpo_mensagem #foto img {border:1px solid #2B84AF;}
-#corpo_mensagem #nome {font-size:small; width:100%; /*padding:15px 0px 10px 10px;*/ font-weight:bold;}
+#corpo_mensagem #nome {font-size:small; width:100%;  font-weight:bold;}
 #corpo_mensagem #itens {font-size:x-small; float:left; font-weight:bold; text-align:right; padding-right:10px;}
 #corpo_mensagem #itens-preenchidos {font-size:x-small; width:50%; float:left; font-weight:normal;}
 #corpo_mensagem input {height:15px;}
 
-#campos-correspondencia {font-weight:bold; text-align:right;color:#666; background-color:#CEE5EF; width:100%; /*padding-left:10px;*/ min-height:120px; padding-bottom:30px;}
-.posiciona-esquerda {font-size:small;  float:left; font-weight:normal; text-align:left; width:74%; padding:6px 0 0 20px;  }
+#campos-correspondencia {font-weight:bold; text-align:left;color:#666; background-color:#CEE5EF; width:100%; padding:10px 0; display:table}
+#campos-correspondencia p{margin-left:0}
+.email-campos-alinhado{width:56px; text-align:right; border:#333 solid 1px; font-weight:bold; }
+ 
+
+.posiciona-esquerda {font-size:small;  float:left; font-weight:normal; text-align:left; width:80%; padding:2px 5px 0 5px;  }
+.aumenta-tamanho {width:98%; }
 .posiciona-esquerda input[type="checkbox"]{ vertical-align:baseline}
-.posiciona-esquerda p{ margin:5px 0 5px 0;}
-.posiciona-direita {font-size:x-small; float:left; font-weight:normal; text-align:left; width:20%; padding-top:16px }
+
+/*07/01/2011*/
+/*.posiciona-esquerda p{ margin:5px 0 5px 5px;}
+.posiciona-direita-busca { font-weight:normal; padding-top:8px; text-align:right; width:56px; float:right; margin-right:6px}
+.posiciona-direita {font-size:x-small; float:left; font-weight:normal; text-align:left; width:20%; padding-top:8px}
 .posiciona-direita p { margin-bottom:3px}
-.posiciona-direita span{ margin:6px 0 ; display:table}
-
+.posiciona-direita span{ margin:6px 0 ; padding:8px 0; font-size:x-small !important; font-weight:normal;  float:right }
+.posiciona-direita span a{ color:#666;   padding:8px 9px }*/
+
+
+
+.posiciona-esquerda p{ margin:5px 0 5px 5px}
+.posiciona-direita-busca { font-weight:normal; padding-top:8px; text-align:right; width:56px; float:right; margin-right:6px}
+.posiciona-direita {font-size:x-small; float:right; font-weight:normal; text-align:right; /*width:56px;*/ width:26px; padding-top:8px;}
+.posiciona-direita p { margin-bottom:3px}
+.posiciona-direita span{  font-size:x-small !important; font-weight:normal;  float:right }
+.posiciona-direita a{height:22px; color:#666;   padding:4px; font-size: x-small; }
 
 
 #lista_miolo {clear:both; color:#666; width:100%; /*min-height:165px;*/font-size:small; }
-#lista_miolo dd {background:#FFFFFF; /*padding:3px 3px 3px 10px;*/ width:100%;  }
+#lista_miolo dd {background:#FFFFFF; width:100%; display:table  }
 #lista_miolo dd.par {background:#EEF7FA; }
 #lista_miolo #iten {width:80%; float:left; font-weight:normal; text-align:left;}
@@ -116 +123 @@
 /*ALTERADOS*/
 
-#busca{ /*padding-left:10px;*/ padding-top:5px;background-color:#E4E4E4; min-height:35px; width:100%;}
-#busca input[type="text"] {height:20px; width:90%; margin-right:5px}
+#busca{padding:4px 0;background-color:#E4E4E4; min-height:18px; width:100%;}
+#busca input[type="text"] {height:20px; width:94%; margin:0 5px}
 #busca input[type="button"] {height:20px; min-width:100px;}
 /*.busca input {height:10px; width:87%; float:left;}*/
@@ -126 +133 @@
 
 
-.topo {width:100%; /*padding-left:10px;*/ background:#333; display:table }
+.resultado-titulo{background:#D4E7F0; min-height:18px; padding:4px 0; font-weight:bold}
+.resultado-titulo strong { margin-left:25px }
+.resultado-titulo div p strong {margin-left:88px}
+
+p.urgente {color:#F00; font-style:italic; font-size:x-small }
+div.urgente {width:14px; height:12px; background:#F00; margin-left:5px; text-align:center; vertical-align:middle;color:#FFF; float:left;font-size:xx-small; padding-top:1px}
+
+
+.topo {width:100%; background:#333; display:table }
 .topo a{color:#FFF; text-decoration:underline; float:right; margin:4px 20px 0 0 }
 
 .rodape{ padding-top:4px; height:16px; text-align:center; font-size:50%; background-color:#F6F6F6; color:#333333;}
-.btn-generico{color:#FFFFFF; background-color:#434343; border:none; min-width:60px;}
-.contagem { }
-.nome-item{float:left;width:74%;font-size:small; color:#3E3E3D}
+.btn-generico{color:#FFFFFF; background-color:#434343; border:none; }
+.contagem { float:right; margin-right:5px }
+.nome-item{float:left;width:80%;font-size:small; color:#3E3E3D; min-width::80%}
+.nome-item strong, .nome-item span{ margin-left:25px}
 .nome-item-telefone{margin-left:21px}
-.bg-branco{background:#FFF}
-
-.menu-contexto {/*padding-left:16px;*/ padding-top:6px; font-size:x-small; background-color:#3399CC; color:#FFFFFF; width:100%; min-height:35px;}
-.btn-contexto {font-size:x-small; background-color:#2B84AF; color:#FFFFFF; border:none;  min-height:30px; padding:5px }
+
+.menu-contexto {font-size:small; background-color:#3399CC; color:#FFFFFF; width:100%; min-height:18px; padding:4px 0}
+.menu-contexto span{margin-left:5px }
+.btn-contexto {font-size:x-small; background-color:#2B84AF; color:#FFFFFF; border:none; margin-left:5px }
 .menor {min-height:20px !important} 
-.btn-generico {padding:6px 4px; }
 
 /*novo*/ 
@@ -146 +161 @@
 
 
-#titulo {width:100%; }
-.titulo_mensagem {font-size:small; font-weight:bold; overflow: hidden; padding:15px 15px 5px 10px;}
+#titulo {width:100%; margin:2px 0; padding:20px 0; background-color:#CEE5EF;  }
+#fundo-branco{background:#FFF; }
+#titulo p{font-weight:normal; width:90% }
+.titulo_mensagem {font-size:small; font-weight:bold; overflow: hidden; } 
 .titulo-sdt{ padding:2px 0px 0px 5px; height:20px; font-weight:bold; font-size: x-small; color:#3E3E3D; }
 
 
-.menu-diverso{ height:35px;}
-.menu-diverso a{ margin-right:3px; padding:5px; font-size:x-small; background-color:#EEF7FA; color:#434343;}
-.menu-diverso a:hover,.menu-diverso a.letter-contact-selected {color:#FFFFFF;background-color:#3399CC;}
-dt.menu-diverso div {margin-top:8px;}
+.menu-diverso{ height:22px; padding-top:4px}
+.margin-geral{margin:0 0 5px 5px}
+.margin-rodape {margin:0 0 0 5px}
+.margin-geral a strong{font-size:x-small}
+.centraliza{ width:100%; margin:auto; text-align:center;}
+
+.menu-diverso a{ margin-right:3px; font-size:x-small; background-color:#EEF7FA; color:#434343; padding:3px 9px }        
+.menu-diverso a:hover,.menu-diverso a.letter-contact-selected {color:#FFFFFF;background-color:#3399CC; padding:3px 9px }
+.btn_off a { margin: 0 1px; display: inline;  }
+
 
 .reset-dt {background-color:#ffffff; width:98%; /*padding:10px 3px 3px 10px;*/}
 .reset-dt1 {width:98%; /*padding:3px 3px 3px 10px;*/}
-.dd-mensagem {height:30px;overflow: hidden;padding:3px 0px 15px 10px;}
-.btn-anexo {padding:2px; font-size: x-small; background-color:#FAD364;}
-.btn-anexo a {padding:3px; font-size: x-small;  background-color:#FAD364; }
+.dd-mensagem {height:30px;overflow: hidden;padding:3px 0px 15px 0;}
+.btn-anexo {font-size: x-small;  text-align:center; text-transform:uppercase; margin: 5px 3px 0 0; float:right }
+.btn-anexo-text {font-size: x-small;  text-align:center; text-transform:uppercase; margin: 5px 3px 0 82px; }
+.btn-anexo a {font-size: x-small;  background:#FAD364; width:40px; padding:3px; color:#333  }
 .sobre-mensagem {float:left;}
 
 
-#ver-detalhes {float:left;padding:2px; background-color:#FAD364;}
-#ver-detalhes a {padding:3px;color:#666;font-size:x-small;}
+#ver-detalhes {float:left;padding:2px; background-color:#FAD364; width:10%  } /*mudança*/
+#ver-detalhes a {padding:3px;color:#666;font-size:x-small; width:20px}
 
 
@@ -184 +208 @@
 .campos-correspondencia, .campos-entrada { }
 
-.login{ background-color:#EEF7FA;}
+.login{width:50%; margin:auto; padding:10px 0}
+.login strong {margin:0 0 0 5px; }
+.login input[type="text"]{width:100%; margin:3px 0}
+.login button {margin:0 5px}
 .login p{padding:3px;}
+#bg-aviso{background:#EFF8FB; padding-top:20px;}
 .avisos{background-color:#FAE1E1;}
-.aviso-positivo{ padding:5px; font-size:x-small; color:#333333; background-color:#CEE5EF; }
-.aviso-negativo{ padding:5px; font-size:x-small; color:#333333; background-color:#FAE1E1; }
+.aviso-positivo, .aviso-negativo{ padding:5px; font-size:x-small; color:#333333; background-color:#CEE5EF; width:80%; margin:auto  }
+.aviso-negativo{ background-color:#FAE1E1 }
 .aviso-positivo a,.aviso-negativo a{text-decoration:underline; color:#333333;}
 
@@ -194 +222 @@
 .bg-neutro{padding:5px; background-color:#EEF7FA;} 
 
-.rotulo-complementar{font-size:x-small; text-decoration:underline; padding:3px;}
+.rotulo-complementar{font-size:x-small; text-decoration:underline; padding:3px; float:right; }
 
 .mes_corrente { padding: 0 10px }
 
-#pre-calendario { padding: 10px; background: #eef7fa  }
+#pre-calendario {padding: 10px; background: #eef7fa ;  }
 #semanal { border: none; margin-bottom: 5px }
-
+#calendario {width:11%; margin:auto}
 #calendario thead tr th { color: #333; font-size:small; font-weight:bold;}
 #calendario thead tr th, #calendario tbody tr td { text-align: center } 
@@ -231 +259 @@
 a.outro_mes { background: #E1E1E1; color: #8B8B8B }
 
-.btn_off a { margin: 0 1px; display: inline; padding: 0 6px }
-
-
+
+
+
+
+
+
+/*---------------------------------------- CONTATO ÚNICO ---------------------------------------------*/
+
+.contato-unico {width:100%; margin:auto; }
+.contato-unico-bg {background:#EFF8FB; width:100% !important } 
+.nome {font-size:small; width:62px;  font-weight:bold;  margin:5px 0; }
+.nome label {text-align:right; width:62px; float:left; clear:left; margin-right:10px }
+.contato-unico input[type="text"] { width:71%; float:left; margin-bottom:5px;   }
+
+div.bloco{overflow: hidden; }
+.container{width:100%; margin:auto; overflow:hidden; }
+#block-label{ float:left;  width:60px; text-align:right; font-weight:bold; font-size:small  }
+#block-dados{float: left; width:78%; margin-left:5px; font-size:small; font-weight:normal }
+#block-label a {color:#666}
+                
+
+
+
+/*---------------------------------------- EMAIL ---------------------------------------------*/
+
+.email-geral{width:100%; padding:5px 0}
+.email-cabecalho{overflow: hidden; width:74%; height:22px; float:left;}
+.email-cabecalho p{font-size:medium}
+.email-anexo{width:16px; height:16px; float:left;  margin-top:5px}
+.email-data{width:69px; float:right; margin:5px 3px 0 0; margin-top:5px; text-align:right; font-size:x-small;}
+.email-corpo {clear:both; padding-bottom:5px; overflow:hidden; }
+.email-margin{margin:0 5px !important}
+.bg-azul {background:#EEF7FA; padding:5px 0}
+.bg-branco{background:#FFF; padding:5px 0}
+.email-corpo-sem-check p{margin:0 23px}
+.email-corpo p{margin:0 23px}
+.email-importante{color:#F00}
+.email-nao-lido{font-weight:bold}
+.email-lido{font-weight:normal}
+.email-labels {text-align:right; width:78px; display:table; float:left; margin-right:5px; height:22px; line-height:22px }
+.email-labels a{color:#666}
+.email-inputs{ margin-left:5px;border:#000 solid 1px;width:100% }
+.email-inputs input {width:100% ;  } 
+.limpar_div_margin {margin:2px 0; }
+.limpar_div_margin input[type="text"] {width:68%}
+p.assunto {font-size:small; font-weight:normal; padding-top:3px; color:#666}
 
 /*---------------------------------------- MODIFICAÇÕES ---------------------------------------------*/
 
 
-.email-item{color:#3E3E3D; font:bold small Arial, Helvetica, sans-serif; vertical-align:middle}
-.email-campos{color:#3E3E3D; font:bold small Arial, Helvetica, sans-serif; text-decoration:underline !important}
-
-
-.campos-email {width:100%; clear:both; margin-left:10px}
-.campos-email input {width:99%; clear:both}
-.campos-email a{float:left; text-align:right; margin-bottom:5px;}
+.email-item{color:#3E3E3D; font:bold small Arial, Helvetica, sans-serif; vertical-align:text-bottom}
+.email-campos, .assunto {color:#3E3E3D; font:bold small Arial, Helvetica, sans-serif; text-decoration:underline !important}
+.assunto {text-decoration:none !important}
+
+.campos-email {width:94%; clear:both; margin:0 5px}
+.campos-email input {width:99%; clear:both; }
+.campos-email a{float:left; text-align:right; margin:4px 0}

branches/2.2/mobile/templates/default/login.tpl

@@ -3 +3 @@
 
 <html xmlns="http://www.w3.org/1999/xhtml">
-    <head>   
-            <title>{website_title} - {lang_login}</title>
+        <head>   
+                <title>{website_title} - {lang_login}</title>
                 <meta content="text/html;width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0; charset=utf-8;" http-equiv="Content-Type" name="viewport" /> 
                 <meta name="format-detection" content="telephone=no" />
@@ -10 +10 @@
         </head>
         
-    <body>      
+        <body>          
                 <div class="topo">
                 <h1>{website_title} - {lang_login}</h1>
@@ -17 +17 @@
                 {message_box}
                 
-                <div class="campos-entrada">
-                        <form name="form_login" method="post" action="./login.php">
-                                <input type="hidden" name="passwd_type" value="text">
-                                <input type="hidden" name="account type" value="u">
-                                <p><strong><label>{lang_username}:&nbsp</label></strong></p>
-                                <p><input name="login"></p>
-                                <script>document.form_login.login.focus();</script>
-                                <p><strong><label>{lang_password}:&nbsp</label></strong></p>
-                                <p><input name="passwd" type="password" autocomplete=off></p>
-                                <p><button name="submitit" class="btn-contexto">{lang_login}</button></p>
-                        </form>
-                </div>
-                        
-                <div id="corpo_mensagem" class="login">
-                        <p><strong>{lang_notices}</strong></p>
-                        <div class="avisos">
-                                <p><strong>Bem vindo ao novo Expresso Mini!</strong></p>
-                                <p>Navegue, aprecie e opnie!</p> 
-                        </div>
-                </div>
+                
+                <form name="form_login" method="post" action="./login.php">
+                        <input type="hidden" name="passwd_type" value="text">
+                        <input type="hidden" name="account type" value="u">
+                        <dt id="lista_miolo">
+                                <div class="login">
+                                        <strong>{lang_username}:</strong><br/>
+                                        <input name="login"/><br/>
+                                        <script>document.form_login.login.focus();</script>
+                                        <strong>{lang_password}:</strong><br/>
+                                        <input name="passwd" type="password" autocomplete=off/><br/>
+                                        <button name="submitit" class="btn-contexto" style="margin-top:5px">{lang_login}</button>
+                                </div>
+                                
+        <div id="bg-aviso">
+                <div class="aviso-positivo">
+                                                <div class="margin-geral">
+                                                        <strong>Bem vindo ao novo Expresso Mini!</strong>
+                                                        <p>Navegue e aprecie.</p>
+                                                </div> 
+                                        </div>
+                                </div>                          
+                        </dt>
+                </form>
         
                 <div class="rodape">Projeto ExpressoLivre 2004 - 2010 :: Licen&ccedil;a de Software</div>
-    </body>
+        </body>
 </html>
 <!-- END page -->