1. Instalar o mongrel e utilizar este servidor.

gem install mongrel

./script/server mongrel

2. [Não recomendado] Edite a linha 15 do arquivo lib/ruby/x.x/webrick/htmlutils.rb para:

str = string ? string.to_s.dup : ""

O problema é que a a exceção NotModified é passa para HTMLUtils::escape como uma classe, ao invés de uma string (originalmente lançada em HTTPServlet::DefaultFileHandler). Desde que as únicas coisas que realmente podem ser escapadas em HTML são string, deveria ser seguro sempre converter a entrada para uma string.

Alternativamente, no método handle_file do DispatchServlet  do webrick (lib/webrick_server.rb na gem do rails), antes que ele chame res.set_error
com a exceção, você poderia forçar o err.message a ser uma string, ou até mesmo limpar a mensagem.

***

Adaptado de: http://www.ruby-forum.com/topic/206225

1. Primeiro passo

Primeiramente, eu gero o CRUD, normalmente:

./scripts/generate scaffold admin/dog name:string age:integer

Em seguida, corrijo o config/routes.rb:

# Removo a linha abaixo
map.resources :dogs
 
# E adiciono esta
map.namespace :admin do |admin|
admin.resources :dogs
end

Em seguida, faço a correção da migração, renomeando o arquivo de timestamp_create_admin_dogs.rb para timestamp_create_dogs.rb.

Abrindo o arquivo, removo as referências ao namespace admin:

class Create***Admin***Dogs < ActiveRecord::Migration
def self.up
create_table :***admin_***dogs do |t|
t.string :name
t.integer :age
 
t.timestamps
end
end
 
def self.down
drop_table :***admin_***dogs
end
end

Em seguida, posso mover o arquivos apps/models/admin/dog.rb para o diretório superior e renomear o modelo para Dog.

Neste ponto, faço a migração para testar… agora começam as alterações mais chatas:

2. Corrigindo o controlador

Abra o controlador de dogs (que exemplo original!) e:

a) substitua todos os nomes de modelo Admin::Dog para Dog.

(Obs: cuidado com o Ctrl+H… o controlador precisa continuar se chamando Admin::DogsController)

b) altere o nome de todas as variáveis de instância @admin_dogs para @dogs.

c) nos métodos create e update, substitua o parâmetro de rediret_to de redirect_to(@dog) para redirect_to([:admin, @dog]).

3. Corrigindo as visões

a) Na chamada do formulário e links, indique que apontam para o namespace admin: [:admin, @dog].

b) Igualmente, no laço do índice índice, os links para dog por [:admin, dog].

b) Substitua os xyz_dogs_path por xyz_admin_path.

É isso aí, trabalheira danada… espero nos próximos dias aprender um jeito melhor de fazer isso! Mas nada melhor pra exercitar o cérebro do que escrever sobre isso!

Atualmente [21/06/2010] a propriedade só é suportada em navegadores baseados no Webkit ou no Firefox, através das propriedades -webkit-box-shadow e -moz-box-shadow, respectivamente. No entanto, implementei-os em um projeto pessoal, e percebi que a renderização se tornou lenta no scroll de textos longos.

Traduzindo a documentação da W3C:

A propriedade ‘box-shadow’ anexa uma ou mais sombras à caixa. A propriedade é uma lista de sombras separadas por vírgulas, cada uma especificada por 2 a 3 medidas de largura, uma cor opcional, e uma palavra-chave ‘insert’ opcional. Larguras omitidas são iguais a zero; cores omitidas são iguais à cor escolhida pelo usuário.

Onde

<sombra> = inset? && [ <largura>{2,4} && <cor>? ]

Os parâmetros informados para cada sombra são:

• inset – indica que a sombra é “interna”, isto é, fica dentro da caixa. [opcional]
• deslocamento horizontal, à direita. Utilize valores negativos para deslocar à esquerda.
• deslocamento vertical, para baixo. Utilize valores negativos para deslocar a sombra para cima.
• raio de desfoque: o quão “borrada” ficará a sombra. O padrão é 1 pixel. [opcional]
• raio de propagação: o quão distante a sombra se expandirá além da caixa. [opcional]
• cor: a cor da sombra. [opcional]

Um exemplo vale mais do que mil palavras:

#box {
 background: #ff0;
 box-shadow: 2px 2px 6px 3px #f00;
 -moz-box-shadow: 2px 2px 6px 3px #f00;
 -webkit-box-shadow: 2px 2px 6px 3px #f00;
 padding: 10px;
 width: 150px;
}

O código acima irá renderizar:

Um exemplo de sombra interna:

#box2 {
 background: #ccc;
 box-shadow: inset 2px 2px 5px #000;
 -moz-box-shadow: inset 2px 2px 5px #000;
 -webkit-box-shadow: inset 2px 2px 5px #000;
 border-radius: 5px;
 -moz-border-radius: 5px;
 -webkit-border-radius: 5px;
 padding: 10px;
 width: 150px;
}

Resultado 2:

Múltiplas sombras, de diversas cores:

#box3 {
 background: #000;
 color: #fff;
 box-shadow: -5px -5px 10px #f00,
 -5px  5px 10px #00f,
 5px -5px 10px #ff0,
 5px  5px 10px #0f0
 ;
 -moz-box-shadow: -5px -5px 10px #f00,
 -5px  5px 10px #00f,
 5px -5px 10px #ff0,
 5px  5px 10px #0f0
 ;
 -webkit-box-shadow: -5px -5px 10px #f00,
 -5px  5px 10px #00f,
 5px -5px 10px #ff0,
 5px  5px 10px #0f0
 ;
 padding: 10px;
 width: 150px;
}

Resultado 3:

Exemplo do quarto parâmetro “spread”:

#box4 {
 background: #000;
 color: #fff;
 box-shadow: 0 0 1px 10px #f00,
 0 0 1px 20px #00f,
 0 0 1px 30px #ff0,
 0 0 1px 40px #0f0
 ;
 -moz-box-shadow: 0 0 1px 10px #f00,
 0 0 1px 20px #00f,
 0 0 1px 30px #ff0,
 0 0 1px 40px #0f0
 ;
 -webkit-box-shadow: 0 0 1px 10px #f00,
 0 0 1px 20px #00f,
 0 0 1px 30px #ff0,
 0 0 1px 40px #0f0
 ;
 padding: 10px;
 width: 150px;
}

Resultado 4:

Divirta-se!

@charset

É usado para especificar o charset de sua folha de estilos (externa). É encontrada no topo de seu arquivo, e geralmente se parece com isso:

@charset “iso-8859-1″;

@import

É usado para importar uma outra folha de estilos, da seguinte forma:

@import url(novafolhadeestilos.css);

@import geralmente é usado para ocultar estilos de browsers antigos, que não os reconhecem muito bem. Desta forma é usado em conunto com a tag <link>.

@media

Aplicará seu conteúdo apenas ao tipo de mídia especificado. Algumas de suas opções são:

• all – qualquer mídia
• aural – sintetizadores de voz
• braille – braile
• handheld – para dispositivos portáteis
• print – para impressoras
• screen – para telas de computadores

Por exemplo, eu poderia especificar que para as impressoras, todo o texto deve ser negrito em uma fonte com serifa. Eu faria isso:

@media print { body {font-family:serif; font-weight:bold;} }

@font-face

É um método de especificar e embudir fontes de sua escolha no design de seu site. Para saber mais, consulte o Google Font Directory.

Este artigo é uma tradução livre de: http://www.devlounge.net/code/demystifying-css-at-rules