Mudar a cor do Menu Principal e Rodapé - Layout Amazonas

Dicas Avançadas
#1

Ola a todos,

Preciso de uma ajuda.

Gostaria de estar mudando a cor do Menu principal e rodapé do meu site para preto e não estou conseguindo.

Já utilizei este scripr css abaixo e não deu certo:

.nav-list-arrow > i, .head-primary .utilities-item svg {

  1. color: #000000;
  2. fill: #000000;
  3. border-color: rgb(5 5 5 / 54%);
  4. border-top-color: rgba(5, 5, 5, 0.54);
  5. border-right-color: rgba(5, 5, 5, 0.54);
  6. border-bottom-color: rgba(5, 5, 5, 0.54);
  7. border-left-color: rgba(5, 5, 5, 0.54);

}

  • Alguem poderia me dizer aonde estou errando?
  • Esta certo a maneira de colocar a cor preto/black em hexadecimal e em RGB no codigo?

Por favor ficarei muito grato

Equipe JPF

1 curtida
#2

passa o link do seu site

#3

Ola @artezenesoterica ,

obrigado desde já pelo apoio.

#4

usa isso

.head-primary {

  1. background-color: #000000;
    }
#5

aqui esta tbem esta as cores que vc pode esta trocando

.section-topbar {
background-color: #F7D1E6;
color: #FFFFFF;
fill: #FFFFFF; }

.head-light {
color: #46459B;
fill: #46459B;
background-color: #FFFFFF; }
.head-light a:not(.btn-primary),
.head-light .svg-icon-text {
color: #46459B;
fill: #46459B; }
.head-light .badge {
color: #FFFFFF;
background: #46459B; }
.head-light .form-control {
color: #46459B;
border: 1px solid #46459B; }
.head-light .form-control::-webkit-input-placeholder {
color: #46459B; }
.head-light .form-control:-moz-placeholder {
color: #46459B; }
.head-light .form-control::-moz-placeholder {
color: #46459B; }
.head-light .form-control:-ms-input-placeholder {
color: #46459B; }
.head-light .nav-account a,
.head-light .nav-account svg {
color: #FFFFFF;
fill: #FFFFFF; }

.head-dark,
.head-primary {
color: #FFFFFF;
fill: #FFFFFF;
background-color: #000000; }
.head-dark .svg-icon-text,
.head-dark .nav-desktop-list > .nav-item > .nav-list-link,
.head-dark .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link,
.head-dark .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-arrow > i,
.head-dark .utilities-item svg,
.head-primary .svg-icon-text,
.head-primary .nav-desktop-list > .nav-item > .nav-list-link,
.head-primary .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link,
.head-primary .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-arrow > i,
.head-primary .utilities-item svg {
color: #FFFFFF;
fill: #FFFFFF;
border-color: rgba(255, 255, 255, 0.2); }
.head-dark .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link.selected,
.head-dark .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link.selected + .nav-list-arrow > i,
.head-primary .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link.selected,
.head-primary .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link.selected + .nav-list-arrow > i {
color: #FFFFFF;
fill: #FFFFFF;
opacity: 0.6; }
.head-dark .form-control,
.head-primary .form-control {
background-color: #FFFFFF;
border: 0; }
.head-dark a,
.head-primary a {
color: #FFFFFF;
fill: #FFFFFF; }
.head-dark .btn-secondary,
.head-primary .btn-secondary {
color: #46459B; }
.head-dark .badge,
.head-primary .badge {
color: #FFFFFF;
background: #46459B; }

.head-primary {
background-color: #46459B; }
.head-primary .icon-underline:after {
background-color: rgba(255, 255, 255, 0.4); }
.head-primary .badge {
color: #46459B;
background: #F7D1E6; }
.head-primary .form-control {
color: #46459B; }
.head-primary .form-control::-webkit-input-placeholder {
color: #46459B; }
.head-primary .form-control:-moz-placeholder {
color: #46459B; }
.head-primary .form-control::-moz-placeholder {
color: #46459B; }
.head-primary .form-control:-ms-input-placeholder {
color: #46459B; }
.head-primary .search-suggest {
background-color: #46459B; }
.head-primary .search-suggest .search-suggest-item {
border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.head-primary .search-suggest a.btn {
background-color: #FFFFFF;
color: #46459B;
fill: #46459B; }
.head-primary .modal-close {
fill: #FFFFFF; }
.head-primary .nav-primary .nav-list .nav-item {
border-color: rgba(255, 255, 255, 0.2); }
.head-primary .nav-primary .nav-list .list-subitems {
background-color: rgba(0, 0, 0, 0.18); }

.subutility-list {
background-color: #46459B;
box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2); }

.head-light .subutility-list {
background-color: #FFFFFF; }

.head-light .search-suggest {
background-color: #FFFFFF; }
.head-light .search-suggest a.btn {
color: #FFFFFF;
fill: #FFFFFF; }

.head-light .nav-list-link {
border-color: rgba(0, 0, 0, 0.2); }

.head-light .modal-close {
fill: #46459B; }

.head-light .nav-primary .nav-list .nav-item {
border-color: rgba(0, 0, 0, 0.1); }

.head-light .nav-primary .nav-list .list-subitems {
background-color: rgba(0, 0, 0, 0.18); }

.head-dark .subutility-list {
background-color: #000000; }

.head-dark .search-input-submit {
fill: #000000; }

.head-dark .search-suggest {
background-color: #000000; }
.head-dark .search-suggest .search-suggest-item {
border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.head-dark .search-suggest a.btn {
background-color: #FFFFFF;
color: #46459B;
fill: #46459B; }

#6

image
image1366×768 273 KB

usando esse codigo

.head-primary {
background-color: #000000; }

se precisar pode chamar

#7

Muito Obrigado @artezenesoterica , ja ajudou demais!
Muito obrigado mesmo por tomar seu tempo e nos ajudar!

Boas vendas e sucesso!

1 curtida
#8

Oii, eu precisava de algo parecido, mas ao invés da cor de fundo eu preciso alterar a cor do texto do rodapé e cabeçalho, você sabe qual usar? Tentei usar um mas só mudou uma parte dos textos:
body > footer

{color: #b76e79}

#9

Vc consegui? Também estou querendo fazer o mesmo

#10

Gostaria de saber se vc conseguiu e se pode disponibilizar o script por favor. Abs

#11

Se abaixo o codigo que estou usando na seção css avançado. Lembrando que tambem é possivel fazer mudanças na propia seção de cores da marca e mudando as cores em hexadecimal. Quem nao souber da uma estudadinha no google.

footer {
color: #000000;
}

footer a, footer .contact-link {
color: #000000;
}

footer .contact-item-icon {
fill: #000000;
}

.social-icon-rounded {
background: #000000;
fill: #FFFFFF;
}

.head-dark,
.head-primary {
color: #000000;
fill: #000000;
background-color: #DA70D6; }
.head-dark .svg-icon-text,
.head-dark .nav-desktop-list > .nav-item > .nav-list-link,
.head-dark .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link,
.head-dark .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-arrow > i,
.head-dark .utilities-item svg,
.head-primary .svg-icon-text,
.head-primary .nav-desktop-list > .nav-item > .nav-list-link,
.head-primary .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link,
.head-primary .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-arrow > i,
.head-primary .utilities-item svg {
color: #000000;
fill: #000000;
border-color: rgba(255, 255, 255, 0.2); }
.head-dark .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link.selected,
.head-dark .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link.selected + .nav-list-arrow > i,
.head-primary .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link.selected,
.head-primary .nav-desktop-list > .nav-item > .nav-item-container > .nav-list-link.selected + .nav-list-arrow > i {
color: #000000;
fill: #000000;
opacity: 0.6; }
.head-dark .form-control,
.head-primary .form-control {
background-color: #FFFFFF;
border: 0; }
.head-dark a,
.head-primary a {
color: #000000;
fill: #000000; }
.head-dark .btn-secondary,
.head-primary .btn-secondary {
color: #46459B; }
.head-dark .badge,
.head-primary .badge {
color: #000000;
background: #46459B; }