Mostrando postagens com marcador CSS. Mostrar todas as postagens
Mostrando postagens com marcador CSS. Mostrar todas as postagens

terça-feira, 5 de julho de 2011

Pegar valores de arquivo CSS com PHP

Suponhamos que você tenha um site onde pessoas podem alterar o tema da sua página pessoal, como cores, fontes, tamanhos, etc...

Aí você pensa: vou criar uma tabela no banco de dados com mil colunas pra saber o que o usuário colocou e o que não. Além de dar muito mais trabalho, a leitura do banco de dados é mais lenta e sobrecarrega seu servidor.
Então não seria mais simples salvar tudo num arquivo css personalizado, e carregá-lo depois?

O problema depois é ler esse arquivo, certo?
Errado, aqui tá a solução. Todos os dados do CSS são exportados para uma Array, mais fácil do que isso impossível neh?
Só usar a função:

function parse($file){
 $css = file_get_contents($file);
 preg_match_all( '/(?ims)([a-z0-9\s\.\:#_\-@,]+)\{([^\}]*)\}/', $css, $arr);
 $result = array();
 foreach ($arr[0] as $i => $x){
  $selector = trim($arr[1][$i]);
  $rules = explode(';', trim($arr[2][$i]));
  $rules_arr = array();
  foreach ($rules as $strRule){
   if (!empty($strRule)){
    $rule = explode(":", $strRule);
    $rules_arr[trim($rule[0])] = trim($rule[1]);
   }
  }
  
  $selectors = explode(',', trim($selector));
  foreach ($selectors as $strSel){
   $result[$strSel] = $rules_arr;
  }
 }
 return $result;
}
// Aqui vai o arquivo que você quer ler
$css = parse('css/personalizado_011246.css');

Para usar é muito fácil:

$css['body']['background-color'];
$css['#id']['color'];
$css['.class']['font-size'];

Remover borda/margem de checkbox no Internet Explorer (IE)

Fala pessoas.

Como sempre, e não surpreso, o IE (mesmo a versão 9) continua sempre querendo ser diferente e só complica para nós desenvolvedores.
Desta vez reparei que ele coloca uma baita margem e uma borda em todos checkboxes, dessa forma:

Então para que fique certo, basta fazer no seu arquivo de estilos (CSS): 

form input[type="checkbox"] { border:none; padding:0; }
 
Fui

domingo, 10 de abril de 2011

Centralizar div na horizontal com tamanho variável.

Meses procurando finalmente encontrei uma solução para centralizar uma div na horizontal que não tem seu tamanho definido.
Pra variar não encontrei nada em português....

Se você tem aqueles alertas tipo de "Carregando" igual o que tem nos serviços do Google sabe? Numa div amarela centralizada no topo você vai precisar disso.

O segredo é fazer 3 divs pra isso (uma coisa tão simples, precisa de tudo isso... fazer o que né?)
Vamos imaginar o código assim:

<div class="centralizar"><div>
<div id="alerta">Carregando...</div>
</div></div>

Agora o css vai ficar assim:

/* tira o que sobrar do lado, e centraliza */
.centralizar {
    position:relative;
    overflow:hidden;
}
.centralizar > div {
    float:left;
    position:fixed;
    left:50%;
}
#alerta {
    /*display:none;*/
    float:left;
    position:relative;
    left:-50%;
    padding:4px;
    background-color:#FF9;
    color:#000;
}


É isso aí...