Como integrar o visual do Google Chrome com o tema padrão do Ubuntu

Share

ATUALIZAÇÃO: criei um script que automatiza todo o processo abaixo. Pra usar, só precisa instalar o gcolor2 para saber a cor do seu tema. No Terminal, digite:

1
2
3
wget https://dl.dropboxusercontent.com/s/o40i3aegy8qsfr6/fix_chromium_frame
./fix_chromium_frame codigo_cor nome_do_tema
sudo cp chromium.rc /usr/share/themes/TEMA/gtk-2.0/apps

Onde codigo_cor é o código obtido através do gcolor2 (sem o ‘#’), e nome_do_tema é apenas o nome do tema utilizado (não precisa setar o caminho completo). Por exemplo:

1
./fix_chromium_rc 454545 Ambiance-Flat-Aqua-Pro

Vai ser gerado um arquivo chromium.rc. Esse você copia como demonstrado no comando acima.
______________________________________________________________________

Quando instalamos um tema diferente, o Google Chrome pode apresentar uma aparência esquisita e em desacordo com o tema Gtk escolhido. Veja o antes e depois da modificação nas imagens abaixo:

Antes:

 

Depois:

 

Para ter a integração com o Chrome, é preciso fazer uma pequena modificação no arquivo /usr/share/themes/TEMA/gtk-2.0/apps/chromium.rc, ondeTEMA é o tema o qual você esta usando.

Mas antes, é preciso saber qual a cor você precisa colocar nesse arquivo. Para isso, instale o aplicativo Gcolor2:

1
sudo apt-get install gcolor2

Após a instalação, procure pelo gcolor no Dash e execute. A janela principal é a seguinte:

 

Selecione o item circulado em vermelho. Após a seleção, o formato do cursor irá mudar para que possamos escolher qualquer área da tela. Selecione qualquer parte do painel superior (preferencialmente em um lugar onde não há texto), para sabermos qual o código HTML corresponde com a cor do item selecionado.

Assim que clicar, o campo “Color Name” do gcolor será alterado para um valor específico. Esse valor é o código que precisamos colocar no arquivo chromium.rc. Deixe o gcolor aberto, e agora vamos editar o arquivo do tema. No Terminal:

1
sudo gedit /usr/share/themes/TEMA/gtk-2.0/apps/chromium.rc

Procure pela linha que começa com: style “chrome-gtk-frame” {

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
style "chrome-gtk-frame" {
    ChromeGtkFrame::frame-color            = @bg_color_dark
    ChromeGtkFrame::inactive-frame-color   = @bg_color_dark
    ChromeGtkFrame::frame-gradient-size               = 120
    ChromeGtkFrame::frame-gradient-color          = @bg_color_dark
    ChromeGtkFrame::inactive-frame-gradient-color         = @bg_color_dark
    ChromeGtkFrame::incognito-frame-color    = @bg_color_dark
    ChromeGtkFrame::incognito-inactive-frame-color          = @bg_color_dark
    ChromeGtkFrame::incognito-frame-gradient-size          = 120
   ChromeGtkFrame::incognito-frame-gradient-color          = @bg_color_dark
    ChromeGtkFrame::scrollbar-trough-color         = shade (0.99, @bg_color_dark)
    ChromeGtkFrame::scrollbar-slider-prelight-color = shade (0.87, @bg_color_dark)
    ChromeGtkFrame::scrollbar-slider-normal-color = shade (0.80, @bg_color_dark)
}
class "ChromeGtkFrame" style "chrome-gtk-frame"

OBS: dependendo do tema, alguns campos podem ser diferentes.

Esse é o meu chomium.rc padrão, do tema que eu uso atualmente. O que precisamos fazer aqui é alterar os campos: ChromeGtkFrame::frame-color, ChromeGtkFrame::inactive-frame-color, ChromeGtkFrame::frame-gradient-color e ChromeGtkFrame::inactive-frame-gradient-color.

Para evitar erros, comente com # essas linhas e abaixo delas vamos fazer as modificações;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
style "chrome-gtk-frame" {
#   ChromeGtkFrame::frame-color            = @bg_color_dark
#    ChromeGtkFrame::inactive-frame-color   = @bg_color_dark
    # cor para frame e inactive-frame
    ChromeGtkFrame::frame-color            = "#454545"
    ChromeGtkFrame::inactive-frame-color   = "#454545"
    ChromeGtkFrame::frame-gradient-size               = 120
#    ChromeGtkFrame::frame-gradient-color          = @bg_color_dark
#    ChromeGtkFrame::inactive-frame-gradient-color         = @bg_color_dark
    # cor para frame-gradient e inactive-frame-gradient
    ChromeGtkFrame::frame-gradient-color          = "#454545"
    ChromeGtkFrame::inactive-frame-gradient-color         = "#454545"
    ChromeGtkFrame::incognito-frame-color    = @bg_color_dark
    ChromeGtkFrame::incognito-inactive-frame-color          = @bg_color_dark
    ChromeGtkFrame::incognito-frame-gradient-size          = 120
   ChromeGtkFrame::incognito-frame-gradient-color          = @bg_color_dark
    ChromeGtkFrame::scrollbar-trough-color         = shade (0.99, @bg_color_dark)
    ChromeGtkFrame::scrollbar-slider-prelight-color = shade (0.87, @bg_color_dark)
    ChromeGtkFrame::scrollbar-slider-normal-color = shade (0.80, @bg_color_dark)
}

Substitua o valor #454545 pelo código dado pelo gcolor2, que é a cor do seu tema. Após as alterações, salve e feche o gedit e o gcolor. Feche também o Chrome e inicie novamente. Se as alterações não surgirem efeito, faça logout.

Para cada tema que você instalar, será necessário fazer essas mesmas alterações. Alguns temas já vem “corrigidos” para isso, porém a maioria que instalei aqui, precisei fazer essa alteração.

É isso, caso queira desfazer as alterações, remova as linhas onde você colocou o código dado pelo gcolor, e descomente as linhas originais. Qualquer dúvida, poste nos comentários! :-)

 

Artigo enviado por Ruan

Quer continuar por dentro das novidades do Blog Seja Livre? Siga o nosso perfil no TWITTER, curta a nossa página no FACEBOOK ou adicione o Blog Seja Livre nos seus círculos do GOOGLE+.