Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Acesso rápido

Fóruns de suporte oficiais
Conectar-se

Esqueci minha senha

Últimos assuntos
» [Pedido] Ranks
Hoje à(s) 06:34 pm por iScroll

» Como tirar o título do rank
Hoje à(s) 05:24 pm por BichodoMato

» (PEDIDO) Ranks
Hoje à(s) 05:12 pm por Tiger

» Ícone de campos de perfil não aparece
Hoje à(s) 05:04 pm por zHugh

» [Pedido] Banner ®
Hoje à(s) 04:46 pm por mocci

» [PEDIDO] Brasão de Armas
Hoje à(s) 04:17 pm por mocci

» Mudar caixas de usuários online, grupos e aniversariantes
Hoje à(s) 04:16 pm por Kyo Panda

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Parceiros Forumeiros
Quem está conectado
310 usuários online :: 13 usuários cadastrados, Nenhum Invisível e 297 Visitantes :: 2 Motores de busca

dxmar74, Hancki, Hastad, iPlayer, iScroll, Jéssica Albuquerque, Kyko, mocci, odelgado, S1L3NC3SS, ShadowPrince, William_iHarDz, zHugh

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em 24/12/09, 01:05 pm

Personalizar Barra de Tarefas estilo FdF

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 09/06/16, 10:56 am

Endereço do fórum: http://olimpiadaenem.forumeiros.com
Versão do fórum: PhpBB3

Descrição


Olá,
Quero personalizar a barra superior de meu fórum para que ela fique semelhante a do PdF, porém em cor mais escura, para combinar com o tema de meu fórum.
Para isso, a partir do estilo da barra do FdF preciso que sejam feitas as seguintes alterações:

1 - Escurecer a barra, a cor deve ser #2D3134;
2 - Remover botões de redes sociais;
3 - Escrever a palavra Forumeiros com a mesma fonte, porém na cor Branca;
4 - Escrever as informações como "Bem-vindo Usuário" e "Notificações" também com a cor Branca;
5 - As demais funções permanecem iguais.
Obs.: Não precisa se preocupar com a imagem do usuário que aparece nessa barra. Tenho um código funcionando, criado aqui no fdf, que faz essa função de inserir a foto.

Espero que seja possível atender meu pedido, aguardo ajuda!


Última edição por TreiMark em 03/07/16, 11:06 pm, editado 1 vez(es)
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por Sennior em 09/06/16, 12:07 pm

Saudações!

Aceda à tua Folha de Estilo CSS:
Cpainel ->> Visualização ->> Gestão de imagens ->> Cores ->> Folha de Estilo CSS
Código:
#fa_toolbar {background-color: #2D3134!important;}span#fa_share {display: none!important;
}a#fa_service {color: #fff!important;font-family: sans-serif!important;font-size: 16px!important;font-weight: 700!important;text-transform: uppercase!important;}#fa_right #fa_menu #fa_welcome, #fa_right.notification #fa_menu #fa_welcome, #fa_welcome, #fa_right #fa_notifications {color: #FFFFFF!important;font-family: sans-serif!important;font-size: 13px!important;font-weight: 700!important;text-transform: uppercase;}

Resulta?
Até mais.
Sennior


Seta Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Seta  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Seta Perdeu a senha de administração? Veja o que fazer.
Seta Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".
avatar

Sennior
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16303
Pontos Ativos : 20795

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 09/06/16, 12:17 pm

Funcionou parcialmente, o problema é que no meu fórum está a barra do tema padrão:


Então precisaria primeiro modificar ela para ficar igual a do fdf fazendo as alterações solicitadas.

Ou seja, o que tenho é a barra padrão acima e quero chegar em algo igual a barra do fdf com todas aquelas alterações que descrevi no 1º tópico.

Obs.: O itens 1 e 2 estão satisfeito com o uso dessa parte do código:
#fa_toolbar {background-color: #2D3134!important;}span#fa_share {display: none!important;


Última edição por TreiMark em 09/06/16, 12:21 pm, editado 1 vez(es)
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por while em 09/06/16, 12:20 pm

Olá amigo! Troque o código passado pelo Sennior por este:

Código:
#fa_toolbar {background-color:#2D3134!important;}
        #fa_share {display:none!important;}
        #fa_toolbar #fa_service {color: #fff!important;font-family: sans-serif;font-size: 16px;font-weight: 700;text-transform: uppercase;}
        #fa_right {color:#fff!important;}
       

Atenciosamente,
While.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3102
Pontos Ativos : 4499

http://www.ajuda.forumeiros.com https://www.facebook.com/https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 09/06/16, 12:24 pm

While, leia minha última mensagem. O código não funcionou, é preciso modificar mais coisas...
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/
  • 0

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por Sennior em 09/06/16, 12:28 pm

Ah sim! Deseja como o FDF, só que com essas modificações né?
Troque por este código e veja como esta ficando:
Código:
#fa_toolbar {background-color: #2D3134!important;}span#fa_share {display: none!important;
}a#fa_service {color: #fff!important;font-family: sans-serif!important;font-size: 16px!important;font-weight: 700!important;text-transform: uppercase!important;}#fa_right #fa_menu #fa_welcome, #fa_right.notification #fa_menu #fa_welcome, #fa_welcome, #fa_right #fa_notifications {color: #FFFFFF!important;font-family: sans-serif!important;font-size: 13px!important;font-weight: 700!important;text-transform: uppercase;}
#fa_right #fa_menu #fa_welcome, #fa_right #fa_notifications, #fa_right a.rightHeaderLink {
    background-color: transparent!important;
    border: 1px solid #fff!important;
    border-radius: 3px!important;
    font-size: 11px!important;
    font-weight: 700!important;
    line-height: 22px!important;
    margin-left: -11px;
    margin-top: 3px!important;
    padding: 0 6px!important;
    text-decoration: none!important;
    transition: 200ms;
    margin-right: 18px;
}
a#fa_hide {
    display: none!important;
}
#fa_search #fa_magnifier {
    position: absolute;
    background-position: -30px 0px;
}
#fa_toolbar #fa_magnifier, #fa_toolbar #fa_fb, #fa_toolbar #fa_twitter, #fa_toolbar #fa_gp, #fa_toolbar #fa_mail, #fa_toolbar #fa_rss, #fa_toolbar #fa_hide, #fa_toolbar_hidden #fa_show {
    background-image: url('http://www.illiweb.com/fa/i/toolbar/toolbar.png');
    width: 30px;
    height: 30px;
    cursor: pointer;
}

#fa_search #fa_magnifier {
    background: url(http://i21.servimg.com/u/f21/18/21/41/30/search10.png) no-repeat 50% 50% #39C!important;
    border: 1px solid #39C;
    border-left: none;
    border-radius: 0 3px 3px 0;
    height: 22px!important;
    right: 0;
    top: 3px;
    width: 22px!important;
}
#fa_search #fa_magnifier {
    position: absolute;
    background-position: -30px 0px;
}
a#fa_magnifier {
    position: absolute;
    left: 22pc;
}


Até mais.


Seta Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Seta  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Seta Perdeu a senha de administração? Veja o que fazer.
Seta Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".
avatar

Sennior
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16303
Pontos Ativos : 20795

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 09/06/16, 07:26 pm

Vou tentar explicar de modo mais detalhado.


Para começar, quero que aquele logo antigo seja substituído por esse em azul do canto esquerdo.
A palavra Forumeiros deve aparecer com esse mesmo estilo porém escrita em branca, pois o fundo será escuro, ao contrário do que acontece no fdf.
Além disso, quando passar o cursor sobre a palavra não deve aparecer o sublinhado, que insiste em aparecer um meu fórum.

A barra de busca deve ficar igual a do fdf apenas com o fundo escuro. Além disso, ela só deve aparecer por completo quando colocado o cursor sobre ela, assim como acontece aqui no fdf.

Em seguida,

Preciso que as informações abaixo estejam com uma "borda" em azul, assim como a figura abaixo, mas as escritas, que estão em azul devem ser brancas por causa do tema escuro.



Ao passar o cursor sobre esses "botões" eles devem ficar todo em azul, assim como acontece aqui no fdf.

Por fim a seta no canto direito. Ela precisa ficar ao contrário do que acontece aqui no fdf, ou seja, ser branca em condições normais mas ser preta com uma caixa em azul quando o cursos estiver sobre ela.


Com o último código que me passou o resultado é esse:


Encontrei um tópico em que o mesmo assunto foi debatido, mas o resultado obtido com o código fornecido lá também foi ruim. Mesmo assim, informo o link abaixo caso queira dar uma verificada. De repente pode ser uma boa maneira de conseguir resolver o meu problema... Não entendo muito de códigos, por isso deixo essa parte para os especialistas.

http://ajuda.forumeiros.com/t105096-barra-de-ferramentas?highlight=Barra+de+Ferramentas
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por while em 09/06/16, 11:04 pm

Olá, troque o css passado pelo Sennior para este:
Código:
#fa_toolbar {background-color: #2D3134!important;}span#fa_share {display: none!important;
}a#fa_service {color: #fff!important;font-family: sans-serif!important;font-size: 16px!important;font-weight: 700!important;text-transform: uppercase!important;}#fa_right #fa_menu #fa_welcome, #fa_right.notification #fa_menu #fa_welcome, #fa_welcome, #fa_right #fa_notifications {color: #FFFFFF!important;font-family: sans-serif!important;font-size: 13px!important;font-weight: 700!important;text-transform: uppercase;}
#fa_right #fa_menu #fa_welcome, #fa_right #fa_notifications, #fa_right a.rightHeaderLink {
    background-color: transparent!important;
    border: 1px solid #39C!important;
    border-radius: 3px!important;
    font-size: 11px!important;
    font-weight: 700!important;
    line-height: 22px!important;
    margin-left: -11px;
    margin-top: 3px!important;
    padding: 0 6px!important;
    text-decoration: none!important;
    transition: 200ms;
    color:#fff!important;
    margin-right: 18px;
}
a#fa_hide {
    display: none!important;
}
#fa_search #fa_magnifier {
    position: absolute;
    background-position: -30px 0px;
}
#fa_toolbar #fa_magnifier, #fa_toolbar #fa_fb, #fa_toolbar #fa_twitter, #fa_toolbar #fa_gp, #fa_toolbar #fa_mail, #fa_toolbar #fa_rss, #fa_toolbar #fa_hide, #fa_toolbar_hidden #fa_show {
    background-image: url('http://www.illiweb.com/fa/i/toolbar/toolbar.png');
    width: 30px;
    height: 30px;
    cursor: pointer;
}
 
#fa_search #fa_magnifier {
    background: url(http://i21.servimg.com/u/f21/18/21/41/30/search10.png) no-repeat 50% 50% #39C!important;
    border: 1px solid #39C;
    border-left: none;
    border-radius: 0 3px 3px 0;
    height: 22px!important;
    right: 0;
    top: 3px;
    width: 22px!important;
}
#fa_search #fa_magnifier {
    position: absolute;
    background-position: -30px 0px;
}
a#fa_magnifier {
    position: absolute;
    left: 22pc;
}
#fa_right #fa_menu #fa_welcome:hover, #fa_right #fa_notifications:hover, #fa_right a.rightHeaderLink:hover, #fa_right.welcome #fa_menu #fa_welcome, #fa_toolbar > #fa_right.notification > #fa_notifications {
    background-color: #3091C1!important;
    border-color: #3091C1!important;
    color: #FFF!important;
}
 

Resulta?
Atenciosamente,
While.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3102
Pontos Ativos : 4499

http://www.ajuda.forumeiros.com https://www.facebook.com/https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 09/06/16, 11:56 pm

While, apenas os botões ficam em azul quando o cursos está sobre eles. O restante permanece sem as alterações que preciso.

avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 12/06/16, 12:00 am

#UP
Por favor, ajudem! Por favor
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 14/06/16, 11:04 pm

#UP Pensativo

O que há de errado?
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/
  • 0

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por Sennior em 16/06/16, 01:29 pm

Boas!

Vamos lá, coloque agora este código.
Depois me diga o que quer mudar:
Código:
#fa_search #fa_textarea {
    text-indent: 30px !important;
    width: 200px;
    height: 24px;
    padding: 0px;
    border: 0px;
    margin-top: 3px;
    border-radius: 5px;
    line-height: 24px;
}
#fa_search #fa_textarea {
    background: #39C!important;
    border: 1px solid #39C!important;
    border-radius: 3px 0 0 3px!important;
    color: #39C!important;
    cursor: text;
    font-size: 12px!important;
    height: 16px!important;
    line-height: 12px!important;
    margin-right: 23px!important;
    padding: 3px 0 3px 1px !important;
    transition: 300ms;
    width: 0!important;
}
        #fa_toolbar #fa_left #fa_service {
    text-decoration: none!important;
}

#fa_toolbar #fa_service {
    display: inline-block !important;
    visibility: visible !important;
    text-decoration: none !important;
}
#fa_icon, #fa_toolbar #fa_service {
    color: #666666;
}
#fa_toolbar a:link, #fa_toolbar a:visited, #fa_toolbar a:hover, #fa_toolbar a:active {
    border: 1px solid transparent;
    border: none;
}
#fa_toolbar :link, #fa_toolbar :visited {
    color: #FFFFFF;
    text-decoration: none;
}
#fa_service {
    color: #666!important;
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
}
.fa_tbMainElement, .fa_tbMainElement a, #fa_show {
    display: inline-block !important;
    vertical-align: middle;
}#fa_share a {
    background: url(http://i21.servimg.com/u/f21/18/21/41/30/fa_sha10.png) no-repeat 0 0 transparent!important;
    border-radius: 25px;
    height: 25px!important;
    margin: -2px 3px 0!important;
    width: 25px!important;
}#fa_right #fa_menu #fa_welcome, #fa_right.notification #fa_menu #fa_welcome {
    color: #666666;
}
#fa_right #fa_menu #fa_welcome, #fa_right #fa_notifications, #fa_right a.rightHeaderLink {
    background-color: transparent!important;
    border: 1px solid #39C!important;
    border-radius: 3px!important;
    color: #39C!important;
    font-size: 11px!important;
    font-weight: 700!important;
    line-height: 22px!important;
    margin-top: 3px!important;
    padding: 0 6px!important;
    text-decoration: none!important;
    transition: 200ms;
}a#fa_hide {
    display: none!important;
}
#fa_search #fa_textarea:focus, #fa_search #fa_textarea:hover, #fa_search:hover #fa_textarea {
    background: #FFF!important;
    color: #444!important;
    outline: none;
    padding: 3px!important;
    width: 150px!important;
}

#fa_search #fa_textarea {
    text-indent: 30px !important;
    width: 200px;
    height: 24px;
    padding: 0px;
    border: 0px;
    margin-top: 3px;
    border-radius: 5px;
    line-height: 24px;
}
#fa_search #fa_textarea {
    background: #39C!important;
    border: 1px solid #39C!important;
    border-radius: 3px 0 0 3px!important;
    color: #39C!important;
    cursor: text;
    font-size: 12px!important;
    height: 16px!important;
    line-height: 12px!important;
    margin-right: 23px!important;
    padding: 3px 0 3px 1px !important;
    transition: 300ms;
    width: 0!important;
}

Até mais.
Sennior


Seta Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Seta  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Seta Perdeu a senha de administração? Veja o que fazer.
Seta Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".
avatar

Sennior
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16303
Pontos Ativos : 20795

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 16/06/16, 08:47 pm

Olá Sennior,
Obrigado por me responder, estava pensando que tinham desistido de meu problema.
A barra não ficou como desejo. Vejo que está sendo difícil solucionar os detalhes.

Por isso, tenho uma sugestão: Talvez seja melhor deixar a barra de meu fórum igual a do fdf e depois fazer as alterações necessárias.
O que você acha da ideia? Aguardo seus comentários.
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 19/06/16, 09:19 am

#UP

Novidades! Usando o código abaixo obtive o efeito apresentado na imagem:

Código:
span#fa_share {
    display: none!important;
}

#fa_toolbar {background-color: #2D3134!important;}

#fa_icon {
    background-image: url(http://i21.servimg.com/u/f21/18/21/41/30/pa1110.png)!important;
}

#fa_right #fa_menu #fa_welcome, #fa_right #fa_notifications, #fa_right a.rightHeaderLink {
    background-color: transparent!important;
    border: 1px solid #39C!important;
    border-radius: 3px!important;
    color: #FFFFFF!important;
    font-size: 11px!important;
    font-weight: 700!important;
    line-height: 22px!important;
    margin-top: 3px!important;
    padding: 0 6px!important;
    text-decoration: none!important;
    transition: 200ms;
}

a#fa_service {
  color: #fff!important;
  font-family: sans-serif!important;
  font-size: 15px!important;
  font-weight: 700!important;
  text-transform: uppercase!important;
}

#fa_right #fa_menu ul, #fa_right.notification #fa_menu ul {
    display: none;
}

#fa_toolbar #fa_left #fa_service {
    text-decoration: none!important;
}

#fa_search {
    margin-left: 20px;
    height: 30px;
}
#fa_search {
    position: relative;
}
#fa_search form {
    margin: 0;
    padding: 0;
    display: inline;
}
#fa_search #fa_magnifier {
    background: url(http://i21.servimg.com/u/f21/18/21/41/30/search10.png) no-repeat 50% 50% #39C!important;
    border: 1px solid #39C;
    border-left: none;
    border-radius: 0 3px 3px 0;
    height: 22px!important;
    right: 0;
    top: 3px;
    width: 22px!important;
}

#fa_search #fa_textarea {
    text-indent: 30px !important;
    width: 200px;
    height: 24px;
    padding: 0px;
    border: 0px;
    margin-top: 3px;
    border-radius: 5px;
    line-height: 24px;
}
#fa_right #fa_menu #fa_welcome:hover, #fa_right #fa_notifications:hover, #fa_right a.rightHeaderLink:hover, #fa_right.welcome #fa_menu #fa_welcome, #fa_toolbar > #fa_right.notification > #fa_notifications {
    background-color: #39C!important;
    border-color: #39C!important;
    color: #FFF!important;
}

#forum-search .inputbox, #search .inputbox, #search_menu .inputbox, .inputbox.desc_search_input {
    background: #FFF;
    border: 1px solid #39C;
    border-radius: 3px 0 0 3px;
    height: 22px;
    margin-right: -2px;
    padding: 3px;
}



Apenas duas coisas precisam ser feitas ainda:

Deixar a barra de pesquisa com o mesmo efeito da barra do fdf, assim como aquelas setas que aparecem no canto direito para exibir/ocultar a barra de ferramentas.

Aguardo ajuda...
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/
  • 0

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por Sennior em 22/06/16, 01:10 pm

Boas!

Coloque este código no inicio d eteu CSS:
Código:
#fa_toolbar #fa_magnifier, #fa_toolbar #fa_fb, #fa_toolbar #fa_twitter, #fa_toolbar #fa_gp, #fa_toolbar #fa_mail, #fa_toolbar #fa_rss, #fa_toolbar #fa_hide, #fa_toolbar_hidden #fa_show {
    background-image: url('http://www.illiweb.com/fa/i/toolbar/toolbar.png')!important;
    width: 21px!important;
    height: 23px!important;
    cursor: pointer!important;
    background-position-x: -13pc!important;
    background-position-y: -3px!important;
}

Até mais.
Sennior


Seta Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Seta  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Seta Perdeu a senha de administração? Veja o que fazer.
Seta Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".
avatar

Sennior
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16303
Pontos Ativos : 20795

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 22/06/16, 04:29 pm

Sennior, o código não funcionou. Ficou mais estranho do que já estava...
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 25/06/16, 09:58 pm

#UP

Preciso que esse problema da seta no canto direito seja arrumado, em primeiro lugar.


Criei uma imagem com as setas adaptadas para o tema de meu fórum, talvez possa ajudar na solução do problema.


Aguardo ajuda!
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por Sennior em 28/06/16, 01:04 pm

Mas ué... Essa função já existe em te fórum autor.
Ao clicar sobre a seta ela esconde a barra de notificações.

O que deseja realmente?
Até mais.


Seta Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Seta  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Seta Perdeu a senha de administração? Veja o que fazer.
Seta Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".
avatar

Sennior
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16303
Pontos Ativos : 20795

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 29/06/16, 08:51 pm

A seta existe sim. Mas quero que quando o cursor fique sobre essa seta ela fique com uma borda azul, como na imagem da postagem anterior.
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/
  • 0

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por Sennior em 30/06/16, 09:29 am

Boas!

Assim?
Código:
a#fa_hide:hover {
    background: url(http://i35.servimg.com/u/f35/19/24/82/70/th/positi10.png) no-repeat -31px 0 transparent!important;
    color: #FFF!important;
}

Até mais.


Seta Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Seta  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Seta Perdeu a senha de administração? Veja o que fazer.
Seta Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".
avatar

Sennior
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16303
Pontos Ativos : 20795

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 01/07/16, 10:49 am

Sennior, funcionou parcialmente:



Quando a barra não está exibida não aparece a borda quando o cursor está sobre a seta.

O código que estou usando no momento é o seguinte:

Código:
span#fa_share {
    display: none!important;
}

#fa_toolbar {background-color: #2D3134!important;}

#fa_icon {
    background-image: url(http://i21.servimg.com/u/f21/18/21/41/30/pa1110.png)!important;
}

#fa_right #fa_menu #fa_welcome, #fa_right #fa_notifications, #fa_right a.leftHeaderLink {
    background-color: transparent!important;
    border: 1px solid #39C!important;
    border-radius: 3px!important;
    color: #FFFFFF!important;
    font-size: 11px!important;
    font-weight: 700!important;
    line-height: 22px!important;
    margin-top: 3px!important;
    padding: 0 6px!important;
    text-decoration: none!important;
    transition: 200ms;
}

a#fa_service {
  color: #fff!important;
  font-family: sans-serif!important;
  font-size: 15px!important;
  font-weight: 700!important;
  text-transform: uppercase!important;
}

#fa_right #fa_menu ul, #fa_right.notification #fa_menu ul {
    display: none;
}

#fa_toolbar #fa_left #fa_service {
    text-decoration: none!important;
}

#fa_search {
    margin-left: 20px;
    height: 30px;
}
#fa_search {
    position: relative;
}
#fa_search form {
    margin: 0;
    padding: 0;
    display: inline;
}
#fa_search #fa_magnifier {
    background: url(http://i21.servimg.com/u/f21/18/21/41/30/search10.png) no-repeat 50% 50% #39C!important;
    border: 1px solid #39C;
    border-left: none;
    border-radius: 0 3px 3px 0;
    height: 22px!important;
    right: 0;
    top: 3px;
    width: 22px!important;
}

#fa_search #fa_textarea {
    text-indent: 30px !important;
    width: 200px;
    height: 24px;
    padding: 0px;
    border: 0px;
    margin-top: 3px;
    border-radius: 5px;
    line-height: 24px;
}
#fa_right #fa_menu #fa_welcome:hover, #fa_right #fa_notifications:hover, #fa_right a.rightHeaderLink:hover, #fa_right.welcome #fa_menu #fa_welcome, #fa_toolbar > #fa_right.notification > #fa_notifications {
    background-color: #39C!important;
    border-color: #39C!important;
    color: #FFF!important;
}
a#fa_hide:hover {
    background: url(http://i35.servimg.com/u/f35/19/24/82/70/th/positi10.png) no-repeat -31px 0 transparent!important;
    color: #FFF!important;
}
#fa_search #fa_textarea {
    background: #39C!important;
    border: 1px solid #39C!important;
    border-radius: 3px 0 0 3px!important;
    color: #39C!important;
    cursor: text;
    font-size: 12px!important;
    height: 16px!important;
    line-height: 12px!important;
    margin-right: 23px!important;
    padding: 3px 0 3px 1px !important;
    transition: 300ms;
    width: 0!important;
}
#fa_search #fa_textarea:focus, #fa_search #fa_textarea:hover, #fa_search:hover #fa_textarea {
    background: #FFF!important;
    color: #444!important;
    outline: none;
    padding: 3px!important;
    width: 150px!important;
}

#fa_toolbar a:hover {
    text-decoration: underline;
}
#fa_toolbar_hidden {
    position: absolute;
    width: 30px;
    height: 30px;
    right: 0px;
    margin-top: -60px;
    background-color: #FFFFFF;
    border-radius: 0px 0px 5px 5px;
    z-index: 999;
}
#fa_toolbar_hidden {
    border: 1px solid #CCC;
    border-radius: 0!important;
    border-right: 0;
    border-top: 0;
}
.fa_fix {
    position: fixed !important;
    position: absolute;
    top: 0;
    right: 0;
}
#fa_hide, #fa_show {
    background: url(http://i35.servimg.com/u/f35/19/24/82/70/th/positi10.png) no-repeat 0 0 transparent!important;
}
#fa_show {
    background-position: -60px 0!important;
}

Um outro problema que tenho observado é que quando um visitante acessa o fórum os botões "login" e "registre-se" deveriam ficar no mesmo estilo dos botões "bem-vindo user" e "notificações".



Teria como você fazer uma verificação disso também, por favor? Muito feliz
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/
  • 0

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por while em 02/07/16, 09:31 am

Olá, adicione mais esse código em sua folha de estilo css:
Código:
 a#fa_show:hover {
              background: url(http://i35.servimg.com/u/f35/19/24/82/70/th/positi10.png) no-repeat -90px 0 transparent!important;
    color: #FFF!important;
        }
            a.rightHeaderLink {
                    background-color: transparent!important;
                    border: 1px solid #39C!important;
                    border-radius: 3px!important;
                    color: #fff!important;
                    font-size: 11px!important;
                    font-weight: 700!important;
                    line-height: 22px!important;
                    margin-top: 3px!important;
                    padding: 0 6px!important;
                    text-decoration: none!important;
                    transition: 200ms;
            }
a#fa_hide.rightHeaderLink {border:none!important;line-height:0px!important;padding:0px!important;margin-top:0px!important;transition:none!important;}

Até mais.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3102
Pontos Ativos : 4499

http://www.ajuda.forumeiros.com https://www.facebook.com/https://www.facebook.com/profile.php?id=100012157981279

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por TreiMark em 03/07/16, 11:05 pm

Obrigado while! Problema resolvido, pode encerrar o tópico.
Sennior, agradeço pela ajuda que me deu.
Ambos foram muito importantes para a obtenção desse resultado.
Novamente estou muito satisfeito com o obtido. Venerar
avatar

TreiMark
Nível 9

Masculino
Inscrito dia : 12/06/2015
Mensagens : 170
Pontos Ativos : 214

http://promec.forumeiros.com/

Resolvido Re: Personalizar Barra de Tarefas estilo FdF

Mensagem por while em 04/07/16, 12:19 am

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3102
Pontos Ativos : 4499

http://www.ajuda.forumeiros.com https://www.facebook.com/https://www.facebook.com/profile.php?id=100012157981279

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum