TCVSquarespace

On 1/3/2022 at 12:09 PM, TCVSquarespace said:

Hello again @tuanphan - I was able to figure out how to do this. Thanks again for your help. 🙂

Hi @tuanphan - while I was able to figure out how to change the color of all the drop down links it seems that it only worked for desktop. The same with the main navigation links. They are all just one color. How can this be changed on mobile? I want my main navigation links and the drop down links to all be different colors.

On 1/8/2022 at 5:01 AM, tuanphan said:

Add to Design > Custom CSS

/* the blog */
.user-items-list-item-container[data-section-id="61aa520fe389162602cf9ccb"] {
li:nth-child(1) h2 {
    color: yellow !important;
}
li:nth-child(1) a.list-item-content__button {
    background-color: yellow !important;
}
li:nth-child(2) h2 {
    color: red !important;
}
li:nth-child(2) a.list-item-content__button {
    background-color: red !important;
}
li:nth-child(3) h2 {
    color: blue !important;
}
li:nth-child(3) a.list-item-content__button {
    background-color: blue !important;
}
}

#2. Where is blog?

You are a lifesaver. Thar code worked. Thank you.

Try this for the blog: https://welcome-to-the-colorverse.squarespace.com/blog The first post is gold. how do I change the title gold to the color gold. Right now it's in blue. Also I would like to change the color of all future blog post titles that will come up there.

On 1/3/2022 at 12:09 PM, TCVSquarespace said:

Hello again @tuanphan - I was able to figure out how to do this. Thanks again for your help. 🙂

Hi @tuanphan - I've come with 2 other questions. On the homepage of the site if you scroll down towards the middle of the page I have "The Blog" and I have excerpts of 3 of my blog posts (gold, white, and gray) - How would I go about changing the color of the titles - I want gold to be the color gold, white to be white, etc... And I would also like the buttons that say "read more" "coming in february" to be a different color as well, instead of the black button.

http://www.welcometothecolorverse.com - Password: Sunny123

Also on my blog page which you can access by clicking on "read" on the top navigation - as you can see right now the title of the blog is "gold" but gold is in blue. How can I change the color of that?

Thanks for your help.

On 1/1/2022 at 11:13 AM, TCVSquarespace said:

Thanks so much @tuanphan this worked for the navigation. Much appreciated and happy new year. How would I go about changing the color of the links that you see when you hover over the main navigation? For instance my main navigation link "look" has 12 different sub navigation links. How would I change the colors to those?

Hello again @tuanphan - I was able to figure out how to do this. Thanks again for your help. 🙂

13 hours ago, tuanphan said:

Add to Design > Custom CSS. Do similar for other items

.header-nav-item:nth-child(1) a {
    color: blue !important;
}
.header-nav-item:nth-child(2) a {
    color: red !important;
}
.header-nav-item:nth-child(3) a {
    color: yellow !important;
}

 

Thanks so much @tuanphan this worked for the navigation. Much appreciated and happy new year. How would I go about changing the color of the links that you see when you hover over the main navigation? For instance my main navigation link "look" has 12 different sub navigation links. How would I change the colors to those?

On 12/18/2021 at 9:28 PM, tuanphan said:

Can you share link to your site? Each case will need a different code

@tuanphan Here it is: http://www.welcometothecolorverse.com - Password: Sunny123 - I also was wondering if each link in my navigation could be a different color as well.

Thanks in advance for your help.

Hello everyone and hello @tuanphan

I'm looking for every item on my dropdown menu to be a different color. I have a screenshot of my dropdown menu where all text links are pink but I would like each text link to be a different color (the gold text to be gold, the white to be white, etc...).

Here is code that is already on my site if that is helpful.

// Slanted Linked Elements //

.header-nav a:hover {
transform: skewX(20deg) !important;
}

.header-title-logo:hover, .header-title a:hover {
transform: skewX(20deg) !important;
}

.header-actions-action--cta:hover {
transform: skewX(20deg) !important;
}

.icon:hover, .sqs-svg-icon--wrapper svg:hover {
transform: skewX(20deg) !important;
}

.sqs-block-button-element:hover, .image-button a:hover {
transform: skewX(20deg) !important;
}

// Markdown Block Style + Icon //

.sqs-block-markdown .sqs-block-content {
  border: 2px solid #374ac8;
  background: transparent;
  padding: 10% !important;
}

// Contact and Newsletter Form Style //

form {
  border: 2px solid #3baabd;
  background: #fff;
  padding: 10% !important;
}

// Mini Announcement Bar //

.sqs-announcement-bar  {
  padding: 15px;
  margin: 0px;
  bottom: 0px;
  width: auto !important;
  position: fixed;
  top: initial !important;
}

.sqs-announcement-bar-hidden {
  display: none !important;
}
#item-61996c65f4827c151be43822 .blog-item-wrapper .blog-item-title h1.entry-title {
  color: #FFD700 !important;
}