Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
ecs_cares

Change Navigation Bar Colour on One Page/Make logo smaller

Recommended Posts

Hi! I was wondering if anyone can help me come up with a code to change my navigation bar colours to be different on my products page.

It is currently transparent and gets lost when scrolling.

My other question is how to code my logo and navigation bar to be fixed but get smaller upon scrolling.

The template I am using is Brine.

Share this post


Link to post

@ecs_cares

1. Add to Home > Design > Custom CSS

If it doesn't work, please share product page url to check code.

.collection-type-products.view-item header.Header {
    background: #f1f2f3 !important;
}

2.  Fixed

.Header.Header--top {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
}

3. get smaller upon scrolling.

You need to use JavaScript, a bit complicated. Wait for someone to help you.

(or contact me, in signature (not free))

Share this post


Link to post
3 hours ago, tuanphan said:

@ecs_cares

1. Add to Home > Design > Custom CSS

If it doesn't work, please share product page url to check code.


.collection-type-products.view-item header.Header {
    background: #f1f2f3 !important;
}

2.  Fixed


.Header.Header--top {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
}

3. get smaller upon scrolling.

You need to use JavaScript, a bit complicated. Wait for someone to help you.

(or contact me, in signature (not free))

Okay, thank you so much!! 🙂

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...